vitrify 0.17.11 → 0.17.13

package/dist/plugins/quasar/unocss/components/QTime.unocss.js

@@ -12,7 +12,7 @@ const shortcuts = [
     [
         /^q-time__header$/,
         ([, c], { theme }) => theme.quasar?.components?.['q-time__header'] ??
-            `[border-top-left-radius:inherit] text-[#fff] p-[16px] font-light`
+            `[border-top-left-radius:inherit] text-[#fff] p-[16px] font-light bg-primary`
     ],
     [
         /^q-time__actions$/,
@@ -22,7 +22,7 @@ const shortcuts = [
     [
         /^q-time__header-label$/,
         ([, c], { theme }) => theme.quasar?.components?.['q-time__header-label'] ??
-            `text-[28px] leading-none tracking-[-0.00833em] [&_>_div_+_div]:(ml-[4px])`
+            `text-[28px] leading-none tracking-[-0.00833em] [&_>_div_+_div]:(ml-[4px]) !flex-initial`
     ],
     [
         /^q-time__link$/,
@@ -36,7 +36,7 @@ const shortcuts = [
     [
         /^q-time__header-ampm$/,
         ([, c], { theme }) => theme.quasar?.components?.['q-time__header-ampm'] ??
-            `text-[16px] tracking-widest`
+            `text-[16px] tracking-widest !flex-initial`
     ],
     [
         /^q-time__content$/,
@@ -55,7 +55,7 @@ const shortcuts = [
     [
         /^q-time__clock$/,
         ([, c], { theme }) => theme.quasar?.components?.['q-time__clock'] ??
-            `p-[24px] w-full h-full max-w-full max-h-full text-[14px]`
+            `p-[24px] w-[calc(100%-48px)] h-[calc(100%-48px)] max-w-full max-h-full text-[14px]`
     ],
     [
         /^q-time__clock-circle$/,

package/dist/plugins/quasar/unocss/components/QToggle.unocss.js

@@ -36,17 +36,17 @@ const shortcuts = [
     [
         /^q-toggle__track$/,
         ([, c], { theme }) => theme.quasar?.components?.['q-toggle__track'] ??
-            `h-[0.35em] rounded-[0.175em] opacity-[0.38] bg-current`
+            `h-[0.35em] max-w-32px rounded-[0.175em] opacity-[0.38] bg-current`
     ],
     [
         /^q-toggle__thumb$/,
         ([, c], { theme }) => theme.quasar?.components?.['q-toggle__thumb'] ??
-            `top-[0.25em] left-[0.25em] w-[0.5em] h-[0.5em] [transition:left_0.22s_cubic-bezier(0.4,_0,_0.2,_1)] select-none z-0 [&:after]:(content-[''] absolute top-[0] right-[0] bottom-[0] left-[0] rounded-[50%] bg-[#fff] [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)]) [&_.q-icon]:(text-[0.3em] min-w-[1em] text-[#000] opacity-[0.54])`
+            `top-[0.25em] left-[0.25em] w-[0.5em] h-[0.5em] [transition:left_0.22s_cubic-bezier(0.4,_0,_0.2,_1)] select-none z-0 [&:after]:(content-[''] absolute top-[0] right-[0] bottom-[0] left-[0] rounded-[50%] bg-[#fff] [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)]) [&_.q-icon]:(layer-components:text-[0.3em] min-w-[1em] layer-components:text-[#000] opacity-[0.54])`
     ],
     [
         /^q-toggle__inner$/,
         ([, c], { theme }) => theme.quasar?.components?.['q-toggle__inner'] ??
-            `text-[40px] w-[1.4em] min-w-[1.4em] h-[1em] px-[0.3em] py-[0.325em]`
+            `text-[40px] w-[1.4em] min-w-[1.4em] max-h-[1em] px-[0.3em] py-[0.325em]`
     ],
     [
         /^q-toggle__inner--indet$/,
@@ -56,12 +56,13 @@ const shortcuts = [
     [
         /^q-toggle__inner--truthy$/,
         ([, c], { theme }) => theme.quasar?.components?.['q-toggle__inner--truthy'] ??
-            ` [&_.q-toggle\\_\\_track]:(opacity-[0.54]) [&_.q-toggle\\_\\_thumb]:(left-[0.65em]) [&_.q-toggle\\_\\_thumb:after]:(bg-current) [&_.q-toggle\\_\\_thumb_.q-icon]:(text-[#fff] opacity-100)`
+            `layer-components:text-primary [&_.q-toggle\\_\\_track]:(opacity-[0.54]) [&_.q-toggle\\_\\_thumb]:(left-[0.65em]) [&_.q-toggle\\_\\_thumb:after]:(bg-current) [&_.q-toggle\\_\\_thumb_.q-icon]:(layer-components:text-[#fff] opacity-100)`
     ],
     [
         /^q-toggle--dark$/,
         ([, c], { theme }) => theme.quasar?.components?.['q-toggle--dark'] ??
-            `[&_.q-toggle\\_\\_inner]:(text-[#fff]) [&_.q-toggle\\_\\_inner--truthy]:(text-primary) [&_.q-toggle\\_\\_thumb:after]:([box-shadow:none]) [&_.q-toggle\\_\\_thumb:before]:(!opacity-[0.32])`
+            `[&_.q-toggle\\_\\_inner--truthy]:() [&_.q-toggle\\_\\_thumb:after]:([box-shadow:none]) [&_.q-toggle\\_\\_thumb:before]:(!opacity-[0.32])`
+        // [&_.q-toggle\\_\\_inner]:(layer-components:text-[#fff])
     ],
     [
         /^q-toggle--dense$/,

package/dist/plugins/quasar/unocss/core/flex.unocss.js

@@ -11,11 +11,11 @@ const colGutter = {
 const shortcuts = [
     [
         /^row$/,
-        ([, c], { theme }) => `flex flex-row flex-wrap [&.reverse]:(flex-row-reverse)`
+        ([, c], { theme }) => `flex flex-row flex-wrap flex-auto [&.reverse]:(flex-row-reverse)`
     ],
     [
         /^column$/,
-        ([, c], { theme }) => `flex flex-col flex-wrap [&.reverse]:(flex-col-reverse)`
+        ([, c], { theme }) => `flex flex-col flex-wrap flex-auto [&.reverse]:(flex-col-reverse)`
     ],
     [
         /^col(?:-)?(none|xs|sm|md|lg|xl)?(?:-)?([2-9]|1[0-2]?)?$/,
@@ -34,31 +34,33 @@ const shortcuts = [
     ],
     [
         /^q-col-gutter-(none|xs|sm|md|lg|xl)$/,
-        ([, size], { theme }) => `gap-${colGutter[size]}`
+        ([, size], { theme }) => `gap-${colGutter[size]}
+      [&_>_[class^="col"]]:(mr--${colGutter[size]})
+      [&_>_[class^="col"]]:(mb--${colGutter[size]})`
     ],
     [
         /^q-col-gutter-x-(none|xs|sm|md|lg|xl)$/,
-        ([, size], { theme }) => `gap-x-${colGutter[size]}`
+        ([, size], { theme }) => `gap-x-${colGutter[size]}
+      [&_>_[class^="col"]]:(mr--${colGutter[size]})`
     ],
     [
         /^q-col-gutter-y-(none|xs|sm|md|lg|xl)$/,
-        ([, size], { theme }) => `gap-y-${colGutter[size]}`
+        ([, size], { theme }) => `gap-y-${colGutter[size]}
+      [&_>_[class^="col"]]:(mb--${colGutter[size]})`
     ],
     [
         /^q-gutter-(none|xs|sm|md|lg|xl)$/,
-        ([, size], { theme }) => `mt--${colGutter[size]}
-        ml--${colGutter[size]}
-    [&_>_*]:(ml-${colGutter[size]} mt-${colGutter[size]})`
+        ([, size], { theme }) => `[&_>_*]:(mr-${colGutter[size]} mb-${colGutter[size]})`
     ],
     [
         /^q-gutter-x-(none|xs|sm|md|lg|xl)$/,
-        ([, size], { theme }) => `ml--${colGutter[size]}
-      space-x-${colGutter[size]}`
+        ([, size], { theme }) => `
+        [&_>_*]:(mr-${colGutter[size]})`
     ],
     [
         /^q-gutter-y-(none|xs|sm|md|lg|xl)$/,
-        ([, size], { theme }) => `mt--${colGutter[size]}
-       space-y-${colGutter[size]}`
+        ([, size], { theme }) => `
+        [&_>_*]:(mb-${colGutter[size]})`
     ],
     [/^wrap$/, ([, size], { theme }) => `flex-wrap`],
     [/^no-wrap$/, ([, size], { theme }) => `flex-nowrap`],

package/dist/plugins/quasar/unocss/core/size.unocss.js

@@ -16,90 +16,102 @@ const shortcuts = [
     [/^full-width$/, ([, c], { theme }) => `!w-full !ml-0 !mr-0`],
     [/^window-height$/, ([, c], { theme }) => `!mt-0 !mb-0 !h-screen`],
     [/^window-width$/, ([, c], { theme }) => `!ml-0 !mr-0 !w-screen`],
-    [/^q-pa-none$/, ([, c], { theme }) => `p-[0]`],
-    [/^q-pl-none$/, ([, c], { theme }) => `pl-0`],
-    [/^q-pr-none$/, ([, c], { theme }) => `pr-0`],
-    [/^q-pt-none$/, ([, c], { theme }) => `pt-0`],
-    [/^q-pb-none$/, ([, c], { theme }) => `pb-0`],
-    [/^q-px-none$/, ([, c], { theme }) => `pl-0 pr-0`],
-    [/^q-py-none$/, ([, c], { theme }) => `pt-0 pb-0`],
-    [/^q-ma-none$/, ([, c], { theme }) => `m-[0]`],
-    [/^q-ml-none$/, ([, c], { theme }) => `ml-0`],
-    [/^q-mr-none$/, ([, c], { theme }) => `mr-0`],
-    [/^q-mt-none$/, ([, c], { theme }) => `mt-0`],
-    [/^q-mb-none$/, ([, c], { theme }) => `mb-0`],
-    [/^q-mx-none$/, ([, c], { theme }) => `ml-0 mr-0`],
-    [/^q-my-none$/, ([, c], { theme }) => `mt-0 mb-0`],
-    [/^q-pa-xs$/, ([, c], { theme }) => `p-[4px]`],
-    [/^q-pl-xs$/, ([, c], { theme }) => `pl-[4px]`],
-    [/^q-pr-xs$/, ([, c], { theme }) => `pr-[4px]`],
-    [/^q-pt-xs$/, ([, c], { theme }) => `pt-[4px]`],
-    [/^q-pb-xs$/, ([, c], { theme }) => `pb-[4px]`],
-    [/^q-px-xs$/, ([, c], { theme }) => `pl-[4px] pr-[4px]`],
-    [/^q-py-xs$/, ([, c], { theme }) => `pt-[4px] pb-[4px]`],
-    [/^q-ma-xs$/, ([, c], { theme }) => `m-[4px]`],
-    [/^q-ml-xs$/, ([, c], { theme }) => `ml-[4px]`],
-    [/^q-mr-xs$/, ([, c], { theme }) => `mr-[4px]`],
-    [/^q-mt-xs$/, ([, c], { theme }) => `mt-[4px]`],
-    [/^q-mb-xs$/, ([, c], { theme }) => `mb-[4px]`],
-    [/^q-mx-xs$/, ([, c], { theme }) => `ml-[4px] mr-[4px]`],
-    [/^q-my-xs$/, ([, c], { theme }) => `mt-[4px] mb-[4px]`],
-    [/^q-pa-sm$/, ([, c], { theme }) => `p-[8px]`],
-    [/^q-pl-sm$/, ([, c], { theme }) => `pl-[8px]`],
-    [/^q-pr-sm$/, ([, c], { theme }) => `pr-[8px]`],
-    [/^q-pt-sm$/, ([, c], { theme }) => `pt-[8px]`],
-    [/^q-pb-sm$/, ([, c], { theme }) => `pb-[8px]`],
-    [/^q-px-sm$/, ([, c], { theme }) => `pl-[8px] pr-[8px]`],
-    [/^q-py-sm$/, ([, c], { theme }) => `pt-[8px] pb-[8px]`],
-    [/^q-ma-sm$/, ([, c], { theme }) => `m-[8px]`],
-    [/^q-ml-sm$/, ([, c], { theme }) => `ml-[8px]`],
-    [/^q-mr-sm$/, ([, c], { theme }) => `mr-[8px]`],
-    [/^q-mt-sm$/, ([, c], { theme }) => `mt-[8px]`],
-    [/^q-mb-sm$/, ([, c], { theme }) => `mb-[8px]`],
-    [/^q-mx-sm$/, ([, c], { theme }) => `ml-[8px] mr-[8px]`],
-    [/^q-my-sm$/, ([, c], { theme }) => `mt-[8px] mb-[8px]`],
-    [/^q-pa-md$/, ([, c], { theme }) => `p-[16px]`],
-    [/^q-pl-md$/, ([, c], { theme }) => `pl-[16px]`],
-    [/^q-pr-md$/, ([, c], { theme }) => `pr-[16px]`],
-    [/^q-pt-md$/, ([, c], { theme }) => `pt-[16px]`],
-    [/^q-pb-md$/, ([, c], { theme }) => `pb-[16px]`],
-    [/^q-px-md$/, ([, c], { theme }) => `pl-[16px] pr-[16px]`],
-    [/^q-py-md$/, ([, c], { theme }) => `pt-[16px] pb-[16px]`],
-    [/^q-ma-md$/, ([, c], { theme }) => `m-[16px]`],
-    [/^q-ml-md$/, ([, c], { theme }) => `ml-[16px]`],
-    [/^q-mr-md$/, ([, c], { theme }) => `mr-[16px]`],
-    [/^q-mt-md$/, ([, c], { theme }) => `mt-[16px]`],
-    [/^q-mb-md$/, ([, c], { theme }) => `mb-[16px]`],
-    [/^q-mx-md$/, ([, c], { theme }) => `ml-[16px] mr-[16px]`],
-    [/^q-my-md$/, ([, c], { theme }) => `mt-[16px] mb-[16px]`],
-    [/^q-pa-lg$/, ([, c], { theme }) => `p-[24px]`],
-    [/^q-pl-lg$/, ([, c], { theme }) => `pl-[24px]`],
-    [/^q-pr-lg$/, ([, c], { theme }) => `pr-[24px]`],
-    [/^q-pt-lg$/, ([, c], { theme }) => `pt-[24px]`],
-    [/^q-pb-lg$/, ([, c], { theme }) => `pb-[24px]`],
-    [/^q-px-lg$/, ([, c], { theme }) => `pl-[24px] pr-[24px]`],
-    [/^q-py-lg$/, ([, c], { theme }) => `pt-[24px] pb-[24px]`],
-    [/^q-ma-lg$/, ([, c], { theme }) => `m-[24px]`],
-    [/^q-ml-lg$/, ([, c], { theme }) => `ml-[24px]`],
-    [/^q-mr-lg$/, ([, c], { theme }) => `mr-[24px]`],
-    [/^q-mt-lg$/, ([, c], { theme }) => `mt-[24px]`],
-    [/^q-mb-lg$/, ([, c], { theme }) => `mb-[24px]`],
-    [/^q-mx-lg$/, ([, c], { theme }) => `ml-[24px] mr-[24px]`],
-    [/^q-my-lg$/, ([, c], { theme }) => `mt-[24px] mb-[24px]`],
-    [/^q-pa-xl$/, ([, c], { theme }) => `p-[48px]`],
-    [/^q-pl-xl$/, ([, c], { theme }) => `pl-[48px]`],
-    [/^q-pr-xl$/, ([, c], { theme }) => `pr-[48px]`],
-    [/^q-pt-xl$/, ([, c], { theme }) => `pt-[48px]`],
-    [/^q-pb-xl$/, ([, c], { theme }) => `pb-[48px]`],
-    [/^q-px-xl$/, ([, c], { theme }) => `pl-[48px] pr-[48px]`],
-    [/^q-py-xl$/, ([, c], { theme }) => `pt-[48px] pb-[48px]`],
-    [/^q-ma-xl$/, ([, c], { theme }) => `m-[48px]`],
-    [/^q-ml-xl$/, ([, c], { theme }) => `ml-[48px]`],
-    [/^q-mr-xl$/, ([, c], { theme }) => `mr-[48px]`],
-    [/^q-mt-xl$/, ([, c], { theme }) => `mt-[48px]`],
-    [/^q-mb-xl$/, ([, c], { theme }) => `mb-[48px]`],
-    [/^q-mx-xl$/, ([, c], { theme }) => `ml-[48px] mr-[48px]`],
-    [/^q-my-xl$/, ([, c], { theme }) => `mt-[48px] mb-[48px]`],
+    [
+        /^q-p(a|t|b|l|r|x|y)?(?:-)(none|xs|sm|md|lg|xl)$/,
+        ([, side, size], { theme }) => {
+            return `p${side}-${theme.quasar?.spaces[size]}`;
+        }
+    ],
+    [
+        /^q-m(a|t|b|l|r|x|y)?(?:-)(none|xs|sm|md|lg|xl)$/,
+        ([, side, size], { theme }) => {
+            return `m${side}-${theme.quasar?.spaces[size]}`;
+        }
+    ],
+    // [/^q-pa-none$/, ([, c], { theme }) => `p-[0]`],
+    // [/^q-pl-none$/, ([, c], { theme }) => `pl-0`],
+    // [/^q-pr-none$/, ([, c], { theme }) => `pr-0`],
+    // [/^q-pt-none$/, ([, c], { theme }) => `pt-0`],
+    // [/^q-pb-none$/, ([, c], { theme }) => `pb-0`],
+    // [/^q-px-none$/, ([, c], { theme }) => `pl-0 pr-0`],
+    // [/^q-py-none$/, ([, c], { theme }) => `pt-0 pb-0`],
+    // [/^q-ma-none$/, ([, c], { theme }) => `m-[0]`],
+    // [/^q-ml-none$/, ([, c], { theme }) => `ml-0`],
+    // [/^q-mr-none$/, ([, c], { theme }) => `mr-0`],
+    // [/^q-mt-none$/, ([, c], { theme }) => `mt-0`],
+    // [/^q-mb-none$/, ([, c], { theme }) => `mb-0`],
+    // [/^q-mx-none$/, ([, c], { theme }) => `ml-0 mr-0`],
+    // [/^q-my-none$/, ([, c], { theme }) => `mt-0 mb-0`],
+    // [/^q-pa-xs$/, ([, c], { theme }) => `p-[4px]`],
+    // [/^q-pl-xs$/, ([, c], { theme }) => `pl-[4px]`],
+    // [/^q-pr-xs$/, ([, c], { theme }) => `pr-[4px]`],
+    // [/^q-pt-xs$/, ([, c], { theme }) => `pt-[4px]`],
+    // [/^q-pb-xs$/, ([, c], { theme }) => `pb-[4px]`],
+    // [/^q-px-xs$/, ([, c], { theme }) => `pl-[4px] pr-[4px]`],
+    // [/^q-py-xs$/, ([, c], { theme }) => `pt-[4px] pb-[4px]`],
+    // [/^q-ma-xs$/, ([, c], { theme }) => `m-[4px]`],
+    // [/^q-ml-xs$/, ([, c], { theme }) => `ml-[4px]`],
+    // [/^q-mr-xs$/, ([, c], { theme }) => `mr-[4px]`],
+    // [/^q-mt-xs$/, ([, c], { theme }) => `mt-[4px]`],
+    // [/^q-mb-xs$/, ([, c], { theme }) => `mb-[4px]`],
+    // [/^q-mx-xs$/, ([, c], { theme }) => `ml-[4px] mr-[4px]`],
+    // [/^q-my-xs$/, ([, c], { theme }) => `mt-[4px] mb-[4px]`],
+    // [/^q-pa-sm$/, ([, c], { theme }) => `p-[8px]`],
+    // [/^q-pl-sm$/, ([, c], { theme }) => `pl-[8px]`],
+    // [/^q-pr-sm$/, ([, c], { theme }) => `pr-[8px]`],
+    // [/^q-pt-sm$/, ([, c], { theme }) => `pt-[8px]`],
+    // [/^q-pb-sm$/, ([, c], { theme }) => `pb-[8px]`],
+    // [/^q-px-sm$/, ([, c], { theme }) => `pl-[8px] pr-[8px]`],
+    // [/^q-py-sm$/, ([, c], { theme }) => `pt-[8px] pb-[8px]`],
+    // [/^q-ma-sm$/, ([, c], { theme }) => `m-[8px]`],
+    // [/^q-ml-sm$/, ([, c], { theme }) => `ml-[8px]`],
+    // [/^q-mr-sm$/, ([, c], { theme }) => `mr-[8px]`],
+    // [/^q-mt-sm$/, ([, c], { theme }) => `mt-[8px]`],
+    // [/^q-mb-sm$/, ([, c], { theme }) => `mb-[8px]`],
+    // [/^q-mx-sm$/, ([, c], { theme }) => `ml-[8px] mr-[8px]`],
+    // [/^q-my-sm$/, ([, c], { theme }) => `mt-[8px] mb-[8px]`],
+    // [/^q-pa-md$/, ([, c], { theme }) => `p-[16px]`],
+    // [/^q-pl-md$/, ([, c], { theme }) => `pl-[16px]`],
+    // [/^q-pr-md$/, ([, c], { theme }) => `pr-[16px]`],
+    // [/^q-pt-md$/, ([, c], { theme }) => `pt-[16px]`],
+    // [/^q-pb-md$/, ([, c], { theme }) => `pb-[16px]`],
+    // [/^q-px-md$/, ([, c], { theme }) => `pl-[16px] pr-[16px]`],
+    // [/^q-py-md$/, ([, c], { theme }) => `pt-[16px] pb-[16px]`],
+    // [/^q-ma-md$/, ([, c], { theme }) => `m-[16px]`],
+    // [/^q-ml-md$/, ([, c], { theme }) => `ml-[16px]`],
+    // [/^q-mr-md$/, ([, c], { theme }) => `mr-[16px]`],
+    // [/^q-mt-md$/, ([, c], { theme }) => `mt-[16px]`],
+    // [/^q-mb-md$/, ([, c], { theme }) => `mb-[16px]`],
+    // [/^q-mx-md$/, ([, c], { theme }) => `ml-[16px] mr-[16px]`],
+    // [/^q-my-md$/, ([, c], { theme }) => `mt-[16px] mb-[16px]`],
+    // [/^q-pa-lg$/, ([, c], { theme }) => `p-[24px]`],
+    // [/^q-pl-lg$/, ([, c], { theme }) => `pl-[24px]`],
+    // [/^q-pr-lg$/, ([, c], { theme }) => `pr-[24px]`],
+    // [/^q-pt-lg$/, ([, c], { theme }) => `pt-[24px]`],
+    // [/^q-pb-lg$/, ([, c], { theme }) => `pb-[24px]`],
+    // [/^q-px-lg$/, ([, c], { theme }) => `pl-[24px] pr-[24px]`],
+    // [/^q-py-lg$/, ([, c], { theme }) => `pt-[24px] pb-[24px]`],
+    // [/^q-ma-lg$/, ([, c], { theme }) => `m-[24px]`],
+    // [/^q-ml-lg$/, ([, c], { theme }) => `ml-[24px]`],
+    // [/^q-mr-lg$/, ([, c], { theme }) => `mr-[24px]`],
+    // [/^q-mt-lg$/, ([, c], { theme }) => `mt-[24px]`],
+    // [/^q-mb-lg$/, ([, c], { theme }) => `mb-[24px]`],
+    // [/^q-mx-lg$/, ([, c], { theme }) => `ml-[24px] mr-[24px]`],
+    // [/^q-my-lg$/, ([, c], { theme }) => `mt-[24px] mb-[24px]`],
+    // [/^q-pa-xl$/, ([, c], { theme }) => `p-[48px]`],
+    // [/^q-pl-xl$/, ([, c], { theme }) => `pl-[48px]`],
+    // [/^q-pr-xl$/, ([, c], { theme }) => `pr-[48px]`],
+    // [/^q-pt-xl$/, ([, c], { theme }) => `pt-[48px]`],
+    // [/^q-pb-xl$/, ([, c], { theme }) => `pb-[48px]`],
+    // [/^q-px-xl$/, ([, c], { theme }) => `pl-[48px] pr-[48px]`],
+    // [/^q-py-xl$/, ([, c], { theme }) => `pt-[48px] pb-[48px]`],
+    // [/^q-ma-xl$/, ([, c], { theme }) => `m-[48px]`],
+    // [/^q-ml-xl$/, ([, c], { theme }) => `ml-[48px]`],
+    // [/^q-mr-xl$/, ([, c], { theme }) => `mr-[48px]`],
+    // [/^q-mt-xl$/, ([, c], { theme }) => `mt-[48px]`],
+    // [/^q-mb-xl$/, ([, c], { theme }) => `mb-[48px]`],
+    // [/^q-mx-xl$/, ([, c], { theme }) => `ml-[48px] mr-[48px]`],
+    // [/^q-my-xl$/, ([, c], { theme }) => `mt-[48px] mb-[48px]`],
     [/^q-mt-auto$/, ([, c], { theme }) => `mt-auto`],
     [/^q-my-auto$/, ([, c], { theme }) => `mt-auto mb-auto`],
     [/^q-ml-auto$/, ([, c], { theme }) => `ml-auto`],

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

@@ -104,6 +104,9 @@ const toKebabCase = (str) => str
     .match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g)
     ?.map((x) => x.toLowerCase())
     .join('-') ?? '';
+const componentsSafelistMap = {
+    QSelect: ['q-list', 'q-item', 'q-virtual-scroll', 'q-menu']
+};
 const pluginSafelistMap = {
     BottomSheet: [
         'q-bottom-sheet',
@@ -1776,9 +1779,11 @@ textarea {
             ].concat(QBreadcrumbsPreflights, QCheckboxPreflights, QChipPreflights, QCircularProgressPreflights, QDialogPreflights, QFieldPreflights, QLayoutPreflights, QLinearProgressPreflights, QRadioPreflights, QSelectPreflights, QSpinnerPreflights, QSkeletonPreflights, QTablePreflights, QTogglePreflights, QTreePreflights, ColorPreflights, DarkPreflights, HelperPreflights, MousePreflights, TypographyPreflights, VisibilityPreflights, TransitionPreflights, SizePreflights),
             rules: [].concat(MouseRules, HelperRules, ElevationRules, VisibilityRules),
             shortcuts: [].concat(QIconShortcuts, QAjaxBarShortcuts, QAvatarShortcuts, QBadgeShortcuts, QBreadcrumbsShortcuts, QBannerShortcuts, QBarShortcuts, QBtnShortcuts, QBtnDropdownShortcuts, QBtnGroupShortcuts, QBtnToggleShortcuts, QCardShortcuts, QCarouselShortcuts, QChatMessageShortcuts, QCheckboxShortcuts, QChipShortcuts, QCircularProgressShortcuts, QColorPickerShortcuts, QDateShortcuts, QDialogShortcuts, QEditorShortcuts, QExpansionItemShortcuts, QFabShortcuts, QFieldShortcuts, QFileShortcuts, QFormShortcuts, QImgShortcuts, QInnerLoadingShortcuts, QInputShortcuts, QIntersectionShortcuts, QItemShortcuts, QKnobShortcuts, QLayoutShortcuts, QLinearProgressShortcuts, QMenuShortcuts, QOptionGroupShortcuts, QPageShortcuts, QPageStickyShortcuts, QPaginationShortcuts, QParallaxShortcuts, QPopupEditShortcuts, QPullToRefreshShortcuts, QRadioShortcuts, QRatingShortcuts, QResponsiveShortcuts, QScrollareaShortcuts, QSelectShortcuts, QSeparatorShortcuts, QSkeletonShortcuts, QSlideItemShortcuts, QSliderShortcuts, QSpaceShortcuts, QSpinnerShortcuts, QSplitterShortcuts, QStepperShortcuts, QTabPanelShortcuts, QTableShortcuts, QTabsShortcuts, QTimeShortcuts, QTimelineShortcuts, QToggleShortcuts, QToolbarShortcuts, QTooltipShortcuts, QTreeShortcuts, QUploaderShortcuts, QVideoShortcuts, QVirtualScrollShortcuts, PanelShortcuts, QMorphShortcuts, QRippleShortcuts, QBottomSheetShortcuts, QDialogPluginShortcuts, QLoadingShortcuts, QNotifyShortcuts, DarkShortcuts, FlexShortcuts, HelperShortcuts, MouseShortcuts, OrientationShortcuts, PositionShortcuts, SizeShortcuts, TouchShortcuts, TransitionsShortcuts, TypographyShortcuts, VisibilityShortcuts, QHeaderShortcuts, QFooterShortcuts, QDrawerShortcuts, ElevationShortcuts),
+            outputToCssLayers: true,
             layers: {
-                dismiss: -1,
-                default: 1
+                components: -1,
+                default: 1,
+                utilities: 2
             },
             theme: defaultTheme,
             variants: [
@@ -1793,10 +1798,12 @@ textarea {
                         const pascalMatch = code.matchAll(/Q([A-Z][a-z0-9]+)+/g);
                         const transitionMatch = code.matchAll(/(transition|transition-show|transition-hide|transition-prev|transition-next)="(\S*)"/g);
                         const colorMatch = code.matchAll(/color="(\S*)"/g);
+                        const pascalComponentsMatch = [];
                         const matches = [];
                         for (const match of kebabMatch)
                             matches.push(match[0]);
                         for (const match of pascalMatch) {
+                            pascalComponentsMatch.push(match[0]);
                             matches.push(toKebabCase(match[0]));
                         }
                         const transitionClasses = [];
@@ -1816,9 +1823,16 @@ textarea {
                         }
                         const classes = qClasses.filter((c) => matches.some((component) => {
                             component = component.replaceAll('q-chat-message', 'q-message');
+                            component = component.replaceAll('q-scroll-area', 'q-scrollarea');
                             return c.includes(component);
                         }));
-                        classes.push(...transitionClasses, ...colorClasses);
+                        const componentClasses = pascalComponentsMatch.reduce((acc, component) => {
+                            if (component in componentsSafelistMap) {
+                                acc.push(...componentsSafelistMap[component]);
+                            }
+                            return acc;
+                        }, []);
+                        classes.push(...transitionClasses, ...colorClasses, ...componentClasses);
                         return classes;
                     }
                 }

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

@@ -303,6 +303,14 @@ const defaultTheme = {
         'blue-grey-14': '#455a64'
     },
     quasar: {
+        spaces: {
+            none: 0,
+            xs: 1,
+            sm: 2,
+            md: 4,
+            lg: 6,
+            xl: 12
+        },
         z: {
             fab: 990,
             side: 1000,

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

@@ -1114,6 +1114,14 @@ export interface QuasarTheme {
             'q-notification--bottom-leave-active'?: string;
             'q-notification--bottom-right-leave-active'?: string;
         };
+        spaces: {
+            none: number;
+            xs: number;
+            sm: number;
+            md: number;
+            lg: number;
+            xl: number;
+        };
         z: {
             fab: number;
             side: number;

package/package.json

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

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

@@ -2,33 +2,34 @@ import type { Rule, UserShortcuts } from '@unocss/core'
 import type { QuasarTheme } from '../theme.js'
 
 const shortcuts: UserShortcuts<QuasarTheme> = [
-  [/^q-banner$/, ([, c], { theme }) => `min-h-54px px-16px py-8px bg-white`],
-  [/^q-banner--top-padding$/, ([, c], { theme }) => ``],
-  [/^q-banner--top-padding$/, ([, c], { theme }) => `pt-14px`],
+  [
+    /^q-banner$/,
+    ([, c], { theme }) =>
+      theme.quasar?.components?.['q-banner'] ??
+      `min-h-[54px] px-[16px] py-[8px] bg-[#fff]`
+  ],
+
+  [/^q-banner--top-padding$/, ([, c], { theme }) => `pt-[14px]`],
+
   [
     /^q-banner__avatar$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-banner__avatar'] ??
-      `min-w-1px! [&.q-avatar]:(text-46px) 
-    [&.q-icon]:(text-40px) 
-    [&:not(:empty)+.q-banner\\_\\_content]:(pl-16px)`
+      `!min-w-[1px] [&_>_.q-avatar]:(text-[46px]) [&_>_.q-icon]:(text-[40px]) [&:not(:empty)_+_.q-banner\\_\\_content]:(pl-[16px])`
   ],
+
   [
     /^q-banner__actions$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-banner__actions'] ??
-      `[&.col-auto]:(pl-16px)
-        [&.col-all_.q.btn-item]:(mt-4px mb-0 ml-4px mr-0)`
+      `[&.col-auto]:(pl-[16px]) [&.col-all_.q-btn-item]:(mt-[4px] mr-[0] mb-[0] ml-[4px])`
   ],
 
   [
     /^q-banner--dense$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-banner--dense'] ??
-      `min-h-32px p-8px
-          [&_.q-banner\\_\\_avatar>.q-avatar,.q-banner--dense_.q-banner\\_\\_avatar>.q-icon]:(text-28px)
-      [&_.q-banner\\_\\_avatar:not(:empty)+.q-banner\\_\\_content]:(pl-8px)
-      [&_.q-banner\\_\\_actions.col-auto]:(pl-8px)`
+      `min-h-[32px] p-[8px] [&.q-banner--top-padding]:(pt-[12px]) [&_.q-banner\\_\\_avatar_>_.q-avatar]:(text-[28px]) [&_.q-banner\\_\\_avatar_>_.q-icon]:(text-[28px]) [&_.q-banner\\_\\_avatar:not(:empty)_+_.q-banner\\_\\_content]:(pl-[8px]) [&_.q-banner\\_\\_actions.col-auto]:(pl-[8px])`
   ]
 ]
 

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

@@ -71,14 +71,16 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-btn--fab$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-btn--fab'] ??
-      `[&_.q-icon]:(text-[24px]) p-[16px] min-h-[56px] min-w-[56px] [&_.q-icon]:(m-auto)`
+      `[&_.q-icon]:(text-[24px]) p-[16px] [&_.q-icon]:(m-auto) pb-0`
+    // min-h-[56px] min-w-[56px]
   ],
 
   [
     /^q-btn--fab-mini$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-btn--fab-mini'] ??
-      `[&_.q-icon]:(text-[24px]) p-[8px] min-h-[40px] min-w-[40px]`
+      `[&_.q-icon]:(text-[24px]) p-[8px] pb-0`
+    // min-h-[40px] min-w-[40px]
   ],
 
   [/^q-btn__content$/, ([, c], { theme }) => `[transition:opacity_0.3s] z-0`],

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

@@ -68,7 +68,7 @@ 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%] layer-dismiss:text-[rgba(0,_0,_0,_0.54)]`
+      `text-[40px] w-[1em] min-w-[1em] h-[1em] outline-[0] rounded-[50%] layer-components:text-[rgba(0,_0,_0,_0.54)]`
   ],
 
   [
@@ -91,10 +91,10 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-checkbox--dark$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-checkbox--dark'] ??
-      `[&_.q-checkbox\\_\\_inner]:(layer-dismiss:text-[rgba(255,_255,_255,_0.7)])
+      `[&_.q-checkbox\\_\\_inner]:(layer-components: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\\_\\_inner--truthy]:(layer-components:text-primary)
+       [&_.q-checkbox\\_\\_inner--indet]:(layer-components:text-primary)`
   ],
 
   [

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

@@ -60,8 +60,8 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
   [
     /^q-date__view$/,
     ([, c], { theme }) =>
-      theme.quasar?.components?.['q-date__view'] ??
-      `h-full w-full min-h-[290px] p-[16px]`
+      theme.quasar?.components?.['q-date__view'] ?? `min-h-[290px] p-[16px]`
+    // h-full w-full
   ],
 
   [
@@ -194,7 +194,9 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-date--landscape$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-date--landscape'] ??
-      `flex-row items-stretch min-w-[420px] [&_>_div]:(flex flex-col) [&_.q-date\\_\\_content]:(h-full)`
+      `flex-row items-stretch min-w-[420px]
+      [&_>_div]:(flex flex-auto flex-col)
+      [&_.q-date\\_\\_content]:(h-full)`
   ],
 
   [

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

@@ -7,8 +7,8 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
   [
     /^q-fab$/,
     ([, c], { theme }) =>
-      theme.quasar?.components?.['q-fab'] ??
-      `relative align-middle [&_>_.q-btn]:(w-full)`
+      theme.quasar?.components?.['q-fab'] ?? `relative align-middle`
+    // [&_>_.q-btn]:(w-full)
   ],
 
   [/^q-fab--form-rounded$/, ([, c], { theme }) => `rounded-[28px]`],
@@ -19,14 +19,14 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-fab__icon$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-fab__icon'] ??
-      `[transition:opacity_0.4s,_transform_0.4s] opacity-100 rotate-0`
+      `[transition:opacity_0.4s,_transform_0.4s] opacity-100 rotate-0 relative!`
   ],
 
   [
     /^q-fab__active-icon$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-fab__active-icon'] ??
-      `[transition:opacity_0.4s,_transform_0.4s] opacity-0 -rotate-180`
+      `[transition:opacity_0.4s,_transform_0.4s] opacity-0 -rotate-180 relative! !left--20px !mr--20px`
   ],
 
   [
@@ -107,7 +107,8 @@ const shortcuts: UserShortcuts<QuasarTheme> = [
     /^q-fab__icon-holder$/,
     ([, c], { theme }) =>
       theme.quasar?.components?.['q-fab__icon-holder'] ??
-      `min-w-[24px] min-h-[24px] relative`
+      `[&:before]:(content-empty)`
+    // min-w-[24px] min-h-[24px] relative
   ],
 
   [