unocss-preset-quasar 0.1.4 → 0.1.6

package/src/styles/md3/components/QField.unocss.ts

@@ -35,7 +35,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
 	[&_::-ms-reveal]:(hidden)`
   ],
 
-  [/^q-field--with-bottom$/, ([, c], { theme }) => `pb-[20px]`],
+  [/^q-field--with-bottom$/, ([, c], { theme }) => ``],
 
   [
     /^q-field__marginal$/,
@@ -71,14 +71,14 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-field__bottom$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-field__bottom'] ??
-      `text-[12px] min-h-[20px] leading-none text-black/54 mt--12px px-[12px] pb-[0] [backface-visibility:hidden]`
+      `text-[12px] min-h-[20px] leading-none bg-transparent text-black/54 mt-4px px-[12px] pb-[0] [backface-visibility:hidden]`
   ],
 
   [
     /^q-field__bottom--animated$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-field__bottom--animated'] ??
-      `translate-y-full left-[0] right-[0] bottom-[0]`
+      `left-[0] right-[0] bottom-[0]`
   ],
 
   [
@@ -222,19 +222,19 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-field--filled$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-field--filled'] ??
-      `bg-light-surface-container text-light-on-surface-variant
-       dark:bg-dark-surface-container dark:text-dark-on-surface-variant
+      `[&_.q-field\\_\\_control]:(bg-light-surface-container text-light-on-surface-variant
+       dark:bg-dark-surface-container dark:text-dark-on-surface-variant)
       [&_.q-field\\_\\_control]:(px-[16px] py-[0] layer-components:bg-black/5 rounded-tl-[4px] rounded-br-[0] rounded-tr-[4px] rounded-bl-[0]) 
-	[&_.q-field\\_\\_control:before]:(layer-components:bg-black/5 [border-bottom:1px_solid_rgba(0,_0,_0,_0.42)] opacity-0 [transition:opacity_0.36s_cubic-bezier(0.4,_0,_0.2,_1),_background_0.36s_cubic-bezier(0.4,_0,_0.2,_1)]) 
-	[&_.q-field\\_\\_control:hover:before]:(opacity-100) 
-	[&_.q-field\\_\\_control:after]:(h-[2px] top-auto origin-[center_bottom] [transform:scale3d(0,_1,_1)] bg-current [transition:transform_0.36s_cubic-bezier(0.4,_0,_0.2,_1)]) 
-	[&.q-field--rounded_.q-field\\_\\_control]:(rounded-tl-[28px] rounded-br-[0] rounded-tr-[28px] rounded-bl-[0]) 
-	[&.q-field--highlighted_.q-field\\_\\_control:before]:(opacity-100 layer-components:bg-black/12) 
-	[&.q-field--highlighted_.q-field\\_\\_control:after]:([transform:scale3d(1,_1,_1)]) 
-	[&.q-field--dark_.q-field\\_\\_control]:(layer-components:bg-white/7) 
-	[&.q-field--dark_.q-field\\_\\_control:before]:(layer-components:bg-white/7) 
-	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_control:before]:(layer-components:bg-white/1) 
-	[&.q-field--readonly_.q-field\\_\\_control:before]:(opacity-100 bg-transparent [border-bottom-style:dashed])`
+      [&_.q-field\\_\\_control:before]:(layer-components:bg-black/5 [border-bottom:1px_solid_rgba(0,_0,_0,_0.42)] opacity-0 [transition:opacity_0.36s_cubic-bezier(0.4,_0,_0.2,_1),_background_0.36s_cubic-bezier(0.4,_0,_0.2,_1)]) 
+      [&_.q-field\\_\\_control:hover:before]:(opacity-100) 
+      [&_.q-field\\_\\_control:after]:(h-[2px] top-auto origin-[center_bottom] [transform:scale3d(0,_1,_1)] bg-current [transition:transform_0.36s_cubic-bezier(0.4,_0,_0.2,_1)]) 
+      [&.q-field--rounded_.q-field\\_\\_control]:(rounded-tl-[28px] rounded-br-[0] rounded-tr-[28px] rounded-bl-[0]) 
+      [&.q-field--highlighted_.q-field\\_\\_control:before]:(opacity-100 layer-components:bg-black/12) 
+      [&.q-field--highlighted_.q-field\\_\\_control:after]:([transform:scale3d(1,_1,_1)]) 
+      [&.q-field--dark_.q-field\\_\\_control]:(layer-components:bg-white/7) 
+      [&.q-field--dark_.q-field\\_\\_control:before]:(layer-components:bg-white/7) 
+      [&.q-field--dark.q-field--highlighted_.q-field\\_\\_control:before]:(layer-components:bg-white/1) 
+      [&.q-field--readonly_.q-field\\_\\_control:before]:(opacity-100 bg-transparent [border-bottom-style:dashed])`
   ],
 
   [
@@ -285,27 +285,28 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-field--standout$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-field--standout'] ??
-      `[&_.q-field\\_\\_control]:(px-[12px] py-[0] layer-components:bg-black/5 rounded-[4px] [transition:box-shadow_0.36s_cubic-bezier(0.4,_0,_0.2,_1),_background-color_0.36s_cubic-bezier(0.4,_0,_0.2,_1)]) 
+      `[&_.q-field\\_\\_control]:(px-[12px] py-[0] layer-components:bg-light-surface-container-high
+       rounded-[4px] [transition:box-shadow_0.36s_cubic-bezier(0.4,_0,_0.2,_1),_background-color_0.36s_cubic-bezier(0.4,_0,_0.2,_1)]) 
 	[&_.q-field\\_\\_control:before]:(layer-components:bg-black/7 opacity-0 [transition:opacity_0.36s_cubic-bezier(0.4,_0,_0.2,_1),_background_0.36s_cubic-bezier(0.4,_0,_0.2,_1)]) 
 	[&_.q-field\\_\\_control:hover:before]:(opacity-100) 
 	[&.q-field--rounded_.q-field\\_\\_control]:(rounded-[28px]) 
-	[&.q-field--highlighted_.q-field\\_\\_control]:([box-shadow:0_1px_5px_rgba(0,_0,_0,_0.2),_0_2px_2px_rgba(0,_0,_0,_0.14),_0_3px_1px_-2px_rgba(0,_0,_0,_0.12)] layer-components:bg-white) 
-	[&.q-field--highlighted_.q-field\\_\\_native]:(text-white) 
-	[&.q-field--highlighted_.q-field\\_\\_prefix]:(text-white) 
-	[&.q-field--highlighted_.q-field\\_\\_suffix]:(text-white) 
-	[&.q-field--highlighted_.q-field\\_\\_prepend]:(text-white) 
-	[&.q-field--highlighted_.q-field\\_\\_append]:(text-white) 
-	[&.q-field--highlighted_.q-field\\_\\_input]:(text-white) 
+	[&.q-field--highlighted_.q-field\\_\\_control]:([box-shadow:0_1px_5px_rgba(0,_0,_0,_0.2),_0_2px_2px_rgba(0,_0,_0,_0.14),_0_3px_1px_-2px_rgba(0,_0,_0,_0.12)]) 
+	[&.q-field--highlighted_.q-field\\_\\_native]:(text-light-primary) 
+	[&.q-field--highlighted_.q-field\\_\\_prefix]:(text-light-primary) 
+	[&.q-field--highlighted_.q-field\\_\\_suffix]:(text-light-primary) 
+	[&.q-field--highlighted_.q-field\\_\\_prepend]:(text-light-primary) 
+	[&.q-field--highlighted_.q-field\\_\\_append]:(text-light-primary) 
+	[&.q-field--highlighted_.q-field\\_\\_input]:(text-light-on-surface) 
 	[&.q-field--readonly_.q-field\\_\\_control:before]:(opacity-100 bg-transparent border-[1px] border-dashed border-black/24) 
-	[&.q-field--dark_.q-field\\_\\_control]:(bg-[rgba(255,_255,_255,_0.07)]) 
+	[&.q-field--dark_.q-field\\_\\_control]:(bg-dark-surface-container-high) 
 	[&.q-field--dark_.q-field\\_\\_control:before]:(layer-components:bg-white/7) 
-	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_control]:(layer-components:bg-white) 
-	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_native]:(text-black) 
-	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_prefix]:(text-black) 
-	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_suffix]:(text-black) 
-	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_prepend]:(text-black) 
-	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_append]:(text-black) 
-	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_input]:(text-black) 
+	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_control]:(layer-components:bg-dark-surface-container-highest) 
+	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_native]:(text-dark-primary) 
+	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_prefix]:(text-dark-primary) 
+	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_suffix]:(text-dark-primary) 
+	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_prepend]:(text-dark-primary) 
+	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_append]:(text-dark-primary) 
+	[&.q-field--dark.q-field--highlighted_.q-field\\_\\_input]:(!text-dark-on-surface) 
 	[&.q-field--dark.q-field--readonly_.q-field\\_\\_control:before]:(border-white/24)`
   ],
 
@@ -333,7 +334,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
       `[&_.q-field--with-bottom]:(pb-[19px]) 
 	[&_.q-field\\_\\_shadow]:(top-[0]) 
 	[&_.q-field\\_\\_control]:(h-[40px]) 
-	[&_.q-field\\_\\_marginal]:(h-[40px]) 
+	[&_.q-field\\_\\_marginal]:() 
 	[&_.q-field\\_\\_bottom]:(text-[11px]) 
 	[&_.q-field\\_\\_label]:(text-[14px] top-[10px]) 
 	[&_.q-field\\_\\_before]:() 

package/src/styles/md3/components/QFooter.unocss.ts

@@ -15,7 +15,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-footer$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-footer'] ??
-      `[&_.q-layout\\_\\_shadow]:(-top-[10px]) [&_.q-layout\\_\\_shadow:after]:(top-[10px])  relative z-${theme.quasar.z['marginals']}`
+      `[&_.q-layout\\_\\_shadow]:(-top-[10px]) [&_.q-layout\\_\\_shadow:after]:(top-[10px])  z-${theme.quasar.z['marginals']}`
   ]
 ]
 

package/src/styles/md3/components/QHeader.unocss.ts

@@ -15,7 +15,8 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-header$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-header'] ??
-      `z-2000 [&_.q-layout\\_\\_shadow]:(-bottom-10px) [&_.q-layout\\_\\_shadow:after]:(bottom-10px)`
+      `z-2000 [&_.q-layout\\_\\_shadow]:(-bottom-10px) [&_.q-layout\\_\\_shadow:after]:(bottom-10px)
+      [&_.q-toolbar\\_\\_title]:(flex-grow-1000)`
     // relative
   ]
 ]

package/src/styles/md3/components/QIcon.unocss.ts

@@ -13,7 +13,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
   [&>img]:(h-full w-full)
   [&:before]:(w-full h-full flex! items-center justify-center)
   [&:after]:(w-full h-full flex! items-center justify-center)
-  select-none cursor-inherit layer-components:(text-light-on-surface dark:text-dark-on-surface) inline-flex items-center justify-center v-middle
+  select-none cursor-inherit layer-components:text-light-on-surface layer-components:dark:text-dark-on-surface inline-flex items-center justify-center v-middle
   `
   ],
   // [

package/src/styles/md3/components/QItem.unocss.ts

@@ -6,22 +6,22 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-item$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-item'] ??
-      `min-h-[40px] px-[16px] py-[8px] [color:inherit] [transition:color_0.3s,_background-color_0.3s] [&_>_.q-item\\_\\_section--thumbnail:first-child]:(-ml-[16px]) [&_>_.q-focus-helper_+_.q-item\\_\\_section--thumbnail]:(-ml-[16px]) [&_>_.q-item\\_\\_section--thumbnail:last-of-type]:(-mr-[16px]) relative
-    [&.q-router-link--active]:(text-primary)`
+      `min-h-[28px] px-[16px] py-[8px] [color:inherit] [transition:color_0.3s,_background-color_0.3s] [&_>_.q-item\\_\\_section--thumbnail:first-child]:(-ml-[16px]) [&_>_.q-focus-helper_+_.q-item\\_\\_section--thumbnail]:(-ml-[16px]) [&_>_.q-item\\_\\_section--thumbnail:last-of-type]:(-mr-[16px]) relative
+    [&.q-router-link--active]:(text-light-primary dark:text-dark-primary)`
   ],
 
   [
     /^q-item__section--side$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-item__section--side'] ??
-      `!flex-initial text-[#757575] items-start pr-[16px] w-auto min-w-[0] max-w-full [&_>_.q-icon]:(text-[24px]) [&_>_.q-avatar]:(text-[40px])`
+      `!flex-initial text-[#757575] items-start pr-[16px] w-auto max-w-full [&_>_.q-icon]:(text-[24px]) [&_>_.q-avatar]:(text-[40px])`
   ],
 
   [
     /^q-item__section--avatar$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-item__section--avatar'] ??
-      `!flex-initial [color:inherit] min-w-[56px]`
+      `!flex-initial [color:inherit] min-w-[40px]`
   ],
 
   [
@@ -80,8 +80,8 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-item__section--main'] ??
       `w-auto min-w-[0] max-w-full flex-[10000_1_0%]
-      [&:has(>:last-child:nth-child(2))]:(min-h-72px)
-      [&:has(>:last-child:nth-child(3))]:(min-h-88px)
+      [&:has(>:last-child:nth-child(2))]:(min-h-36px)
+      [&:has(>:last-child:nth-child(3))]:(min-h-44px)
       [&_+_.q-item\\_\\_section--main]:(ml-[8px]) 
       [&_~_.q-item\\_\\_section--side]:(items-end pr-0 pl-[16px])`
   ],
@@ -104,16 +104,18 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-list--dense$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-list--dense'] ??
-      `[&_>_.q-item]:(min-h-[32px] px-[16px] py-[2px])`
+      `[&_>_.q-item]:(min-h-[28px] px-[16px] py-[2px])`
   ],
 
-  [/^q-item--dense$/, ([, c], { theme }) => `min-h-[32px] px-[16px] py-[2px]`],
+  [/^q-item--dense$/, ([, c], { theme }) => `min-h-[28px] px-[16px] py-[2px]`],
 
   [
     /^q-list--dark$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-list--dark'] ??
-      `text-[#fff] border-[rgba(255,_255,_255,_0.28)] [&_.q-item\\_\\_section--side:not(.q-item\\_\\_section--avatar)]:(text-[rgba(255,_255,_255,_0.7)]) [&_.q-item\\_\\_label--header]:(text-[rgba(255,_255,_255,_0.64)]) [&_.q-item\\_\\_label--overline]:(text-[rgba(255,_255,_255,_0.8)]) [&_.q-item\\_\\_label--caption]:(text-[rgba(255,_255,_255,_0.8)])`
+      `text-[#fff] border-[rgba(255,_255,_255,_0.28)] 
+      [&_.q-item\\_\\_section--side:not(.q-item\\_\\_section--avatar)]:(text-[rgba(255,_255,_255,_0.7)]) 
+      [&_.q-item\\_\\_label--header]:(text-[rgba(255,_255,_255,_0.64)]) [&_.q-item\\_\\_label--overline]:(text-[rgba(255,_255,_255,_0.8)]) [&_.q-item\\_\\_label--caption]:(text-[rgba(255,_255,_255,_0.8)])`
   ],
 
   [
@@ -123,7 +125,10 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
       `text-[#fff] border-[rgba(255,_255,_255,_0.28)] [&_.q-item\\_\\_section--side:not(.q-item\\_\\_section--avatar)]:(text-[rgba(255,_255,_255,_0.7)]) [&_.q-item\\_\\_label--header]:(text-[rgba(255,_255,_255,_0.64)]) [&_.q-item\\_\\_label--overline]:(text-[rgba(255,_255,_255,_0.8)]) [&_.q-item\\_\\_label--caption]:(text-[rgba(255,_255,_255,_0.8)])`
   ],
 
-  [/^q-item--active$/, ([, c], { theme }) => `text-primary`]
+  [
+    /^q-item--active$/,
+    ([, c], { theme }) => `text-light-primary dark:text-dark-primary`
+  ]
 ]
 
 export { shortcuts }

package/src/styles/md3/components/QLayout.unocss.ts

@@ -88,7 +88,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-layout__section--marginal$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-layout__section--marginal'] ??
-      `text-[#fff] bg-light-surface dark:bg-dark-surface-container text-light-on-surface dark:text-dark-on-surface`
+      `text-[#fff] bg-light-surface-container-low dark:bg-dark-surface-container-low text-light-on-surface dark:text-dark-on-surface`
   ]
 ]
 

package/src/styles/md3/components/QPageSticky.unocss.ts

@@ -2,6 +2,10 @@ import type { Rule, UserShortcuts } from '@unocss/core'
 import type { QuasarTheme } from '../../../theme.js'
 
 const shortcuts: UserShortcuts<QuasarTheme> = [
+  [
+    /^q-page-sticky$/,
+    ([, c], { theme }) => theme.quasar?.components?.['q-page-sticky'] ?? ``
+  ],
   [
     /^q-page-sticky--shrink$/,
     ([, c], { theme }) =>

package/src/styles/md3/components/QScrollarea.unocss.ts

@@ -2,7 +2,7 @@ import type { Rule, UserShortcuts } from '@unocss/core'
 import type { QuasarTheme } from '../../../theme.js'
 
 const shortcuts: UserShortcuts<QuasarTheme> = [
-  [/^q-scrollarea$/, ([, c], { theme }) => `relative`],
+  [/^q-scrollarea$/, ([, c], { theme }) => `relative [contain:strict]`],
 
   [
     /^q-scrollarea__bar$/,
@@ -44,10 +44,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
 
   [/^q-scrollarea__thumb:active$/, ([, c], { theme }) => `active:opacity-50`],
 
-  [
-    /^q-scrollarea__content$/,
-    ([, c], { theme }) => `!relative min-h-full min-w-full`
-  ],
+  [/^q-scrollarea__content$/, ([, c], { theme }) => `min-h-full w-full`],
 
   [
     /^q-scrollarea--dark$/,

package/src/styles/md3/components/QStepper.unocss.ts

@@ -6,7 +6,16 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-stepper$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-stepper'] ??
-      `[box-shadow:0_1px_5px_rgba(0,_0,_0,_0.2),_0_2px_2px_rgba(0,_0,_0,_0.14),_0_3px_1px_-2px_rgba(0,_0,_0,_0.12)] rounded-[4px] bg-[#fff]`
+      `[box-shadow:0_1px_5px_rgba(0,_0,_0,_0.2),_0_2px_2px_rgba(0,_0,_0,_0.14),_0_3px_1px_-2px_rgba(0,_0,_0,_0.12)] rounded-[4px]
+      bg-light-surface dark:bg-dark-surface
+      `
+  ],
+
+  [
+    /^q-stepper__label$/,
+    ([, c], { theme }) =>
+      theme.quasar?.components?.['q-stepper__label'] ??
+      `bg-light-surface dark:bg-dark-surface`
   ],
 
   [
@@ -41,7 +50,16 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-stepper--dark$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-stepper--dark'] ??
-      `[box-shadow:0_1px_5px_rgba(255,_255,_255,_0.2),_0_2px_2px_rgba(255,_255,_255,_0.14),_0_3px_1px_-2px_rgba(255,_255,_255,_0.12)] [&_.q-stepper\\_\\_dot_span]:(text-[#000]) [&.q-stepper--bordered]:(border-[rgba(255,_255,_255,_0.28)]) [&_.q-stepper\\_\\_header--border]:(border-[rgba(255,_255,_255,_0.28)]) [&.q-stepper--horizontal_.q-stepper\\_\\_line:before]:(bg-[rgba(255,_255,_255,_0.28)]) [&.q-stepper--horizontal_.q-stepper\\_\\_line:after]:(bg-[rgba(255,_255,_255,_0.28)]) [&.q-stepper--vertical_.q-stepper\\_\\_dot:before]:(bg-[rgba(255,_255,_255,_0.28)]) [&.q-stepper--vertical_.q-stepper\\_\\_dot:after]:(bg-[rgba(255,_255,_255,_0.28)]) [&_.q-stepper\\_\\_tab--disabled]:(text-[rgba(255,_255,_255,_0.28)]) [&_.q-stepper\\_\\_tab--disabled_.q-stepper\\_\\_dot]:(bg-[rgba(255,_255,_255,_0.28)]) [&_.q-stepper\\_\\_tab--disabled_.q-stepper\\_\\_label]:(text-[rgba(255,_255,_255,_0.54)])`
+      `[box-shadow:0_1px_5px_rgba(255,_255,_255,_0.2),_0_2px_2px_rgba(255,_255,_255,_0.14),_0_3px_1px_-2px_rgba(255,_255,_255,_0.12)] 
+      [&_.q-stepper\\_\\_dot_span]:(text-[#000]) [&.q-stepper--bordered]:(border-[rgba(255,_255,_255,_0.28)]) 
+      [&_.q-stepper\\_\\_header--border]:(border-[rgba(255,_255,_255,_0.28)]) 
+      [&.q-stepper--horizontal_.q-stepper\\_\\_line:before]:(bg-[rgba(255,_255,_255,_0.28)])
+      [&.q-stepper--horizontal_.q-stepper\\_\\_line:after]:(bg-[rgba(255,_255,_255,_0.28)]) 
+      [&.q-stepper--vertical_.q-stepper\\_\\_dot:before]:(bg-[rgba(255,_255,_255,_0.28)]) 
+      [&.q-stepper--vertical_.q-stepper\\_\\_dot:after]:(bg-[rgba(255,_255,_255,_0.28)]) 
+      [&_.q-stepper\\_\\_tab--disabled]:(text-[rgba(255,_255,_255,_0.28)]) 
+      [&_.q-stepper\\_\\_tab--disabled_.q-stepper\\_\\_dot]:(bg-[rgba(255,_255,_255,_0.28)]) 
+      [&_.q-stepper\\_\\_tab--disabled_.q-stepper\\_\\_label]:(text-[rgba(255,_255,_255,_0.54)])`
   ],
 
   [
@@ -55,7 +73,8 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-stepper__tab--active$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-stepper__tab--active'] ??
-      ` [&_.q-stepper\\_\\_dot]:([text-shadow:0_0_0_currentColor]) [&_.q-stepper\\_\\_label]:([text-shadow:0_0_0_currentColor])`
+      `text-light-primary dark:text-dark-primary [&_.q-stepper\\_\\_dot]:([text-shadow:0_0_0_currentColor]) 
+      [&_.q-stepper\\_\\_label]:([text-shadow:0_0_0_currentColor])`
   ],
 
   [
@@ -153,7 +172,16 @@ __.q-stepper\\_\\_tab:last-child]:(items-end) [&_.q-stepper\\_\\_tab]:(px-[0] py
     /^q-stepper--horizontal$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-stepper--horizontal'] ??
-      `[&_.q-stepper\\_\\_step-inner]:(p-[24px]) [&_.q-stepper\\_\\_tab:first-child]:([border-top-left-radius:inherit]) [&_.q-stepper\\_\\_tab:last-child]:([border-top-right-radius:inherit]) [&_.q-stepper\\_\\_tab:first-child_.q-stepper\\_\\_dot:before]:(hidden) [&_.q-stepper\\_\\_tab:last-child_.q-stepper\\_\\_label:after]:(hidden) [&_.q-stepper\\_\\_tab:last-child_.q-stepper\\_\\_dot:after]:(hidden) [&_.q-stepper\\_\\_tab]:(overflow-hidden) [&_.q-stepper\\_\\_line]:(contain-layout) [&_.q-stepper\\_\\_line:before]:(absolute top-2/4 h-px w-screen bg-[rgba(0,_0,_0,_0.12)]) [&_.q-stepper\\_\\_line:after]:(absolute top-2/4 h-px w-screen bg-[rgba(0,_0,_0,_0.12)]) [&_.q-stepper\\_\\_label:after]:(content-[''] left-full ml-[8px]) [&_.q-stepper\\_\\_dot:after]:(content-[''] left-full ml-[8px]) [&_.q-stepper\\_\\_dot:before]:(content-[''] right-full mr-[8px]) [&_>_.q-stepper\\_\\_nav]:(pt-[0] px-[24px] pb-[24px])`
+      `[&_.q-stepper\\_\\_step-inner]:(p-[24px]) 
+      [&_.q-stepper\\_\\_tab:first-child]:([border-top-left-radius:inherit]) 
+      [&_.q-stepper\\_\\_tab:last-child]:([border-top-right-radius:inherit]) 
+      [&_.q-stepper\\_\\_tab:first-child_.q-stepper\\_\\_dot:before]:(hidden) 
+      [&_.q-stepper\\_\\_tab:last-child_.q-stepper\\_\\_label:after]:(hidden) 
+      [&_.q-stepper\\_\\_tab:last-child_.q-stepper\\_\\_dot:after]:(hidden) 
+      [&_.q-stepper\\_\\_tab]:(overflow-hidden) 
+      [&_.q-stepper\\_\\_line]:(contain-layout) 
+      [&_.q-stepper\\_\\_line:before]:(absolute top-2/4 h-px w-screen bg-[rgba(0,_0,_0,_0.12)]) 
+      [&_.q-stepper\\_\\_line:after]:(absolute top-2/4 h-px w-screen bg-[rgba(0,_0,_0,_0.12)]) [&_.q-stepper\\_\\_label:after]:(content-[''] left-full ml-[8px]) [&_.q-stepper\\_\\_dot:after]:(content-[''] left-full ml-[8px]) [&_.q-stepper\\_\\_dot:before]:(content-[''] right-full mr-[8px]) [&_>_.q-stepper\\_\\_nav]:(pt-[0] px-[24px] pb-[24px])`
   ],
 
   [

package/src/styles/md3/components/QTabs.unocss.ts

@@ -6,13 +6,16 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-tab$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-tab'] ??
-      `px-[16px] py-[0] min-h-[48px] [transition:color_0.3s,_background-color_0.3s] uppercase whitespace-nowrap [color:inherit] no-underline [&_.q-badge]:(top-[3px] -right-[12px])`
+      `px-[16px] py-[0] min-h-[48px] [transition:color_0.3s,_background-color_0.3s] whitespace-nowrap [color:inherit] no-underline
+      [&_.q-badge]:(top-[3px] -right-[12px])
+      [&_>_.q-focus-helper]:(!absolute !h-32px !w-52px !top-[calc(50%-23px)] !left-[calc(50%-26px)] !border-rd-16px)
+      `
   ],
 
   [
     /^q-tab--full$/,
     ([, c], { theme }) =>
-      theme.quasar?.components?.['q-tab--full'] ?? `min-h-[72px]`
+      theme.quasar?.components?.['q-tab--full'] ?? `min-h-72px h-72px`
   ],
 
   [
@@ -25,7 +28,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-tab__content$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-tab__content'] ??
-      `[height:inherit] px-[0] py-[4px] min-w-[40px] [&_.q-chip--floating]:(top-[0] -right-[16px])`
+      `[height:inherit] z-2 px-[0] py-[4px] min-w-[40px] [&_.q-chip--floating]:(top-[0] -right-[16px])`
   ],
 
   [
@@ -67,14 +70,14 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-tab__indicator$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-tab__indicator'] ??
-      `!relative opacity-0 h-[2px] bg-current`
+      `opacity-0 h-[2px] bg-current`
   ],
 
   [
     /^q-tab--active$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-tab--active'] ??
-      `[&_.q-tab\\_\\_indicator]:(opacity-100 origin-left)`
+      `text-light-primary dark:text-dark-primary [&_.q-tab\\_\\_indicator]:(opacity-100 origin-left)`
   ],
 
   [
@@ -156,7 +159,14 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-tabs--vertical$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-tabs--vertical'] ??
-      `!block h-full [&_.q-tabs\\_\\_content]:(!block h-full) [&_.q-tabs\\_\\_arrow]:(w-full h-[36px] text-center) [&_.q-tabs\\_\\_arrow--left]:(top-[0] left-[0] right-[0]) [&_.q-tabs\\_\\_arrow--right]:(left-[0] right-[0] bottom-[0]) [&_.q-tab]:(px-[8px] py-[0]) [&_.q-tab\\_\\_indicator]:(h-[unset] w-[2px]) [&.q-tabs--not-scrollable_.q-tabs\\_\\_content]:(h-full) [&.q-tabs--dense_.q-tab\\_\\_content]:(min-w-[24px])`
+      `!block h-full [&_.q-tabs\\_\\_content]:(!block h-full) 
+      [&_.q-tabs\\_\\_arrow]:(w-full h-[36px] text-center) 
+      [&_.q-tabs\\_\\_arrow--left]:(top-[0] left-[0] right-[0]) 
+      [&_.q-tabs\\_\\_arrow--right]:(left-[0] right-[0] bottom-[0]) 
+      [&_.q-tab]:(px-[8px] py-[0]) 
+      [&_.q-tab\\_\\_indicator]:(h-[unset] w-2px min-h-100%)
+      [&_.q-tabs--not-scrollable_.q-tabs\\_\\_content]:(h-full) 
+      [&_.q-tabs--dense_.q-tab\\_\\_content]:(min-w-[24px])`
   ],
 
   [

package/src/styles/md3/components/QToggle.unocss.ts

@@ -63,9 +63,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
       `[&_.q-toggle\\_\\_track]:(bg-light-primary dark:bg-dark-primary) 
       [&_.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])
       [&_.q-toggle\\_\\_thumb:after]:(layer-components:!bg-light-on-primary dark:!bg-dark-on-primary)
-      [&_.q-toggle\\_\\_thumb_.q-icon]:(layer-components:text-[#fff] opacity-100)
-      [&:not(.disabled):focus_.q-toggle\\_\\_thumb:before]:(scale-200)
-      [&:not(.disabled):hover_.q-toggle\\_\\_thumb:before]:(scale-200)`
+      [&_.q-toggle\\_\\_thumb_.q-icon]:(layer-components:text-[#fff] opacity-100)`
   ],
 
   [

package/src/styles/md3/components/QToolbar.unocss.ts

@@ -17,7 +17,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-toolbar__title$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-toolbar__title'] ??
-      `flex-1 min-w-[1px] max-w-full text-[21px] font-normal tracking-[0.01em] px-[12px] py-[0] [&:first-child]:(pl-0) [&:last-child]:(pr-0)`
+      `flex-initial min-w-[1px] max-w-full text-[21px] font-normal tracking-[0.01em] px-[12px] py-[0] [&:first-child]:(pl-0) [&:last-child]:(pr-0)`
   ]
 ]
 

package/src/styles/md3/index.ts

@@ -231,13 +231,21 @@ const style: QuasarStyle = {
 export const setDefaultProps = ({
   QBtn,
   QBtnDropdown,
+  QBtnGroup,
   QInput,
-  QBtnToggle
+  QBtnToggle,
+  QSelect,
+  QField,
+  QChip
 }: {
   QBtn: any
   QBtnDropdown: any
+  QBtnGroup: any
   QInput: any
   QBtnToggle: any
+  QSelect: any
+  QField: any
+  QChip: any
 }) => {
   QBtn.props.rounded = {
     type: QBtn.props.rounded,
@@ -247,6 +255,10 @@ export const setDefaultProps = ({
     type: QBtnDropdown.props.rounded,
     default: true
   }
+  QBtnGroup.props.rounded = {
+    type: QBtnGroup.props.rounded,
+    default: true
+  }
   QInput.props.filled = {
     type: QInput.props.filled,
     default: true
@@ -255,6 +267,18 @@ export const setDefaultProps = ({
     type: QBtnToggle.props.rounded,
     default: true
   }
+  QSelect.props.filled = {
+    type: QSelect.props.filled,
+    default: true
+  }
+  QField.props.filled = {
+    type: QField.props.filled,
+    default: true
+  }
+  QChip.props.square = {
+    type: QChip.props.square,
+    default: true
+  }
 }
 
 export default style

package/src/theme.ts

@@ -383,6 +383,7 @@ export interface QuasarTheme {
       'q-badge--outline'?: string
       'q-badge--rounded'?: string
       'q-banner'?: string
+      'q-banner__content'?: string
       'q-banner--top-padding'?: string
       'q-banner__avatar'?: string
       'q-banner__actions'?: string
@@ -429,6 +430,7 @@ export interface QuasarTheme {
       'q-btn-group--spread'?: string
       'q-btn-toggle'?: string
       'q-card'?: string
+      'q-card--filled'?: string
       'q-card--bordered'?: string
       'q-card--dark'?: string
       'q-card__section'?: string
@@ -474,6 +476,7 @@ export interface QuasarTheme {
       'q-message-text-content--sent'?: string
       'q-message-text'?: string
       'q-checkbox'?: string
+      'q-checkbox__label'?: string
       'q-checkbox__native'?: string
       'q-checkbox__bg'?: string
       'q-checkbox__icon-container'?: string
@@ -730,6 +733,7 @@ export interface QuasarTheme {
       'q-drawer__backdrop'?: string
       'q-drawer__opener'?: string
       'q-page'?: string
+      'q-page-sticky'?: string
       'q-page-sticky--shrink'?: string
       'q-body--layout-animate'?: string
       'q-body--drawer-toggle'?: string
@@ -905,6 +909,7 @@ export interface QuasarTheme {
       'q-splitter__before'?: string
       'q-splitter__after'?: string
       'q-stepper'?: string
+      'q-stepper__label'?: string
       'q-stepper__title'?: string
       'q-stepper__caption'?: string
       'q-stepper__dot'?: string
@@ -1762,7 +1767,7 @@ export const generateTheme = (sourceColor: string): QuasarTheme => {
       secondary: hexFromArgb(materialTheme.schemes.light.secondary),
       accent: hexFromArgb(materialTheme.schemes.light.tertiary),
 
-      'dark-page': hexFromArgb(materialTheme.palettes.neutral.tone(6))
+      'dark-page': hexFromArgb(materialTheme.schemes.dark.surface)
     }
   }
 }