@hostlink/nuxt-light 1.21.13 → 1.21.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/module.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
body{font-family:Noto Sans,Noto Sans HK,Noto Sans TC,-apple-system,Helvetica Neue,Helvetica,Arial,sans-serif}.q-card__actions .q-btn--rectangle{padding:4px 16px}.q-table--dense .q-table td,.q-table--dense .q-table td:first-child,.q-table--dense .q-table th,.q-table--dense .q-table th:first-child{padding:2px 4px}.q-tab-panel{padding:8px}
|
|
1
|
+
body{font-family:Noto Sans,Noto Sans HK,Noto Sans TC,-apple-system,Helvetica Neue,Helvetica,Arial,sans-serif}.q-card__actions .q-btn--rectangle{padding:4px 16px}.q-table--dense .q-table td,.q-table--dense .q-table td:first-child,.q-table--dense .q-table th,.q-table--dense .q-table th:first-child{padding:2px 4px}.q-tab-panel{padding:8px}::-webkit-scrollbar{background:transparent;height:12px;overflow:visible;width:14px;z-index:12}::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:#c1c1c1;border:4px solid transparent;border-radius:10px;margin:4px;min-height:32px;min-width:32px;-webkit-transition:background-color .32s ease-in-out;transition:background-color .32s ease-in-out;width:10px;z-index:12}::-webkit-scrollbar-thumb:hover{background:#c1c1c1}
|
|
@@ -283,10 +283,13 @@ const onLogout = async () => {
|
|
|
283
283
|
|
|
284
284
|
</script>
|
|
285
285
|
|
|
286
|
+
|
|
287
|
+
|
|
286
288
|
<style scoped>
|
|
287
289
|
.q-layout__section--marginal{background-color:v-bind(c1)}
|
|
288
290
|
</style>
|
|
289
291
|
|
|
292
|
+
|
|
290
293
|
<template>
|
|
291
294
|
<q-layout :view="layoutView">
|
|
292
295
|
<q-header bordered class="text-white" :class="`bg-${light.color}`">
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<script setup>
|
|
2
2
|
import { q, m } from '#imports'
|
|
3
|
-
import { ref } from 'vue'
|
|
3
|
+
import { ref, computed } from 'vue'
|
|
4
4
|
let { my } = await q({
|
|
5
5
|
my: {
|
|
6
6
|
styles: true
|
|
@@ -12,7 +12,9 @@ const defaultStyle = {
|
|
|
12
12
|
dense: true,
|
|
13
13
|
flat: true,
|
|
14
14
|
bordered: true,
|
|
15
|
+
square: false,
|
|
15
16
|
separator: 'cell'
|
|
17
|
+
|
|
16
18
|
},
|
|
17
19
|
card: {
|
|
18
20
|
flat: true,
|
|
@@ -21,14 +23,20 @@ const defaultStyle = {
|
|
|
21
23
|
},
|
|
22
24
|
button: {
|
|
23
25
|
outline: false,
|
|
24
|
-
|
|
26
|
+
flat: false,
|
|
25
27
|
unelevated: false,
|
|
28
|
+
rounded: false,
|
|
29
|
+
push: false,
|
|
30
|
+
square: false,
|
|
31
|
+
glossy: false,
|
|
26
32
|
dense: false
|
|
27
33
|
},
|
|
28
34
|
input: {
|
|
29
35
|
filled: false,
|
|
30
36
|
outlined: true,
|
|
31
37
|
standout: false,
|
|
38
|
+
borderless: false,
|
|
39
|
+
standout: false,
|
|
32
40
|
rounded: false,
|
|
33
41
|
dense: false,
|
|
34
42
|
square: false,
|
|
@@ -67,7 +75,28 @@ const columns = [
|
|
|
67
75
|
{ name: 'phone', label: 'Phone', align: 'left', field: 'phone', sortable: true },
|
|
68
76
|
]
|
|
69
77
|
|
|
78
|
+
|
|
70
79
|
const preview = ref({})
|
|
80
|
+
|
|
81
|
+
const inputDesign = computed({
|
|
82
|
+
set: (value) => {
|
|
83
|
+
styles.value.input.filled = value === 'filled'
|
|
84
|
+
styles.value.input.outlined = value === 'outlined'
|
|
85
|
+
styles.value.input.standout = value === 'standout'
|
|
86
|
+
styles.value.input.borderless = value === 'borderless'
|
|
87
|
+
},
|
|
88
|
+
get: () => {
|
|
89
|
+
if (styles.value.input.filled) return 'filled'
|
|
90
|
+
if (styles.value.input.outlined) return 'outlined'
|
|
91
|
+
if (styles.value.input.standout) return 'standout'
|
|
92
|
+
if (styles.value.input.borderless) return 'borderless'
|
|
93
|
+
return 'none'
|
|
94
|
+
}
|
|
95
|
+
});
|
|
96
|
+
|
|
97
|
+
|
|
98
|
+
|
|
99
|
+
|
|
71
100
|
</script>
|
|
72
101
|
<template>
|
|
73
102
|
<div class="q-pa-md">
|
|
@@ -79,6 +108,7 @@ const preview = ref({})
|
|
|
79
108
|
<q-toggle v-model="styles.table.dense" label="Dense" :color="$light.color" />
|
|
80
109
|
<q-toggle v-model="styles.table.flat" label="Flat" :color="$light.color" />
|
|
81
110
|
<q-toggle v-model="styles.table.bordered" label="Bordered" :color="$light.color" />
|
|
111
|
+
<q-toggle v-model="styles.table.square" label="Square" :color="$light.color" />
|
|
82
112
|
|
|
83
113
|
<q-field :label="`Separator`" stack-label :color="$light.color">
|
|
84
114
|
<q-option-group v-model="styles.table.separator" inline :options="[
|
|
@@ -102,17 +132,30 @@ const preview = ref({})
|
|
|
102
132
|
<l-card title="Button" minimizable>
|
|
103
133
|
<q-card-section>
|
|
104
134
|
<q-toggle v-model="styles.button.outline" label="Outline" :color="$light.color" />
|
|
105
|
-
<q-toggle v-model="styles.button.
|
|
135
|
+
<q-toggle v-model="styles.button.flat" label="Flat" :color="$light.color" />
|
|
106
136
|
<q-toggle v-model="styles.button.unelevated" label="Unelevated" :color="$light.color" />
|
|
137
|
+
<q-toggle v-model="styles.button.rounded" label="Rounded" :color="$light.color" />
|
|
138
|
+
<q-toggle v-model="styles.button.push" label="Push" :color="$light.color" />
|
|
139
|
+
<q-toggle v-model="styles.button.square" label="Square" :color="$light.color" />
|
|
140
|
+
<q-toggle v-model="styles.button.glossy" label="Glossy" :color="$light.color" />
|
|
107
141
|
<q-toggle v-model="styles.button.dense" label="Dense" :color="$light.color" />
|
|
142
|
+
|
|
108
143
|
</q-card-section>
|
|
109
144
|
</l-card>
|
|
110
145
|
|
|
111
146
|
<l-card title="Input" minimizable>
|
|
112
147
|
<q-card-section>
|
|
113
|
-
|
|
114
|
-
<q-
|
|
115
|
-
|
|
148
|
+
|
|
149
|
+
<q-option-group v-model="inputDesign" inline :options="[
|
|
150
|
+
{ label: 'None', value: 'none' },
|
|
151
|
+
{ label: 'Filled', value: 'filled' },
|
|
152
|
+
{ label: 'Outlined', value: 'outlined' },
|
|
153
|
+
{ label: 'Standout', value: 'standout' },
|
|
154
|
+
{ label: 'Borderless', value: 'borderless' },
|
|
155
|
+
]" :color="$light.color" />
|
|
156
|
+
|
|
157
|
+
|
|
158
|
+
|
|
116
159
|
<q-toggle v-model="styles.input.rounded" label="Rounded" :color="$light.color" />
|
|
117
160
|
<q-toggle v-model="styles.input.dense" label="Dense" :color="$light.color" />
|
|
118
161
|
<q-toggle v-model="styles.input.square" label="Square" :color="$light.color" />
|
|
@@ -148,7 +191,7 @@ const preview = ref({})
|
|
|
148
191
|
{ name: 'A', phone: '123' },
|
|
149
192
|
{ name: 'B', phone: '456' },
|
|
150
193
|
{ name: 'C', phone: '789' },
|
|
151
|
-
]" v-bind="styles.table" selection="multiple">
|
|
194
|
+
]" v-bind="styles.table" selection="multiple" title="Table">
|
|
152
195
|
|
|
153
196
|
<template #body-cell-action="props">
|
|
154
197
|
<q-td auto-width>
|