mirror of
https://github.com/koel/koel
synced 2024-12-21 01:53:11 +00:00
34 lines
819 B
Vue
34 lines
819 B
Vue
<template>
|
|
<label v-if="isMobile.phone" class="text-highlight">
|
|
<input type="checkbox" v-model="value"/>
|
|
<icon :icon="value ? faAngleUp : faAngleDown" class="toggle"/>
|
|
<span>Toggle the song list controls</span>
|
|
</label>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { faAngleDown, faAngleUp } from '@fortawesome/free-solid-svg-icons'
|
|
import isMobile from 'ismobilejs'
|
|
import { computed } from 'vue'
|
|
|
|
const props = withDefaults(defineProps<{ modelValue?: boolean }>(), { modelValue: false })
|
|
|
|
const emit = defineEmits(['update:modelValue'])
|
|
|
|
const value = computed({
|
|
get: () => props.modelValue,
|
|
set: value => emit('update:modelValue', value)
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
label {
|
|
font-size: 1rem;
|
|
display: inline-block;
|
|
margin-left: 4px;
|
|
}
|
|
|
|
input, span {
|
|
display: none;
|
|
}
|
|
</style>
|