Skip to content

Commit 577657c

Browse files
rstoenescurstoenescu
committed
feat(docs): QTime review
1 parent cd6e40a commit 577657c

File tree

16 files changed

+97
-194
lines changed

16 files changed

+97
-194
lines changed

‎docs/src/examples/QTime/Basic.vue‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
11
<template>
2-
<div class="q-pa-md q-gutter-md">
3-
<div class="row justify-center">
2+
<div class="q-pa-md column">
3+
<div class="q-gutter-md">
4+
<q-time v-model="time" />
5+
46
<q-time
5-
v-model="time"
7+
v-model="timeWithSeconds"
8+
with-seconds
69
/>
710
</div>
811
</div>
@@ -12,7 +15,8 @@
1215
export default {
1316
data () {
1417
return {
15-
time: '10:56'
18+
time: '10:56',
19+
timeWithSeconds: '09:24:10'
1620
}
1721
}
1822
}

‎docs/src/examples/QTime/Color.vue‎

Lines changed: 10 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,15 @@
11
<template>
22
<div class="q-pa-md q-gutter-md">
3-
<div class="row justify-center">
4-
<q-time
5-
v-model="time"
6-
color="secondary"
7-
/>
8-
</div>
9-
<div class="row justify-center">
10-
<q-time
11-
v-model="time"
12-
color="orange-7"
13-
/>
14-
</div>
15-
<div class="row justify-center">
16-
<q-time
17-
v-model="time"
18-
color="blue-grey-7"
19-
/>
20-
</div>
21-
<div class="row justify-center">
22-
<q-time
23-
v-model="time"
24-
color="purple-3"
25-
/>
26-
</div>
3+
<q-time
4+
v-model="time"
5+
color="orange"
6+
/>
7+
8+
<q-time
9+
v-model="time"
10+
color="yellow"
11+
text-color="black"
12+
/>
2713
</div>
2814
</template>
2915

‎docs/src/examples/QTime/Dark.vue‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
11
<template>
22
<div class="q-pa-md bg-grey-10 text-white">
3-
<div class="row justify-center">
3+
<div class="q-gutter-md">
44
<q-time
55
v-model="time"
66
dark
77
/>
8+
9+
<q-time
10+
v-model="time"
11+
color="orange"
12+
text-color="black"
13+
dark
14+
/>
815
</div>
916
</div>
1017
</template>

‎docs/src/examples/QTime/Disable.vue‎

Lines changed: 0 additions & 20 deletions
This file was deleted.

docs/src/examples/QTime/Readonly.vue renamed to docs/src/examples/QTime/DisableReadonly.vue

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
<template>
22
<div class="q-pa-md q-gutter-md">
3-
<div class="row justify-center">
3+
<div class="q-gutter-md">
4+
<q-time
5+
v-model="time"
6+
disable
7+
/>
8+
49
<q-time
510
v-model="time"
611
readonly

‎docs/src/examples/QTime/Format24h.vue‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,17 @@
11
<template>
2-
<div class="q-pa-md q-gutter-md">
3-
<div class="row justify-center">
4-
<q-time
5-
v-model="time"
6-
format24h
7-
/>
8-
</div>
2+
<div class="q-pa-md">
3+
<q-time
4+
v-model="time"
5+
format24h
6+
/>
97
</div>
108
</template>
119

1210
<script>
1311
export default {
1412
data () {
1513
return {
16-
time: '10:56'
14+
time: '19:42'
1715
}
1816
}
1917
}

‎docs/src/examples/QTime/Input.vue‎

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,21 @@
11
<template>
2-
<div class="q-pa-md q-gutter-md">
3-
<div class="row justify-center">
4-
<q-input filled v-model="fullTime" mask="time" :rules="['time']">
2+
<div class="q-pa-md">
3+
<div class="q-gutter-sm row">
4+
<q-input filled v-model="time" mask="time" :rules="['time']">
55
<q-icon slot="append" name="access_time" class="cursor-pointer">
66
<q-popup-proxy>
77
<q-time
8-
v-model="fullTime"
8+
v-model="time"
99
/>
1010
</q-popup-proxy>
1111
</q-icon>
1212
</q-input>
13-
</div>
14-
<div class="row justify-center">
15-
<q-input filled v-model="time" mask="fulltime" :rules="['fulltime']">
13+
14+
<q-input filled v-model="timeWithSeconds" mask="fulltime" :rules="['fulltime']">
1615
<q-icon slot="append" name="access_time" class="cursor-pointer">
1716
<q-popup-proxy>
1817
<q-time
19-
v-model="time"
18+
v-model="timeWithSeconds"
2019
with-seconds
2120
format24h
2221
/>
@@ -32,7 +31,7 @@ export default {
3231
data () {
3332
return {
3433
time: '10:56',
35-
fullTime: '10:56:00'
34+
timeWithSeconds: '10:56:00'
3635
}
3736
}
3837
}

‎docs/src/examples/QTime/Landscape.vue‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,16 @@
11
<template>
2-
<div class="q-pa-md q-gutter-md">
3-
<div class="row justify-center">
2+
<div class="q-pa-md">
3+
<div class="q-gutter-md">
44
<q-time
55
v-model="time"
66
landscape
77
/>
8+
9+
<q-time
10+
v-model="timeWithSeconds"
11+
with-seconds
12+
landscape
13+
/>
814
</div>
915
</div>
1016
</template>
@@ -13,7 +19,8 @@
1319
export default {
1420
data () {
1521
return {
16-
time: '10:56'
22+
time: '10:56',
23+
timeWithSeconds: '09:24:10'
1724
}
1825
}
1926
}

‎docs/src/examples/QTime/NowBtn.vue‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,17 @@
11
<template>
2-
<div class="q-pa-md q-gutter-md">
3-
<div class="row justify-center">
4-
<q-time
5-
v-model="time"
6-
now-btn
7-
/>
8-
</div>
2+
<div class="q-pa-md">
3+
<q-time
4+
v-model="time"
5+
now-btn
6+
/>
97
</div>
108
</template>
119

1210
<script>
1311
export default {
1412
data () {
1513
return {
16-
time: '10:56'
14+
time: '04:56'
1715
}
1816
}
1917
}

docs/src/examples/QTime/OptionsFunction.vue renamed to docs/src/examples/QTime/Options.vue

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
11
<template>
2-
<div class="q-pa-md q-gutter-md">
3-
<div class="row justify-center">
2+
<div class="q-pa-md">
3+
<div class="q-gutter-md">
4+
<q-time
5+
v-model="time"
6+
:hour-options="hourOptions"
7+
:minute-options="minuteOptions"
8+
:second-options="secondOptions"
9+
/>
10+
411
<q-time
512
v-model="time"
613
:options="optionsFn"
@@ -13,7 +20,11 @@
1320
export default {
1421
data () {
1522
return {
16-
time: '10:56'
23+
time: '10:56',
24+
25+
hourOptions: [9, 10, 11, 13, 15],
26+
minuteOptions: [0, 15, 30, 45],
27+
secondOptions: [0, 10, 20, 30, 40, 50]
1728
}
1829
},
1930
@@ -31,6 +42,5 @@ export default {
3142
return true
3243
}
3344
}
34-
3545
}
3646
</script>

0 commit comments

Comments
 (0)