Penpot/penpot-export
0
Fork 0
mirror of https://github.com/penpot/penpot-export.git synced 2025-01-19 21:22:28 -05:00
Code Issues Activity

refactor(core): serialize each CSS variable at a time

Browse source
This commit is contained in:
Roberto Redradix 2023-09-07 10:50:17 +02:00
parent 70c3d9a665
commit b76d4d57ef
1 changed files with 11 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
packages/core/src/lib/outputters/css.ts
View file

@ -24,22 +24,25 @@ const serializeCssClass = (cssClassDefinition: CSSClassDefinition): string => {
return [`${cssClassDefinition.selector} {`, ...cssValidProps, '}'].join('\n')
}
const serializeCssCustomProperties = (
cssCustomProperties: CSSCustomPropertyDefinition[],
const serializeCssCustomProperty = (
cssCustomProperty: CSSCustomPropertyDefinition,
pad: number,
): string => {
const selector = ':root'
const cssDeclarations = cssCustomProperties.map(
({ name, value }) => ` ${textToCssCustomProperyName(name)}: ${value};`,
)
const { name, value } = cssCustomProperty
const padding = ' '.repeat(pad)
return [`${selector} {`, ...cssDeclarations, '}'].join('\n')
return `${padding}${textToCssCustomProperyName(name)}: ${value};`
}
const serializeCss = (
cssDefinitions: CSSClassDefinition[] | CSSCustomPropertyDefinition[],
): string => {
if (areCssCustomPropertiesDefinitions(cssDefinitions)) {
return serializeCssCustomProperties(cssDefinitions)
const pad = 2
const cssDeclarations = cssDefinitions.map((customPropertyDefinition) =>
serializeCssCustomProperty(customPropertyDefinition, pad),
)
return [`:root {`, ...cssDeclarations, '}'].join('\n')
} else {
return cssDefinitions.map(serializeCssClass).join('\n\n')
}