Skip to content

Commit 89e667f

Browse files
committed
fix: Preparing v0.7.0 final build
1 parent 9d63782 commit 89e667f

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

66 files changed

+732
-443
lines changed

dev/views/card.vue

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -185,29 +185,29 @@
185185
</div>
186186
</div>
187187

188-
<div class="card">
189-
<div class="card-title bg-purple text-white">
190-
Card with Collapsible
188+
<div class="card" style="margin-top: 25px;">
189+
<div class="card-title">
190+
Card with Collapsible List
191191
</div>
192-
<ul class="collapsible">
193-
<li v-collapsible>
194-
<div><i>filter_drama</i>First</div>
192+
<div class="list no-border">
193+
<hr>
194+
<quasar-collapsible icon="explore" label="First">
195195
<div>
196196
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
197197
</div>
198-
</li>
199-
<li v-collapsible>
200-
<div><i>place</i>Second</div>
198+
</quasar-collapsible>
199+
<hr>
200+
<quasar-collapsible icon="perm_identity" label="Second">
201201
<div>
202202
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
203203
</div>
204-
</li>
205-
<li v-collapsible>
206-
<div><i>whatshot</i>Third</div>
204+
</quasar-collapsible>
205+
<hr>
206+
<quasar-collapsible icon="shopping_cart" label="Third">
207207
<div>
208208
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
209209
</div>
210-
</li>
210+
</quasar-collapsible>
211211
</ul>
212212
</div>
213213
</template>

dev/views/dialog.vue

Lines changed: 35 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,47 @@
11
<template>
2-
<button class="primary" @click="alert()">Alert</button>
3-
<button class="primary" @click="prompt()">Prompt</button>
4-
<button class="primary" @click="confirm()">Confirm</button>
5-
<button class="primary" @click="radio()">Radio</button>
6-
<button class="primary" @click="checkbox()">Checkbox</button>
7-
<button class="primary" @click="checkbox(true)">Toggle</button>
8-
<button class="primary" @click="progress()">Progress</button>
9-
<button class="primary" @click="progress2()">Progress 2</button>
2+
<div class="group">
3+
<button class="primary" @click="alert()">Alert</button>
4+
<button class="primary" @click="prompt()">Prompt</button>
5+
<button class="primary" @click="confirm()">Confirm</button>
6+
<button class="primary" @click="radio()">Radio</button>
7+
<button class="primary" @click="checkbox()">Checkbox</button>
8+
<button class="primary" @click="checkbox(true)">Toggle</button>
9+
<button class="primary" @click="progress()">Progress</button>
10+
<button class="primary" @click="progress2()">Progress 2</button>
1011

11-
<br>
12-
<button class="primary" @click="stacked()">Stacked Buttons</button>
12+
<br>
13+
<button class="primary" @click="stacked()">Stacked Buttons</button>
14+
<button class="primary" @click="handlerTest()">HandlerTest</button>
15+
</div>
1316
</template>
1417

1518
<script>
1619
import { Dialog } from 'quasar'
1720
1821
export default {
1922
methods: {
23+
handlerTest () {
24+
Dialog.create({
25+
title: 'Handler Test',
26+
message: 'OK opens up another Dialog',
27+
buttons: [
28+
'Cancel',
29+
{
30+
label: 'Ok',
31+
handler () {
32+
console.log('handler()')
33+
Dialog.create({
34+
title: 'Handler Test',
35+
buttons: [
36+
'Cancel',
37+
'OK'
38+
]
39+
}).show()
40+
}
41+
}
42+
]
43+
}).show()
44+
},
2045
alert () {
2146
Dialog.create({
2247
title: 'Alert',

dev/views/grid.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<div class="layout-padding">
3-
<h1>Grid Widget</h1>
3+
<h1>Grid Component</h1>
44
<quasar-grid
55
:columns="columns"
66
:data="data"

dev/views/modal.vue

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,16 @@
1212
<button class="primary" @click="showInlineModal()">Show Inline Modal</button>
1313
</p>
1414

15-
<quasar-modal :config="{minimized: true}" :css="{minWidth: '30vw', minHeight: '30vh'}" v-ref:modal>
15+
<quasar-modal :set="{minimized: true}" :css="{minWidth: '30vw', minHeight: '30vh'}" v-ref:modal>
1616
<div style="padding: 50px">
1717
<div>Some simple Modal</div>
1818
<div>Variable from parent Vue scope: {{ modalVariable }}</div>
1919
<br><br>
2020
<button class="primary" @click="$refs.modal.close()">Close</button>
2121
</div>
2222
</quasar-modal>
23+
24+
<div style="height: 2000px">&nbsp;</div>
2325
</template>
2426

2527
<script>

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "quasar-framework",
3-
"version": "0.6.0",
3+
"version": "0.7.0",
44
"description": "Simultaneously build desktop/mobile SPA websites & phone/tablet apps with VueJS",
55
"main": "dist/quasar.common.js",
66
"jsnext:main": "dist/quasar.es6.js",

src/components/dialog/dialog.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
{{{* message}}}
77
</div>
88
<div v-if="inputs" class="modal-body modal-scroll">
9-
<div v-for="input in inputs" class="floating-label">
9+
<div v-for="input in inputs" class="floating-label" style="margin-bottom: 10px">
1010
<input type="text" class="full-width" v-model="input.model" required>
1111
<label>{{ input.label }}</label>
1212
</div>
@@ -59,7 +59,7 @@
5959
<button
6060
v-for="button in buttons"
6161
class="primary clear"
62-
@click="button.handler(getData()), close()"
62+
@click="trigger(button.handler)"
6363
>
6464
{{{* button.label}}}
6565
</button>

src/components/dialog/dialog.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,13 @@ function create (options) {
122122
template: template,
123123
data: data,
124124
methods: {
125+
trigger (handler) {
126+
let data = this.getData()
127+
function fn () {
128+
handler(data)
129+
}
130+
this.close(fn)
131+
},
125132
getData () {
126133
if (this.inputs) {
127134
return this.inputs.map(input => {

src/components/modal/modal.ios.styl

Lines changed: 56 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -44,64 +44,68 @@ maximized-modal()
4444
min-width 280px
4545
max-height 80vh
4646

47-
.modal-header
48-
text-align $modal-header-text-align
49-
padding $modal-header-padding
50-
font-size $modal-header-font-size
51-
font-weight 500
52-
53-
.modal-body
54-
padding $modal-body-padding
55-
.modal-slim-body
56-
padding $modal-slim-body-padding
57-
.modal-body, .modal-slim-body
58-
text-align $modal-body-text-align
59-
color $modal-body-color
60-
61-
.modal-controls
62-
border-top 1px solid $form-darker-color
63-
border-bottom 1px solid $form-darker-color
64-
&.list
65-
margin 0
66-
67-
.small-modal-scroll, .modal-scroll, .big-modal-scroll
68-
overflow auto
69-
-webkit-overflow-scrolling touch
70-
will-change scroll-position
71-
.small-modal-scroll
72-
max-height (.65 * $modal-scroll-size)
73-
.modal-scroll
74-
max-height $modal-scroll-size
75-
.big-modal-scroll
76-
max-height (2 * $modal-scroll-size)
77-
78-
79-
.modal-buttons
80-
padding $modal-buttons-padding
81-
border-top 1px solid $form-darker-color
82-
button
83-
flex 1 1 auto
84-
font-size 110%
85-
margin 0
86-
padding 1rem
87-
border-radius 0
88-
&:last-child
89-
font-weight bold
90-
&:hover, &:active
91-
color white !important
92-
background rgba(0, 0, 0, .3) !important
93-
&.row
94-
button + button
95-
border-left 1px solid $form-darker-color
96-
&.column
97-
button + button
98-
border-top 1px solid $form-darker-color
47+
.layout
48+
width 100%
49+
height 100%
9950

10051
&.minimized
10152
minimized-modal()
10253
&.maximized
10354
maximized-modal()
10455

56+
.modal-header
57+
text-align $modal-header-text-align
58+
padding $modal-header-padding
59+
font-size $modal-header-font-size
60+
font-weight 500
61+
62+
.modal-body
63+
padding $modal-body-padding
64+
.modal-slim-body
65+
padding $modal-slim-body-padding
66+
.modal-body, .modal-slim-body
67+
text-align $modal-body-text-align
68+
color $modal-body-color
69+
70+
.modal-controls
71+
border-top 1px solid $form-darker-color
72+
border-bottom 1px solid $form-darker-color
73+
&.list
74+
margin 0
75+
76+
.small-modal-scroll, .modal-scroll, .big-modal-scroll
77+
overflow auto
78+
-webkit-overflow-scrolling touch
79+
will-change scroll-position
80+
.small-modal-scroll
81+
max-height (.65 * $modal-scroll-size)
82+
.modal-scroll
83+
max-height $modal-scroll-size
84+
.big-modal-scroll
85+
max-height (2 * $modal-scroll-size)
86+
87+
88+
.modal-buttons
89+
padding $modal-buttons-padding
90+
border-top 1px solid $form-darker-color
91+
button
92+
flex 1 1 auto
93+
font-size 110%
94+
margin 0
95+
padding 1rem
96+
border-radius 0
97+
&:last-child
98+
font-weight bold
99+
&:hover, &:active
100+
color white !important
101+
background rgba(0, 0, 0, .3) !important
102+
&.row
103+
button + button
104+
border-left 1px solid $form-darker-color
105+
&.column
106+
button + button
107+
border-top 1px solid $form-darker-color
108+
105109
@media screen and (max-width $layout-small-max)
106110
.modal-content:not(.minimized)
107111
maximized-modal()

src/components/modal/modal.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -146,7 +146,9 @@ class Modal {
146146
duration,
147147
complete: () => {
148148
this.$el.classList.add('hidden')
149-
document.body.classList.remove('with-modal')
149+
if (!openedModalNumber) {
150+
document.body.classList.remove('with-modal')
151+
}
150152

151153
if (this.selfDestroy) {
152154
this.destroy()

src/components/modal/modal.mat.styl

Lines changed: 41 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,6 @@ maximized-modal()
3030
max-width 100vw
3131
max-height 100vh
3232
border-radius 0
33-
.screen
34-
position relative
3533

3634
.modal
3735
z-index $z-modal
@@ -44,49 +42,53 @@ maximized-modal()
4442
min-width 280px
4543
max-height 80vh
4644

47-
.modal-header
48-
text-align $modal-header-text-align
49-
padding $modal-header-padding
50-
font-size $modal-header-font-size
51-
font-weight 500
52-
53-
.modal-body
54-
padding $modal-body-padding
55-
.modal-slim-body
56-
padding $modal-slim-body-padding
57-
.modal-body, .modal-slim-body
58-
text-align $modal-body-text-align
59-
color $modal-body-color
60-
61-
.modal-controls
62-
border-top 1px solid $form-darker-color
63-
border-bottom 1px solid $form-darker-color
64-
&.list
65-
margin 0
66-
67-
.small-modal-scroll, .modal-scroll, .big-modal-scroll
68-
overflow auto
69-
-webkit-overflow-scrolling touch
70-
will-change scroll-position
71-
.small-modal-scroll
72-
max-height (.65 * $modal-scroll-size)
73-
.modal-scroll
74-
max-height $modal-scroll-size
75-
.big-modal-scroll
76-
max-height (2 * $modal-scroll-size)
77-
78-
79-
.modal-buttons
80-
padding $modal-buttons-padding
81-
justify-content flex-end
82-
&.column
83-
align-items flex-end
45+
.layout
46+
width 100%
47+
height 100%
8448

8549
&.minimized
8650
minimized-modal()
8751
&.maximized
8852
maximized-modal()
8953

54+
.modal-header
55+
text-align $modal-header-text-align
56+
padding $modal-header-padding
57+
font-size $modal-header-font-size
58+
font-weight 500
59+
60+
.modal-body
61+
padding $modal-body-padding
62+
.modal-slim-body
63+
padding $modal-slim-body-padding
64+
.modal-body, .modal-slim-body
65+
text-align $modal-body-text-align
66+
color $modal-body-color
67+
68+
.modal-controls
69+
border-top 1px solid $form-darker-color
70+
border-bottom 1px solid $form-darker-color
71+
&.list
72+
margin 0
73+
74+
.small-modal-scroll, .modal-scroll, .big-modal-scroll
75+
overflow auto
76+
-webkit-overflow-scrolling touch
77+
will-change scroll-position
78+
.small-modal-scroll
79+
max-height (.65 * $modal-scroll-size)
80+
.modal-scroll
81+
max-height $modal-scroll-size
82+
.big-modal-scroll
83+
max-height (2 * $modal-scroll-size)
84+
85+
86+
.modal-buttons
87+
padding $modal-buttons-padding
88+
justify-content flex-end
89+
&.column
90+
align-items flex-end
91+
9092
@media screen and (max-width $layout-small-max)
9193
.modal-content:not(.minimized)
9294
maximized-modal()

0 commit comments

Comments
 (0)