Penpot/penpot-export
0
Fork 0
mirror of https://github.com/penpot/penpot-export.git synced 2025-02-01 03:38:51 -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') return [`${cssClassDefinition.selector} {`, ...cssValidProps, '}'].join('\n')
} }
const serializeCssCustomProperties = ( const serializeCssCustomProperty = (
cssCustomProperties: CSSCustomPropertyDefinition[], cssCustomProperty: CSSCustomPropertyDefinition,
pad: number,
): string => { ): string => {
const selector = ':root' const { name, value } = cssCustomProperty
const cssDeclarations = cssCustomProperties.map( const padding = ' '.repeat(pad)
({ name, value }) => ` ${textToCssCustomProperyName(name)}: ${value};`,
)
return [`${selector} {`, ...cssDeclarations, '}'].join('\n') return `${padding}${textToCssCustomProperyName(name)}: ${value};`
} }
const serializeCss = ( const serializeCss = (
cssDefinitions: CSSClassDefinition[] | CSSCustomPropertyDefinition[], cssDefinitions: CSSClassDefinition[] | CSSCustomPropertyDefinition[],
): string => { ): string => {
if (areCssCustomPropertiesDefinitions(cssDefinitions)) { if (areCssCustomPropertiesDefinitions(cssDefinitions)) {
return serializeCssCustomProperties(cssDefinitions) const pad = 2
const cssDeclarations = cssDefinitions.map((customPropertyDefinition) =>
serializeCssCustomProperty(customPropertyDefinition, pad),
)
return [`:root {`, ...cssDeclarations, '}'].join('\n')
} else { } else {
return cssDefinitions.map(serializeCssClass).join('\n\n') return cssDefinitions.map(serializeCssClass).join('\n\n')
} }