vitrify 0.17.9 → 0.17.11

package/dist/plugins/quasar/unocss/plugins/QNotify.unocss.js

@@ -38,7 +38,7 @@ body.q-ios-padding .q-notifications__list--center, body.q-ios-padding .q-notific
 const shortcuts = [
     [
         /^q-notifications__list$/,
-        ([, c], { theme }) => `pointer-events-none left-0 right-0 mb-[10px] relative z-9500`
+        ([, c], { theme }) => `pointer-events-none left-0 right-0 mb-[10px] relative z-${theme.quasar.z['notify']}`
     ],
     [/^q-notifications__list--center$/, ([, c], { theme }) => `top-0 bottom-0`],
     [/^q-notifications__list--top$/, ([, c], { theme }) => `top-0`],
@@ -46,7 +46,7 @@ const shortcuts = [
     [
         /^q-notification$/,
         ([, c], { theme }) => `[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] inline-flex mt-[10px] mx-[10px] mb-[0] [transition:transform_1s,_opacity_1s] flex-shrink-0 max-w-[95vw] bg-[#323232] text-[#fff] text-[14px]
-      sm:max-w-65vw z-9500 pointer-events-all`
+      sm:max-w-65vw z-${theme.quasar.z['notify']} pointer-events-all`
     ],
     [
         /^q-notification__icon$/,
@@ -97,75 +97,75 @@ const shortcuts = [
     ],
     [
         /^q-notification--top-left-enter-from$/,
-        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--top-left-leave-to$/,
-        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--top-enter-from$/,
-        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--top-leave-to$/,
-        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--top-right-enter-from$/,
-        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--top-right-leave-to$/,
-        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 -translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--left-enter-from$/,
-        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-9499`
+        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--left-leave-to$/,
-        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-9499`
+        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--center-enter-from$/,
-        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-9499`
+        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--center-leave-to$/,
-        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-9499`
+        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--right-enter-from$/,
-        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-9499`
+        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--right-leave-to$/,
-        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-9499`
+        ([, c], { theme }) => `opacity-0 [transform:rotateX(90deg)] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--bottom-left-enter-from$/,
-        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--bottom-left-leave-to$/,
-        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--bottom-enter-from$/,
-        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--bottom-leave-to$/,
-        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--bottom-right-enter-from$/,
-        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--bottom-right-leave-to$/,
-        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-9499`
+        ([, c], { theme }) => `opacity-0 translate-y-[50px] z-${theme.quasar.z['notify'] - 1}`
     ],
     [
         /^q-notification--top-left-leave-active$/,

package/dist/plugins/quasar/unocss/theme.js

@@ -15,7 +15,7 @@ const defaultTheme = {
         info: '#31CCEC',
         warning: '#F2C037',
         'dark-page': '#121212',
-        'q-dark': '#1d1d1d',
+        dark: '#1d1d1d',
         red: '#f44336',
         'red-1': '#ffebee',
         'red-2': '#ffcdd2',

package/dist/types/plugins/quasar/unocss/index.d.ts

@@ -1,9 +1,10 @@
+import { type Preset } from 'unocss';
 import { type QuasarIconSet, type QuasarPlugins } from 'quasar';
 export interface QuasarPresetOptions {
     plugins?: (keyof QuasarPlugins)[];
     iconSet?: QuasarIconSet;
 }
-declare const _default: import("unocss").Preset<object>;
+declare const _default: Preset<object>;
 export default _default;
 export declare const defaultSplitRE: RegExp;
 export declare const splitWithVariantGroupRE: RegExp;

package/dist/types/plugins/quasar/unocss/theme.d.ts

@@ -15,7 +15,7 @@ export interface QuasarTheme {
         info: string;
         warning: string;
         'dark-page': string;
-        'q-dark': string;
+        dark: string;
         red: string;
         'red-1': string;
         'red-2': string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vitrify",
-  "version": "0.17.9",
+  "version": "0.17.11",
   "license": "MIT",
   "author": "Stefan van Herwijnen",
   "description": "Vite as your Full Stack development tool",

package/src/node/plugins/quasar/unocss/components/QAjaxBar.unocss.ts

@@ -6,7 +6,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-loading-bar$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-loading-bar'] ??
-      `fixed z-9998 transition-transform bg-red`
+      `fixed z-${theme.quasar.z['max']} transition-transform bg-red`
   ],
   [/^q-loading-bar--top$/, ([, c], { theme }) => `left-0 right-0 top-0 w-full`],
   [

package/src/node/plugins/quasar/unocss/components/QBar.unocss.ts

@@ -6,7 +6,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-bar$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-bar'] ??
-      `bg-black op-20
+      `bg-black/20
     [&>.q-icon]:(ml-2px)
     [&>div]:(ml-8px)
     [&>div+.q-icon]:(ml-8px)
@@ -30,7 +30,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
       `px-8px py-0 h-24px text-14px
     [&_.q-btn]:(text-8px)`
   ],
-  [/^q-bar--dark$/, ([, c], { theme }) => `bg-white op-15`]
+  [/^q-bar--dark$/, ([, c], { theme }) => `bg-white/20`]
 ]
 
 export { shortcuts }

package/src/node/plugins/quasar/unocss/components/QBtn.unocss.ts

@@ -6,7 +6,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-btn$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-btn'] ??
-      `items-stretch relative outline-0 border-0 align-middle text-[14px] leading-[1.715em] no-underline [color:inherit] bg-transparent font-medium uppercase text-center w-auto h-auto cursor-default px-[16px] py-[4px] min-h-[2.572em] [&_.q-icon]:(text-[1.715em]) [&_.q-spinner]:(text-[1.715em]) [&.disabled]:(!opacity-70) [&:before]:(content-empty block absolute left-[0] right-[0] top-[0] bottom-[0] [border-radius:inherit] [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)])`
+      `font-medium items-stretch relative outline-0 border-0 align-middle text-[14px] leading-[1.715em] no-underline [color:inherit] bg-transparent font-medium uppercase text-center w-auto h-auto cursor-default px-[16px] py-[4px] min-h-[2.572em] [&_.q-icon]:(text-[1.715em]) [&_.q-spinner]:(text-[1.715em]) [&.disabled]:(!opacity-70) [&:before]:(content-empty block absolute left-[0] right-[0] top-[0] bottom-[0] [border-radius:inherit] [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)])`
     // inline-flex flex-col
   ],
 

package/src/node/plugins/quasar/unocss/components/QCard.unocss.ts

@@ -6,21 +6,29 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-card$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-card'] ??
-      `[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] align-top bg-[#fff] relative [&_>_div:not(.q--avoid-card-border)]:(rounded-tl-none rounded-tr-none rounded-bl-none rounded-br-none) [&_>_img:not(.q--avoid-card-border)]:(rounded-tl-none rounded-tr-none rounded-bl-none rounded-br-none) [&_>_div:nth-child(1_of_:not(.q--avoid-card-border))]:([border-top:0] [border-top-left-radius:inherit] [border-top-right-radius:inherit]) [&_>_img:nth-child(1_of_:not(.q--avoid-card-border))]:([border-top:0] [border-top-left-radius:inherit] [border-top-right-radius:inherit]) [&_>_div:nth-last-child(1_of_:not(.q--avoid-card-border))]:([border-bottom:0] [border-bottom-left-radius:inherit] [border-bottom-right-radius:inherit]) [&_>_img:nth-last-child(1_of_:not(.q--avoid-card-border))]:([border-bottom:0] [border-bottom-left-radius:inherit] [border-bottom-right-radius:inherit]) [&_>_div:not(.q--avoid-card-border)]:([border-left:0] [border-right:0] [box-shadow:none]) [&_>_img]:(block w-full max-w-full border-[0])`
+      `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] align-top bg-[#fff] relative
+      [&_>_div:not(.q--avoid-card-border)]:(rounded-tl-none rounded-tr-none rounded-bl-none rounded-br-none)
+      [&_>_img:not(.q--avoid-card-border)]:(rounded-tl-none rounded-tr-none rounded-bl-none rounded-br-none)
+      [&_>_div:nth-child(1_of_:not(.q--avoid-card-border))]:([border-top:0] [border-top-left-radius:inherit] [border-top-right-radius:inherit])
+      [&_>_img:nth-child(1_of_:not(.q--avoid-card-border))]:([border-top:0] [border-top-left-radius:inherit] [border-top-right-radius:inherit])
+      [&_>_div:nth-last-child(1_of_:not(.q--avoid-card-border))]:([border-bottom:0] [border-bottom-left-radius:inherit] [border-bottom-right-radius:inherit])
+      [&_>_img:nth-last-child(1_of_:not(.q--avoid-card-border))]:([border-bottom:0] [border-bottom-left-radius:inherit] [border-bottom-right-radius:inherit])
+      [&_>_div:not(.q--avoid-card-border)]:([border-left:0] [border-right:0] shadow-none)
+      [&_>_img]:(block w-full max-w-full border-[0])`
   ],
 
   [
     /^q-card--bordered$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-card--bordered'] ??
-      `border-[1px] border-solid border-[rgba(0,0,0,0.12)]`
+      `border-1px border-solid border-black/12`
   ],
 
   [
     /^q-card--dark$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-card--dark'] ??
-      `border-[rgba(255,_255,_255,_0.28)] [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)]`
+      `border-white/28 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-card__section$/, ([, c], { theme }) => `relative`],
@@ -31,7 +39,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-card__section--horiz$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-card__section--horiz'] ??
-      `[&_>_div:not(.q--avoid-card-border)]:(rounded-tl-none rounded-bl-none rounded-tr-none rounded-br-none) [&_>_img:not(.q--avoid-card-border)]:(rounded-tl-none rounded-bl-none rounded-tr-none rounded-br-none) [&_>_div:nth-child(1_of_:not(.q--avoid-card-border))]:([border-top-left-radius:inherit] [border-bottom-left-radius:inherit]) [&_>_img:nth-child(1_of_:not(.q--avoid-card-border))]:([border-top-left-radius:inherit] [border-bottom-left-radius:inherit]) [&_>_div:nth-last-child(1_of_:not(.q--avoid-card-border))]:([border-top-right-radius:inherit] [border-bottom-right-radius:inherit]) [&_>_img:nth-last-child(1_of_:not(.q--avoid-card-border))]:([border-top-right-radius:inherit] [border-bottom-right-radius:inherit]) [&_>_div:not(.q--avoid-card-border)]:([border-top:0] [border-bottom:0] [box-shadow:none])`
+      `[&_>_div:not(.q--avoid-card-border)]:(rounded-tl-none rounded-bl-none rounded-tr-none rounded-br-none) [&_>_img:not(.q--avoid-card-border)]:(rounded-tl-none rounded-bl-none rounded-tr-none rounded-br-none) [&_>_div:nth-child(1_of_:not(.q--avoid-card-border))]:([border-top-left-radius:inherit] [border-bottom-left-radius:inherit]) [&_>_img:nth-child(1_of_:not(.q--avoid-card-border))]:([border-top-left-radius:inherit] [border-bottom-left-radius:inherit]) [&_>_div:nth-last-child(1_of_:not(.q--avoid-card-border))]:([border-top-right-radius:inherit] [border-bottom-right-radius:inherit]) [&_>_img:nth-last-child(1_of_:not(.q--avoid-card-border))]:([border-top-right-radius:inherit] [border-bottom-right-radius:inherit]) [&_>_div:not(.q--avoid-card-border)]:([border-top:0] [border-bottom:0] shadow-none)`
   ],
 
   [

package/src/node/plugins/quasar/unocss/components/QChatMessage.unocss.ts

@@ -38,7 +38,8 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-message-text--received$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-message-text--received'] ??
-      `text-[#81c784] rounded-tl-[4px] rounded-br-[4px] rounded-tr-[4px] rounded-bl-[0] [&:last-child:before]:(right-full [border-right:0_solid_transparent] [border-left:8px_solid_transparent] [border-bottom:8px_solid_currentColor])`
+      `text-[#81c784] rounded-tl-[4px] rounded-br-[4px] rounded-tr-[4px] rounded-bl-[0]
+      [&:last-child:before]:(right-full [border-right:0_solid_transparent] [border-left:8px_solid_transparent] [border-bottom:8px_solid_currentColor])`
   ],
 
   [/^q-message-text-content--received$/, ([, c], { theme }) => `text-[#000]`],
@@ -62,7 +63,11 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-message-text$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-message-text'] ??
-      `bg-current p-[8px] leading-[1.2] relative [&_+_.q-message-text]:(mt-[3px]) [&:last-child]:(min-h-[48px]) [&:last-child_.q-message-stamp]:(block) [&:last-child:before]:(content-empty absolute bottom-0 w-[0] h-[0])`
+      `bg-current p-[8px] leading-[1.2] relative
+      [&_+_.q-message-text]:(mt-[3px])
+      [&:last-child]:(min-h-[48px])
+      [&:last-child_.q-message-stamp]:(block)
+      [&:last-child:before]:(content-empty absolute bottom-0 w-[0] h-[0])`
   ]
 ]
 

package/src/node/plugins/quasar/unocss/components/QCheckbox.unocss.ts

@@ -28,7 +28,12 @@ body.desktop .q-checkbox--dense:not(.disabled):focus .q-checkbox__inner:before,
 ]
 
 const shortcuts: UserShortcuts<QuasarTheme> = [
-  [/^q-checkbox$/, ([, c], { theme }) => `align-middle`],
+  [
+    /^q-checkbox$/,
+    ([, c], { theme }) =>
+      theme.quasar?.components?.['q-checkbox'] ??
+      `align-middle [&.disabled]:(!opacity-75)`
+  ],
 
   [/^q-checkbox__native$/, ([, c], { theme }) => `w-px h-px`],
 
@@ -49,7 +54,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-checkbox__truthy$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-checkbox__truthy'] ??
-      `stroke-current stroke-[3.12px]`
+      `stroke-current stroke-[3.12px] stroke-offset-[29.78334] stroke-dash-[29.78334]`
   ],
 
   [
@@ -63,14 +68,16 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-checkbox__inner$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-checkbox__inner'] ??
-      `text-[40px] w-[1em] min-w-[1em] h-[1em] outline-0 rounded-[50%] text-[rgba(0,_0,_0,_0.54)]`
+      `text-[40px] w-[1em] min-w-[1em] h-[1em] outline-[0] rounded-[50%] layer-dismiss:text-[rgba(0,_0,_0,_0.54)]`
   ],
 
   [
     /^q-checkbox__inner--truthy$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-checkbox__inner--truthy'] ??
-      `text-primary [&_.q-checkbox\\_\\_bg]:(bg-current) [&_path]:([transition:stroke-dashoffset_0.18s_cubic-bezier(0.4,_0,_0.6,_1)_0ms])`
+      `text-primary
+      [&_.q-checkbox\\_\\_bg]:(bg-current)
+      [&_path]:(stroke-offset-none [transition:stroke-dashoffset_0.18s_cubic-bezier(0.4,_0,_0.6,_1)_0ms])`
   ],
 
   [
@@ -84,14 +91,20 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-checkbox--dark$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-checkbox--dark'] ??
-      `[&_.q-checkbox\\_\\_inner]:(text-[rgba(255,_255,_255,_0.7)]) [&_.q-checkbox\\_\\_inner:before]:(!opacity-[0.32]) [&_.q-checkbox\\_\\_inner--truthy]:(text-primary) [&_.q-checkbox\\_\\_inner--indet]:(text-primary)`
+      `[&_.q-checkbox\\_\\_inner]:(layer-dismiss:text-[rgba(255,_255,_255,_0.7)])
+       [&_.q-checkbox\\_\\_inner:before]:(!opacity-[0.32])
+       [&_.q-checkbox\\_\\_inner--truthy]:(layer-dismiss:text-primary)
+       [&_.q-checkbox\\_\\_inner--indet]:(layer-dismiss:text-primary)`
   ],
 
   [
     /^q-checkbox--dense$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-checkbox--dense'] ??
-      `[&_.q-checkbox\\_\\_inner]:(w-[0.5em] min-w-[0.5em] h-[0.5em]) [&_.q-checkbox\\_\\_bg]:(left-[5%] top-[5%] w-[90%] h-[90%]) [&_.q-checkbox\\_\\_label]:(pl-[0.5em])`
+      `[&_.q-checkbox\\_\\_inner]:(w-[0.5em] min-w-[0.5em] h-[0.5em])
+       [&_.q-checkbox\\_\\_bg]:(left-[5%] top-[5%] w-[90%] h-[90%])
+       [&_.q-checkbox\\_\\_label]:(pl-[0.5em])
+       [&.reverse_.q-checkbox\\_\\_label]:(pl-0 pr-[0.5em])`
   ]
 ]
 

package/src/node/plugins/quasar/unocss/components/QDrawer.unocss.ts

@@ -6,12 +6,14 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-drawer$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-drawer'] ??
-      `absolute top-[0] bottom-[0] bg-[#fff]`
+      `absolute top-[0] bottom-[0] bg-[#fff] z-${theme.quasar.z['side']}`
   ],
 
   [
     /^q-drawer--on-top$/,
-    ([, c], { theme }) => theme.quasar?.components?.['q-drawer--on-top'] ?? ``
+    ([, c], { theme }) =>
+      theme.quasar?.components?.['q-drawer--on-top'] ??
+      `z-${theme.quasar.z['top']}`
   ],
 
   [
@@ -65,14 +67,16 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
 
   [
     /^q-drawer__backdrop$/,
-    ([, c], { theme }) => theme.quasar?.components?.['q-drawer__backdrop'] ?? ``
+    ([, c], { theme }) =>
+      theme.quasar?.components?.['q-drawer__backdrop'] ??
+      `z-${theme.quasar.z['top'] - 1}`
   ],
 
   [
     /^q-drawer__opener$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-drawer__opener'] ??
-      `h-full w-[15px] select-none`
+      `h-full w-[15px] select-none z-${theme.quasar.z['marginals'] + 1}`
   ]
 ]
 

package/src/node/plugins/quasar/unocss/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-2000`
+      `[&_.q-layout\\_\\_shadow]:(-top-[10px]) [&_.q-layout\\_\\_shadow:after]:(top-[10px])  relative z-${theme.quasar.z['marginals']}`
   ]
 ]
 

package/src/node/plugins/quasar/unocss/components/QMenu.unocss.ts

@@ -6,7 +6,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-menu$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-menu'] ??
-      `!fixed inline-block max-w-[95vw] max-h-[65vh] [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)] bg-[#fff] rounded-[4px] overflow-y-auto overflow-x-hidden outline-0 z-6000`
+      `!fixed inline-block max-w-[95vw] max-h-[65vh] [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)] bg-[#fff] rounded-[4px] overflow-y-auto overflow-x-hidden outline-0 z-${theme.quasar.z['menu']}`
   ],
 
   [/^q-menu--square$/, ([, c], { theme }) => `rounded-none`],

package/src/node/plugins/quasar/unocss/components/QTabPanel.unocss.ts

@@ -2,7 +2,7 @@ import type { Preflight, Rule, UserShortcuts } from '@unocss/core'
 import type { QuasarTheme } from '../theme.js'
 
 const shortcuts: UserShortcuts<QuasarTheme> = [
-  [/^q-tab-panels$/, ([, c], { theme }) => `bg-[#fff]`],
+  [/^q-tab-panels$/, ([, c], { theme }) => `bg-inherit`],
 
   [/^q-tab-panel$/, ([, c], { theme }) => `p-[16px]`]
 ]

package/src/node/plugins/quasar/unocss/components/QTooltip.unocss.ts

@@ -13,7 +13,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-tooltip$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-tooltip'] ??
-      `z-9000 !fixed overflow-y-auto overflow-x-hidden px-[10px] py-[6px] max-w-[95vw] max-h-[65vh] sm:(text-14px pt-8px pb-8px pl-16px pr-16px)`
+      `z-${theme.quasar.z['tooltip']} !fixed overflow-y-auto overflow-x-hidden px-[10px] py-[6px] max-w-[95vw] max-h-[65vh] sm:(text-14px pt-8px pb-8px pl-16px pr-16px)`
   ]
 ]
 

package/src/node/plugins/quasar/unocss/core/colors.unocss.ts

@@ -12,7 +12,7 @@ const preflights: Preflight<QuasarTheme>[] = [
   --q-negative: ${theme.colors.negative};
   --q-info: ${theme.colors.info};
   --q-warning: ${theme.colors.warning};
-  --q-dark: ${theme.colors['q-dark']};
+  --q-dark: ${theme.colors['dark']};
   --q-dark-page: ${theme.colors['dark-page']};
 }`
   }

package/src/node/plugins/quasar/unocss/core/flex.unocss.ts

@@ -13,11 +13,17 @@ const colGutter = {
   xl: 12
 } as const
 
-const sizes = ['sm', 'md', 'lg', 'xl']
-
 const shortcuts: UserShortcuts<QuasarTheme> = [
-  [/^row$/, ([, c], { theme }) => `flex flex-row flex-wrap`],
-  [/^column$/, ([, c], { theme }) => `flex flex-col flex-wrap`],
+  [
+    /^row$/,
+    ([, c], { theme }) =>
+      `flex flex-row flex-wrap [&.reverse]:(flex-row-reverse)`
+  ],
+  [
+    /^column$/,
+    ([, c], { theme }) =>
+      `flex flex-col flex-wrap [&.reverse]:(flex-col-reverse)`
+  ],
   [
     /^col(?:-)?(none|xs|sm|md|lg|xl)?(?:-)?([2-9]|1[0-2]?)?$/,
     ([, size, nr], { theme }) => {
@@ -59,17 +65,19 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-gutter-x-(none|xs|sm|md|lg|xl)$/,
     ([, size], { theme }) =>
       `ml--${colGutter[size as 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl']}
-      space-x-${colGutter[size as 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl']})`
+      space-x-${colGutter[size as 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl']}`
   ],
   [
     /^q-gutter-y-(none|xs|sm|md|lg|xl)$/,
     ([, size], { theme }) =>
       `mt--${colGutter[size as 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl']}
-       space-y-${colGutter[size as 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl']})`
+       space-y-${colGutter[size as 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl']}`
   ],
   [/^wrap$/, ([, size], { theme }) => `flex-wrap`],
   [/^no-wrap$/, ([, size], { theme }) => `flex-nowrap`],
-  [/^reverse-wrap$/, ([, size], { theme }) => `flex-wrap-reverse`]
+  [/^reverse-wrap$/, ([, size], { theme }) => `flex-wrap-reverse`],
+  [/^flex-center$/, ([, c], { theme }) => 'justify-center items-center'],
+  [/^inline$/, ([, c], { theme }) => 'flex-inline!']
 ]
 
 export { shortcuts }

package/src/node/plugins/quasar/unocss/core/position.unocss.ts

@@ -75,7 +75,9 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
 
   [/^on-right$/, ([, c], { theme }) => `ml-[12px]`],
 
-  [/^q-position-engine$/, ([, c], { theme }) => `!mt-0 !ml-0`]
+  [/^q-position-engine$/, ([, c], { theme }) => `!mt-0 !ml-0`],
+
+  [/^relative-position$/, ([, c], { theme }) => `relative`]
 ]
 
 export { shortcuts }

package/src/node/plugins/quasar/unocss/directives/QRipple.unocss.ts

@@ -5,7 +5,7 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
   [
     /^q-ripple$/,
     ([, c], { theme }) =>
-      `absolute top-0 left-0 w-full h-full [color:inherit] [border-radius:inherit] z-0 pointer-events-none overflow-hidden`
+      `absolute top-0 left-0 w-full h-full [color:inherit] [border-radius:inherit] z-0 pointer-events-none overflow-hidden z-0`
   ],
 
   [