groove/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-12-16 00:39:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

Fix: Setting root socket error, Change: collection books table ordering and icons #151

Browse source
This commit is contained in:
advplyr 2021-11-07 15:28:06 -06:00
parent d115382abe
commit 0980b6d5d5
12 changed files with 168 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

10
client/components/ui/IconBtn.vue
View file

@ -1,5 +1,5 @@
<template>
<button class="icon-btn rounded-md border border-gray-600 flex items-center justify-center h-9 w-9 relative" :disabled="disabled" :class="className" @click="clickBtn">
<button class="icon-btn rounded-md flex items-center justify-center h-9 w-9 relative" @mousedown.prevent :disabled="disabled" :class="className" @click="clickBtn">
<span :class="outlined ? 'material-icons-outlined' : 'material-icons'" :style="{ fontSize }">{{ icon }}</span>
</button>
</template>
@ -13,7 +13,8 @@ export default {
type: String,
default: 'primary'
},
outlined: Boolean
outlined: Boolean,
borderless: Boolean
},
data() {
return {}
@ -21,7 +22,9 @@ export default {
computed: {
className() {
var classes = []
classes.push(`bg-${this.bgColor}`)
if (!this.borderless) {
classes.push(`bg-${this.bgColor} border border-gray-600`)
}
return classes.join(' ')
},
fontSize() {
@ -35,6 +38,7 @@ export default {
e.preventDefault()
return
}
e.preventDefault()
this.$emit('click')
e.stopPropagation()
}

5
client/components/ui/ReadIconBtn.vue
View file

@ -1,5 +1,5 @@
<template>
<button class="icon-btn rounded-md bg-primary border border-gray-600 flex items-center justify-center h-9 w-9 relative" @click="clickBtn">
<button class="icon-btn rounded-md flex items-center justify-center h-9 w-9 relative" :class="borderless ? '' : 'bg-primary border border-gray-600'" @click="clickBtn">
<div class="w-5 h-5 text-white relative">
<svg v-if="isRead" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="rgb(63, 181, 68)">
<path d="M19 1H5c-1.1 0-1.99.9-1.99 2L3 15.93c0 .69.35 1.3.88 1.66L12 23l8.11-5.41c.53-.36.88-.97.88-1.66L21 3c0-1.1-.9-2-2-2zm-9 15l-5-5 1.41-1.41L10 13.17l7.59-7.59L19 7l-9 9z" />
@ -15,7 +15,8 @@
export default {
props: {
isRead: Boolean,
disabled: Boolean
disabled: Boolean,
borderless: Boolean
},
data() {
return {}