diff --git a/example/global.css b/example/global.css index b692a31..0ceee97 100644 --- a/example/global.css +++ b/example/global.css @@ -1,3 +1,20 @@ @import "tailwindcss/theme.css" layer(theme); @import "tailwindcss/preflight.css" layer(base); -@import "tailwindcss/utilities.css"; \ No newline at end of file +@import "tailwindcss/utilities.css"; + +@theme { + --text-xs--line-height: calc(1em / 0.75); + --text-sm--line-height: calc(1.25em / 0.875); + --text-base--line-height: calc(1.5em / 1); + --text-lg--line-height: calc(1.75em / 1.125); + --text-xl--line-height: calc(1.75em / 1.25); + --text-2xl--line-height: calc(2em / 1.5); + --text-3xl--line-height: calc(2.25em / 1.875); + --text-4xl--line-height: calc(2.5em / 2.25); + + --leading-tight: 1.25em; + --leading-snug: 1.375em; + --leading-normal: 1.5em; + --leading-relaxed: 1.625em; + --leading-loose: 2em; +} \ No newline at end of file diff --git a/example/src/App.tsx b/example/src/App.tsx index e8de0c3..8695ee0 100644 --- a/example/src/App.tsx +++ b/example/src/App.tsx @@ -6,9 +6,7 @@ export default function App() { return ( <> - - Test Component - + Test Component ); diff --git a/src/compiler/declarations.ts b/src/compiler/declarations.ts index 6d2060b..326b284 100644 --- a/src/compiler/declarations.ts +++ b/src/compiler/declarations.ts @@ -57,7 +57,7 @@ const propertyRename: Record = { "background-image": "experimental_backgroundImage", }; -const needsRuntimeParsing = new Set([ +const unparsedRuntimeParsing = new Set([ "animation", "text-shadow", "transform", @@ -811,7 +811,7 @@ export function parseDeclarationUnparsed( /** * Unparsed shorthand properties need to be parsed at runtime */ - if (needsRuntimeParsing.has(property)) { + if (unparsedRuntimeParsing.has(property)) { const args = parseUnparsed(declaration.value.value, builder); if (property === "animation") { @@ -829,10 +829,13 @@ export function parseDeclarationUnparsed( ]); } } else { - builder.addDescriptor( - property, - parseUnparsed(declaration.value.value, builder), - ); + const value = parseUnparsed(declaration.value.value, builder); + + builder.addDescriptor(property, value); + + if (property === "font-size") { + builder.addDescriptor("--__rn-css-em", value); + } } }