unocss-preset-quasar 0.1.3 → 0.1.4

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.
@@ -8,7 +8,7 @@ const shortcuts = [
8
8
  [
9
9
  /^q-banner__avatar$/,
10
10
  ([, c], { theme }) => theme.quasar?.components?.['q-banner__avatar'] ??
11
- `!min-w-[1px] [&_>_.q-avatar]:(text-[46px]) [&_>_.q-icon]:(text-[40px]) [&:not(:empty)_+_.q-banner\\_\\_content]:(pl-[16px])`
11
+ `!flex-initial !min-w-[1px] [&_>_.q-avatar]:(text-[46px]) [&_>_.q-icon]:(text-[40px]) [&:not(:empty)_+_.q-banner\\_\\_content]:(pl-[16px])`
12
12
  ],
13
13
  [
14
14
  /^q-banner__actions$/,
@@ -8,7 +8,7 @@ const shortcuts = [
8
8
  [
9
9
  /^q-banner__avatar$/,
10
10
  ([, c], { theme }) => theme.quasar?.components?.['q-banner__avatar'] ??
11
- `!min-w-[1px] [&_>_.q-avatar]:(text-[46px]) [&_>_.q-icon]:(text-[40px]) [&:not(:empty)_+_.q-banner\\_\\_content]:(pl-[16px])`
11
+ `!flex-initial !min-w-[1px] [&_>_.q-avatar]:(text-[46px]) [&_>_.q-icon]:(text-[40px]) [&:not(:empty)_+_.q-banner\\_\\_content]:(pl-[16px])`
12
12
  ],
13
13
  [
14
14
  /^q-banner__actions$/,
@@ -59,8 +59,8 @@ const shortcuts = [
59
59
  ([, c], { theme }) => theme.quasar?.components?.['q-drawer__content'] ??
60
60
  `[&_>_.q-list]:(px-28px)
61
61
  [&_>_.q-list_>_.q-item]:(border-rd-16px)
62
- [&_>_.q-list_>_.q-router-link--active]:(text-light-primary dark:text-dark-primary)
63
- [&_>_.q-list_>_.q-router-link--exact-active]:(bg-light-secondary-container dark:bg-dark-secondary-container
62
+ [&_.q-list_>_.q-router-link--active]:(text-light-primary dark:text-dark-primary)
63
+ [&_.q-list_.q-router-link--exact-active]:(bg-light-secondary-container dark:bg-dark-secondary-container
64
64
  )`
65
65
  ]
66
66
  ];
@@ -7,7 +7,7 @@ const shortcuts = [
7
7
  [&>img]:(h-full w-full)
8
8
  [&:before]:(w-full h-full flex! items-center justify-center)
9
9
  [&:after]:(w-full h-full flex! items-center justify-center)
10
- select-none cursor-inherit text-light-on-surface dark:text-dark-on-surface inline-flex items-center justify-center v-middle
10
+ select-none cursor-inherit layer-components:(text-light-on-surface dark:text-dark-on-surface) inline-flex items-center justify-center v-middle
11
11
  `
12
12
  ],
13
13
  // [
@@ -21,20 +21,20 @@ const shortcuts = [
21
21
  [
22
22
  /^q-toggle__track$/,
23
23
  ([, c], { theme }) => theme.quasar?.components?.['q-toggle__track'] ??
24
- `outline-solid outline-2px outline-light-outline dark:outline-dark-outline !rounded-full h-[2em] w-[3.25em] bg-light-surface-container dark:bg-dark-surface-container`
24
+ `outline-solid outline-2px outline-light-outline dark:outline-dark-outline !rounded-full h-[1em] w-[1.6125em] bg-light-surface-container dark:bg-dark-surface-container`
25
25
  ],
26
26
  [
27
27
  /^q-toggle__thumb$/,
28
28
  ([, c], { theme }) => theme.quasar?.components?.['q-toggle__thumb'] ??
29
- `top-[0.5625em] left-[0.5625em] w-[1.5em] h-[1.5em] [transition:left_0.22s_cubic-bezier(0.4,_0,_0.2,_1)] select-none z-0
29
+ `layer-components:text-light-surface-container-highest layer-components:dark:text-dark-surface-container-highest
30
+ top-[0.125em] left-[0.5125em] w-[0.75em] h-[0.75em] [transition:left_0.22s_cubic-bezier(0.4,_0,_0.2,_1)] select-none z-0
30
31
  [&:before]:()
31
- [&:after]:(content-[''] bg-light-outline dark:bg-dark-outline absolute top-[0] right-[0] bottom-[0] left-[0] rounded-[50%] [box-shadow:0_3px_1px_-2px_rgba(0,_0,_0,_0.2),_0_2px_2px_0_rgba(0,_0,_0,_0.14),_0_1px_5px_0_rgba(0,_0,_0,_0.12)])
32
- [&_.q-icon]:(layer-components:text-[0.3em] min-w-[1em] layer-components:text-[#000] opacity-[0.54])`
32
+ [&:after]:(content-[''] layer-components:bg-light-outline layer-components:dark:bg-dark-outline absolute top-[0] right-[0] bottom-[0] left-[0] rounded-[50%] [box-shadow:0_3px_1px_-2px_rgba(0,_0,_0,_0.2),_0_2px_2px_0_rgba(0,_0,_0,_0.14),_0_1px_5px_0_rgba(0,_0,_0,_0.12)])
33
+ [&_.q-icon]:(z-2 layer-components:text-[0.5em] layer-components:text-[#000] opacity-[0.54])`
33
34
  ],
34
35
  [
35
36
  /^q-toggle__inner$/,
36
- ([, c], { theme }) => theme.quasar?.components?.['q-toggle__inner'] ??
37
- `text-[1.25em] w-[1.4em] min-w-[1.4em] max-h-[1em] px-[0.3em] py-[0.325em]`
37
+ ([, c], { theme }) => theme.quasar?.components?.['q-toggle__inner'] ?? `px-0.325em`
38
38
  ],
39
39
  [
40
40
  /^q-toggle__inner--indet$/,
@@ -45,8 +45,8 @@ const shortcuts = [
45
45
  /^q-toggle__inner--truthy$/,
46
46
  ([, c], { theme }) => theme.quasar?.components?.['q-toggle__inner--truthy'] ??
47
47
  `[&_.q-toggle\\_\\_track]:(bg-light-primary dark:bg-dark-primary)
48
- [&_.q-toggle\\_\\_thumb]:(left-[1.625em] top-[0.45em] w-[1.75em] h-[1.75em])
49
- [&_.q-toggle\\_\\_thumb:after]:(!bg-light-on-primary dark:!bg-dark-on-primary)
48
+ [&_.q-toggle\\_\\_thumb]:(text-light-on-primary-container dark:text-light-on-primary-container left-[0.95em] top-[0.0625em] w-[0.875em] h-[0.875em])
49
+ [&_.q-toggle\\_\\_thumb:after]:(layer-components:!bg-light-on-primary dark:!bg-dark-on-primary)
50
50
  [&_.q-toggle\\_\\_thumb_.q-icon]:(layer-components:text-[#fff] opacity-100)
51
51
  [&:not(.disabled):focus_.q-toggle\\_\\_thumb:before]:(scale-200)
52
52
  [&:not(.disabled):hover_.q-toggle\\_\\_thumb:before]:(scale-200)`
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "unocss-preset-quasar",
3
- "version": "0.1.3",
3
+ "version": "0.1.4",
4
4
  "license": "MIT",
5
5
  "author": "Stefan van Herwijnen",
6
6
  "description": "UnoCSS preset for Quasar Framework",
@@ -15,7 +15,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
15
15
  /^q-banner__avatar$/,
16
16
  ([, c], { theme }) =>
17
17
  theme.quasar?.components?.['q-banner__avatar'] ??
18
- `!min-w-[1px] [&_>_.q-avatar]:(text-[46px]) [&_>_.q-icon]:(text-[40px]) [&:not(:empty)_+_.q-banner\\_\\_content]:(pl-[16px])`
18
+ `!flex-initial !min-w-[1px] [&_>_.q-avatar]:(text-[46px]) [&_>_.q-icon]:(text-[40px]) [&:not(:empty)_+_.q-banner\\_\\_content]:(pl-[16px])`
19
19
  ],
20
20
 
21
21
  [
@@ -15,7 +15,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
15
15
  /^q-banner__avatar$/,
16
16
  ([, c], { theme }) =>
17
17
  theme.quasar?.components?.['q-banner__avatar'] ??
18
- `!min-w-[1px] [&_>_.q-avatar]:(text-[46px]) [&_>_.q-icon]:(text-[40px]) [&:not(:empty)_+_.q-banner\\_\\_content]:(pl-[16px])`
18
+ `!flex-initial !min-w-[1px] [&_>_.q-avatar]:(text-[46px]) [&_>_.q-icon]:(text-[40px]) [&:not(:empty)_+_.q-banner\\_\\_content]:(pl-[16px])`
19
19
  ],
20
20
 
21
21
  [
@@ -85,8 +85,8 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
85
85
  theme.quasar?.components?.['q-drawer__content'] ??
86
86
  `[&_>_.q-list]:(px-28px)
87
87
  [&_>_.q-list_>_.q-item]:(border-rd-16px)
88
- [&_>_.q-list_>_.q-router-link--active]:(text-light-primary dark:text-dark-primary)
89
- [&_>_.q-list_>_.q-router-link--exact-active]:(bg-light-secondary-container dark:bg-dark-secondary-container
88
+ [&_.q-list_>_.q-router-link--active]:(text-light-primary dark:text-dark-primary)
89
+ [&_.q-list_.q-router-link--exact-active]:(bg-light-secondary-container dark:bg-dark-secondary-container
90
90
  )`
91
91
  ]
92
92
  ]
@@ -13,7 +13,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
13
13
  [&>img]:(h-full w-full)
14
14
  [&:before]:(w-full h-full flex! items-center justify-center)
15
15
  [&:after]:(w-full h-full flex! items-center justify-center)
16
- select-none cursor-inherit text-light-on-surface dark:text-dark-on-surface inline-flex items-center justify-center v-middle
16
+ select-none cursor-inherit layer-components:(text-light-on-surface dark:text-dark-on-surface) inline-flex items-center justify-center v-middle
17
17
  `
18
18
  ],
19
19
  // [
@@ -29,24 +29,24 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
29
29
  /^q-toggle__track$/,
30
30
  ([, c], { theme }) =>
31
31
  theme.quasar?.components?.['q-toggle__track'] ??
32
- `outline-solid outline-2px outline-light-outline dark:outline-dark-outline !rounded-full h-[2em] w-[3.25em] bg-light-surface-container dark:bg-dark-surface-container`
32
+ `outline-solid outline-2px outline-light-outline dark:outline-dark-outline !rounded-full h-[1em] w-[1.6125em] bg-light-surface-container dark:bg-dark-surface-container`
33
33
  ],
34
34
 
35
35
  [
36
36
  /^q-toggle__thumb$/,
37
37
  ([, c], { theme }) =>
38
38
  theme.quasar?.components?.['q-toggle__thumb'] ??
39
- `top-[0.5625em] left-[0.5625em] w-[1.5em] h-[1.5em] [transition:left_0.22s_cubic-bezier(0.4,_0,_0.2,_1)] select-none z-0
39
+ `layer-components:text-light-surface-container-highest layer-components:dark:text-dark-surface-container-highest
40
+ top-[0.125em] left-[0.5125em] w-[0.75em] h-[0.75em] [transition:left_0.22s_cubic-bezier(0.4,_0,_0.2,_1)] select-none z-0
40
41
  [&:before]:()
41
- [&:after]:(content-[''] bg-light-outline dark:bg-dark-outline absolute top-[0] right-[0] bottom-[0] left-[0] rounded-[50%] [box-shadow:0_3px_1px_-2px_rgba(0,_0,_0,_0.2),_0_2px_2px_0_rgba(0,_0,_0,_0.14),_0_1px_5px_0_rgba(0,_0,_0,_0.12)])
42
- [&_.q-icon]:(layer-components:text-[0.3em] min-w-[1em] layer-components:text-[#000] opacity-[0.54])`
42
+ [&:after]:(content-[''] layer-components:bg-light-outline layer-components:dark:bg-dark-outline absolute top-[0] right-[0] bottom-[0] left-[0] rounded-[50%] [box-shadow:0_3px_1px_-2px_rgba(0,_0,_0,_0.2),_0_2px_2px_0_rgba(0,_0,_0,_0.14),_0_1px_5px_0_rgba(0,_0,_0,_0.12)])
43
+ [&_.q-icon]:(z-2 layer-components:text-[0.5em] layer-components:text-[#000] opacity-[0.54])`
43
44
  ],
44
45
 
45
46
  [
46
47
  /^q-toggle__inner$/,
47
48
  ([, c], { theme }) =>
48
- theme.quasar?.components?.['q-toggle__inner'] ??
49
- `text-[1.25em] w-[1.4em] min-w-[1.4em] max-h-[1em] px-[0.3em] py-[0.325em]`
49
+ theme.quasar?.components?.['q-toggle__inner'] ?? `px-0.325em`
50
50
  ],
51
51
 
52
52
  [
@@ -61,8 +61,8 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
61
61
  ([, c], { theme }) =>
62
62
  theme.quasar?.components?.['q-toggle__inner--truthy'] ??
63
63
  `[&_.q-toggle\\_\\_track]:(bg-light-primary dark:bg-dark-primary)
64
- [&_.q-toggle\\_\\_thumb]:(left-[1.625em] top-[0.45em] w-[1.75em] h-[1.75em])
65
- [&_.q-toggle\\_\\_thumb:after]:(!bg-light-on-primary dark:!bg-dark-on-primary)
64
+ [&_.q-toggle\\_\\_thumb]:(text-light-on-primary-container dark:text-light-on-primary-container left-[0.95em] top-[0.0625em] w-[0.875em] h-[0.875em])
65
+ [&_.q-toggle\\_\\_thumb:after]:(layer-components:!bg-light-on-primary dark:!bg-dark-on-primary)
66
66
  [&_.q-toggle\\_\\_thumb_.q-icon]:(layer-components:text-[#fff] opacity-100)
67
67
  [&:not(.disabled):focus_.q-toggle\\_\\_thumb:before]:(scale-200)
68
68
  [&:not(.disabled):hover_.q-toggle\\_\\_thumb:before]:(scale-200)`