Skip to content

Commit

Permalink
fix(preset-mini,preset-wind): use base property directly (#1060)
Browse files Browse the repository at this point in the history
  • Loading branch information
@chu121su12
chu121su12 committed Jun 3, 2022
1 parent bc306c5 commit c259661
Show file tree
Hide file tree
Showing 16 changed files with 212 additions and 191 deletions.
15 changes: 7 additions & 8 deletions packages/preset-mini/src/rules/transform.ts
View file
Expand Up @@ -44,7 +44,6 @@ export const transformBase = {
'--un-translate-x': 0,
'--un-translate-y': 0,
'--un-translate-z': 0,
'--un-transform': transformCpu,
}

export const transforms: Rule[] = [
Expand Down Expand Up @@ -87,8 +86,8 @@ export const transforms: Rule[] = [
[/^(?:transform-)?preserve-flat$/, () => ({ 'transform-style': 'flat' })],

// base
['transform', { transform: 'var(--un-transform)' }],
['transform-cpu', { transform: 'var(--un-transform)' }],
['transform', { transform: transformCpu }],
['transform-cpu', { transform: transformCpu }],
['transform-gpu', { transform: transformGpu }],
['transform-none', { transform: 'none' }],
]
Expand All @@ -98,7 +97,7 @@ function handleTranslate([, d, b]: string[], { theme }: RuleContext<Theme>): CSS
if (v != null) {
return [
...xyzMap[d].map((i): [string, string] => [`--un-translate${i}`, v]),
['transform', 'var(--un-transform)'],
['transform', transformCpu],
]
}
}
Expand All @@ -108,7 +107,7 @@ function handleScale([, d, b]: string[]): CSSValues | undefined {
if (v != null) {
return [
...xyzMap[d].map((i): [string, string] => [`--un-scale${i}`, v]),
['transform', 'var(--un-transform)'],
['transform', transformCpu],
]
}
}
Expand All @@ -120,7 +119,7 @@ function handleRotate([, d = '', b]: string[]): CSSValues | undefined {
return {
'--un-rotate': 0,
[`--un-rotate-${d}`]: v,
'transform': 'var(--un-transform)',
'transform': transformCpu,
}
}
else {
Expand All @@ -129,7 +128,7 @@ function handleRotate([, d = '', b]: string[]): CSSValues | undefined {
'--un-rotate-y': 0,
'--un-rotate-z': 0,
'--un-rotate': v,
'transform': 'var(--un-transform)',
'transform': transformCpu,
}
}
}
Expand All @@ -140,7 +139,7 @@ function handleSkew([, d, b]: string[]): CSSValues | undefined {
if (v != null) {
return {
[`--un-skew-${d}`]: v,
transform: 'var(--un-transform)',
transform: transformCpu,
}
}
}
20 changes: 10 additions & 10 deletions packages/preset-wind/src/rules/filters.ts
View file
Expand Up @@ -13,8 +13,8 @@ export const filterBase = {
'--un-invert': varEmpty,
'--un-saturate': varEmpty,
'--un-sepia': varEmpty,
'--un-filter': 'var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia)',
}
const filterProperty = 'var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia)'

export const backdropFilterBase = {
'--un-backdrop-blur': varEmpty,
Expand All @@ -26,8 +26,8 @@ export const backdropFilterBase = {
'--un-backdrop-opacity': varEmpty,
'--un-backdrop-saturate': varEmpty,
'--un-backdrop-sepia': varEmpty,
'--un-backdrop-filter': 'var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia)',
}
const backdropFilterProperty = 'var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia)'

const percentWithDefault = (str?: string) => {
let v = h.bracket.cssvar(str || '')
Expand All @@ -46,14 +46,14 @@ const toFilter = (varName: string, resolver: (str: string, theme: Theme) => stri
if (b) {
return {
[`--un-${b}${varName}`]: `${varName}(${value})`,
'-webkit-backdrop-filter': 'var(--un-backdrop-filter)',
'backdrop-filter': 'var(--un-backdrop-filter)',
'-webkit-backdrop-filter': backdropFilterProperty,
'backdrop-filter': backdropFilterProperty,
}
}
else {
return {
[`--un-${varName}`]: `${varName}(${value})`,
filter: 'var(--un-filter)',
filter: filterProperty,
}
}
}
Expand All @@ -65,15 +65,15 @@ const dropShadowResolver = ([, s]: string[], { theme }: RuleContext<Theme>) => {
const shadows = colorableShadows(v, '--un-drop-shadow-color')
return {
'--un-drop-shadow': `drop-shadow(${shadows.join(') drop-shadow(')})`,
'filter': 'var(--un-filter)',
'filter': filterProperty,
}
}

v = h.bracket.cssvar(s)
if (v != null) {
return {
'--un-drop-shadow': `drop-shadow(${v})`,
'filter': 'var(--un-filter)',
'filter': filterProperty,
}
}
}
Expand Down Expand Up @@ -104,10 +104,10 @@ export const filters: Rule<Theme>[] = [
[/^(?:(backdrop-)|filter-)?sepia(?:-(.+))?$/, toFilter('sepia', percentWithDefault), { autocomplete: ['(backdrop|filter)-sepia', '(backdrop|filter)-sepia-<percent>', 'sepia-<percent>'] }],

// base
['filter', { filter: 'var(--un-filter)' }],
['filter', { filter: filterProperty }],
['backdrop-filter', {
'-webkit-backdrop-filter': 'var(--un-backdrop-filter)',
'backdrop-filter': 'var(--un-backdrop-filter)',
'-webkit-backdrop-filter': backdropFilterProperty,
'backdrop-filter': backdropFilterProperty,
}],

// nones
Expand Down
5 changes: 3 additions & 2 deletions packages/preset-wind/src/rules/table.ts
View file
Expand Up @@ -6,6 +6,7 @@ export const borderSpacingBase = {
'--un-border-spacing-x': 0,
'--un-border-spacing-y': 0,
}
const borderSpacingProperty = 'var(--un-border-spacing-x) var(--un-border-spacing-y)'

export const tables: Rule<Theme>[] = [
// displays
Expand All @@ -30,7 +31,7 @@ export const tables: Rule<Theme>[] = [
return {
'--un-border-spacing-x': v,
'--un-border-spacing-y': v,
'border-spacing': 'var(--un-border-spacing-x) var(--un-border-spacing-y)',
'border-spacing': borderSpacingProperty,
}
}
}, { autocomplete: ['border-spacing', 'border-spacing-$spacing'] }],
Expand All @@ -40,7 +41,7 @@ export const tables: Rule<Theme>[] = [
if (v != null) {
return {
[`--un-border-spacing-${d}`]: v,
'border-spacing': 'var(--un-border-spacing-x) var(--un-border-spacing-y)',
'border-spacing': borderSpacingProperty,
}
}
}, { autocomplete: ['border-spacing-(x|y)', 'border-spacing-(x|y)-$spacing'] }],
Expand Down
8 changes: 4 additions & 4 deletions packages/preset-wind/src/rules/touch-actions.ts
View file
Expand Up @@ -5,21 +5,21 @@ export const touchActionBase = {
'--un-pan-x': varEmpty,
'--un-pan-y': varEmpty,
'--un-pinch-zoom': varEmpty,
'--un-touch-action': 'var(--un-pan-x) var(--un-pan-y) var(--un-pinch-zoom)',
}
const touchActionProperty = 'var(--un-pan-x) var(--un-pan-y) var(--un-pinch-zoom)'

export const touchActions: Rule[] = [
[/^touch-pan-(x|left|right)$/, ([, d]) => ({
'--un-pan-x': `pan-${d}`,
'touch-action': 'var(--un-touch-action)',
'touch-action': touchActionProperty,
}), { autocomplete: ['touch-pan', 'touch-pan-(x|left|right|y|up|down)'] }],
[/^touch-pan-(y|up|down)$/, ([, d]) => ({
'--un-pan-y': `pan-${d}`,
'touch-action': 'var(--un-touch-action)',
'touch-action': touchActionProperty,
})],
['touch-pinch-zoom', {
'--un-pinch-zoom': 'pinch-zoom',
'touch-action': 'var(--un-touch-action)',
'touch-action': touchActionProperty,
}],

['touch-auto', { 'touch-action': 'auto' }],
Expand Down
4 changes: 1 addition & 3 deletions packages/preset-wind/src/rules/typography.ts
View file
Expand Up @@ -7,12 +7,10 @@ export const fontVariantNumericBase = {
'--un-numeric-figure': varEmpty,
'--un-numeric-spacing': varEmpty,
'--un-numeric-fraction': varEmpty,
'--un-font-variant-numeric': 'var(--un-ordinal) var(--un-slashed-zero) var(--un-numeric-figure) var(--un-numeric-spacing) var(--un-numeric-fraction)',
}

const toEntries = (entry: any) => ({
...entry,
'font-variant-numeric': 'var(--un-font-variant-numeric)',
'font-variant-numeric': 'var(--un-ordinal) var(--un-slashed-zero) var(--un-numeric-figure) var(--un-numeric-spacing) var(--un-numeric-fraction)',
})

export const fontVariantNumeric: Rule[] = [
Expand Down
4 changes: 2 additions & 2 deletions test/__snapshots__/cli.test.ts.snap
View file
Expand Up @@ -2,15 +2,15 @@

exports[`cli > builds uno.css 1`] = `
"/* layer: preflights */
*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));--un-pan-x:var(--un-empty,/*!*/ /*!*/);--un-pan-y:var(--un-empty,/*!*/ /*!*/);--un-pinch-zoom:var(--un-empty,/*!*/ /*!*/);--un-touch-action:var(--un-pan-x) var(--un-pan-y) var(--un-pinch-zoom);--un-scroll-snap-strictness:proximity;--un-ordinal:var(--un-empty,/*!*/ /*!*/);--un-slashed-zero:var(--un-empty,/*!*/ /*!*/);--un-numeric-figure:var(--un-empty,/*!*/ /*!*/);--un-numeric-spacing:var(--un-empty,/*!*/ /*!*/);--un-numeric-fraction:var(--un-empty,/*!*/ /*!*/);--un-font-variant-numeric:var(--un-ordinal) var(--un-slashed-zero) var(--un-numeric-figure) var(--un-numeric-spacing) var(--un-numeric-fraction);--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 #0000;--un-ring-shadow:0 0 #0000;--un-shadow-inset:var(--un-empty,/*!*/ /*!*/);--un-shadow:0 0 #0000;--un-ring-inset:var(--un-empty,/*!*/ /*!*/);--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,0.5);--un-blur:var(--un-empty,/*!*/ /*!*/);--un-brightness:var(--un-empty,/*!*/ /*!*/);--un-contrast:var(--un-empty,/*!*/ /*!*/);--un-drop-shadow:var(--un-empty,/*!*/ /*!*/);--un-grayscale:var(--un-empty,/*!*/ /*!*/);--un-hue-rotate:var(--un-empty,/*!*/ /*!*/);--un-invert:var(--un-empty,/*!*/ /*!*/);--un-saturate:var(--un-empty,/*!*/ /*!*/);--un-sepia:var(--un-empty,/*!*/ /*!*/);--un-filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia);--un-backdrop-blur:var(--un-empty,/*!*/ /*!*/);--un-backdrop-brightness:var(--un-empty,/*!*/ /*!*/);--un-backdrop-contrast:var(--un-empty,/*!*/ /*!*/);--un-backdrop-grayscale:var(--un-empty,/*!*/ /*!*/);--un-backdrop-hue-rotate:var(--un-empty,/*!*/ /*!*/);--un-backdrop-invert:var(--un-empty,/*!*/ /*!*/);--un-backdrop-opacity:var(--un-empty,/*!*/ /*!*/);--un-backdrop-saturate:var(--un-empty,/*!*/ /*!*/);--un-backdrop-sepia:var(--un-empty,/*!*/ /*!*/);--un-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);}
*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x:var(--un-empty,/*!*/ /*!*/);--un-pan-y:var(--un-empty,/*!*/ /*!*/);--un-pinch-zoom:var(--un-empty,/*!*/ /*!*/);--un-scroll-snap-strictness:proximity;--un-ordinal:var(--un-empty,/*!*/ /*!*/);--un-slashed-zero:var(--un-empty,/*!*/ /*!*/);--un-numeric-figure:var(--un-empty,/*!*/ /*!*/);--un-numeric-spacing:var(--un-empty,/*!*/ /*!*/);--un-numeric-fraction:var(--un-empty,/*!*/ /*!*/);--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 #0000;--un-ring-shadow:0 0 #0000;--un-shadow-inset:var(--un-empty,/*!*/ /*!*/);--un-shadow:0 0 #0000;--un-ring-inset:var(--un-empty,/*!*/ /*!*/);--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,0.5);--un-blur:var(--un-empty,/*!*/ /*!*/);--un-brightness:var(--un-empty,/*!*/ /*!*/);--un-contrast:var(--un-empty,/*!*/ /*!*/);--un-drop-shadow:var(--un-empty,/*!*/ /*!*/);--un-grayscale:var(--un-empty,/*!*/ /*!*/);--un-hue-rotate:var(--un-empty,/*!*/ /*!*/);--un-invert:var(--un-empty,/*!*/ /*!*/);--un-saturate:var(--un-empty,/*!*/ /*!*/);--un-sepia:var(--un-empty,/*!*/ /*!*/);--un-backdrop-blur:var(--un-empty,/*!*/ /*!*/);--un-backdrop-brightness:var(--un-empty,/*!*/ /*!*/);--un-backdrop-contrast:var(--un-empty,/*!*/ /*!*/);--un-backdrop-grayscale:var(--un-empty,/*!*/ /*!*/);--un-backdrop-hue-rotate:var(--un-empty,/*!*/ /*!*/);--un-backdrop-invert:var(--un-empty,/*!*/ /*!*/);--un-backdrop-opacity:var(--un-empty,/*!*/ /*!*/);--un-backdrop-saturate:var(--un-empty,/*!*/ /*!*/);--un-backdrop-sepia:var(--un-empty,/*!*/ /*!*/);}
/* layer: default */
.max-w-screen-md{max-width:768px;}
.p-4{padding:1rem;}"
`;

exports[`cli > supports unocss.config.js 1`] = `
"/* layer: preflights */
*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));--un-pan-x:var(--un-empty,/*!*/ /*!*/);--un-pan-y:var(--un-empty,/*!*/ /*!*/);--un-pinch-zoom:var(--un-empty,/*!*/ /*!*/);--un-touch-action:var(--un-pan-x) var(--un-pan-y) var(--un-pinch-zoom);--un-scroll-snap-strictness:proximity;--un-ordinal:var(--un-empty,/*!*/ /*!*/);--un-slashed-zero:var(--un-empty,/*!*/ /*!*/);--un-numeric-figure:var(--un-empty,/*!*/ /*!*/);--un-numeric-spacing:var(--un-empty,/*!*/ /*!*/);--un-numeric-fraction:var(--un-empty,/*!*/ /*!*/);--un-font-variant-numeric:var(--un-ordinal) var(--un-slashed-zero) var(--un-numeric-figure) var(--un-numeric-spacing) var(--un-numeric-fraction);--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 #0000;--un-ring-shadow:0 0 #0000;--un-shadow-inset:var(--un-empty,/*!*/ /*!*/);--un-shadow:0 0 #0000;--un-ring-inset:var(--un-empty,/*!*/ /*!*/);--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,0.5);--un-blur:var(--un-empty,/*!*/ /*!*/);--un-brightness:var(--un-empty,/*!*/ /*!*/);--un-contrast:var(--un-empty,/*!*/ /*!*/);--un-drop-shadow:var(--un-empty,/*!*/ /*!*/);--un-grayscale:var(--un-empty,/*!*/ /*!*/);--un-hue-rotate:var(--un-empty,/*!*/ /*!*/);--un-invert:var(--un-empty,/*!*/ /*!*/);--un-saturate:var(--un-empty,/*!*/ /*!*/);--un-sepia:var(--un-empty,/*!*/ /*!*/);--un-filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia);--un-backdrop-blur:var(--un-empty,/*!*/ /*!*/);--un-backdrop-brightness:var(--un-empty,/*!*/ /*!*/);--un-backdrop-contrast:var(--un-empty,/*!*/ /*!*/);--un-backdrop-grayscale:var(--un-empty,/*!*/ /*!*/);--un-backdrop-hue-rotate:var(--un-empty,/*!*/ /*!*/);--un-backdrop-invert:var(--un-empty,/*!*/ /*!*/);--un-backdrop-opacity:var(--un-empty,/*!*/ /*!*/);--un-backdrop-saturate:var(--un-empty,/*!*/ /*!*/);--un-backdrop-sepia:var(--un-empty,/*!*/ /*!*/);--un-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);}
*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x:var(--un-empty,/*!*/ /*!*/);--un-pan-y:var(--un-empty,/*!*/ /*!*/);--un-pinch-zoom:var(--un-empty,/*!*/ /*!*/);--un-scroll-snap-strictness:proximity;--un-ordinal:var(--un-empty,/*!*/ /*!*/);--un-slashed-zero:var(--un-empty,/*!*/ /*!*/);--un-numeric-figure:var(--un-empty,/*!*/ /*!*/);--un-numeric-spacing:var(--un-empty,/*!*/ /*!*/);--un-numeric-fraction:var(--un-empty,/*!*/ /*!*/);--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 #0000;--un-ring-shadow:0 0 #0000;--un-shadow-inset:var(--un-empty,/*!*/ /*!*/);--un-shadow:0 0 #0000;--un-ring-inset:var(--un-empty,/*!*/ /*!*/);--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,0.5);--un-blur:var(--un-empty,/*!*/ /*!*/);--un-brightness:var(--un-empty,/*!*/ /*!*/);--un-contrast:var(--un-empty,/*!*/ /*!*/);--un-drop-shadow:var(--un-empty,/*!*/ /*!*/);--un-grayscale:var(--un-empty,/*!*/ /*!*/);--un-hue-rotate:var(--un-empty,/*!*/ /*!*/);--un-invert:var(--un-empty,/*!*/ /*!*/);--un-saturate:var(--un-empty,/*!*/ /*!*/);--un-sepia:var(--un-empty,/*!*/ /*!*/);--un-backdrop-blur:var(--un-empty,/*!*/ /*!*/);--un-backdrop-brightness:var(--un-empty,/*!*/ /*!*/);--un-backdrop-contrast:var(--un-empty,/*!*/ /*!*/);--un-backdrop-grayscale:var(--un-empty,/*!*/ /*!*/);--un-backdrop-hue-rotate:var(--un-empty,/*!*/ /*!*/);--un-backdrop-invert:var(--un-empty,/*!*/ /*!*/);--un-backdrop-opacity:var(--un-empty,/*!*/ /*!*/);--un-backdrop-saturate:var(--un-empty,/*!*/ /*!*/);--un-backdrop-sepia:var(--un-empty,/*!*/ /*!*/);}
/* layer: shortcuts */
.box{margin-left:auto;margin-right:auto;max-width:80rem;border-radius:0.375rem;--un-bg-opacity:1;background-color:rgba(243,244,246,var(--un-bg-opacity));padding:1rem;--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgba(0,0,0,0.05));box-shadow:var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow);}"
`;
2 changes: 1 addition & 1 deletion test/__snapshots__/postprocess.test.ts.snap
View file
Expand Up @@ -2,6 +2,6 @@

exports[`postprocess 1`] = `
"/* layer: default */
.scale-100{--hello-scale-x:1;--hello-scale-y:1;transform:var(--hello-transform);}
.scale-100{--hello-scale-x:1;--hello-scale-y:1;transform:translateX(var(--hello-translate-x)) translateY(var(--hello-translate-y)) translateZ(var(--hello-translate-z)) rotate(var(--hello-rotate)) rotateX(var(--hello-rotate-x)) rotateY(var(--hello-rotate-y)) rotateZ(var(--hello-rotate-z)) skewX(var(--hello-skew-x)) skewY(var(--hello-skew-y)) scaleX(var(--hello-scale-x)) scaleY(var(--hello-scale-y)) scaleZ(var(--hello-scale-z));}
.text-opacity-50{--hi-text-opacity:0.5;}"
`;

0 comments on commit c259661

Please sign in to comment.