Directus / @directus/themes / index / rulesToCssVars
Function: rulesToCssVars() ​
rulesToCssVars(
rules
):Record
<string
,string
|number
>
Parameters ​
• rules
• rules.background?: string
= undefined
• rules.backgroundAccent?: string
= undefined
• rules.backgroundNormal?: string
= undefined
• rules.backgroundSubdued?: string
= undefined
• rules.banner?= undefined
• rules.banner.art?= undefined
• rules.banner.art.foreground?: string
= undefined
• rules.banner.avatar?= undefined
• rules.banner.avatar.background?: string
= undefined
• rules.banner.avatar.borderRadius?: string
= undefined
• rules.banner.avatar.foreground?: string
= undefined
• rules.banner.background?: string
= undefined
• rules.banner.borderRadius?: string
= undefined
• rules.banner.headline?= undefined
• rules.banner.headline.fontFamily?: string
= undefined
• rules.banner.headline.fontWeight?: string
= undefined
• rules.banner.headline.foreground?: string
= undefined
• rules.banner.padding?: string
= undefined
• rules.banner.subtitle?= undefined
• rules.banner.subtitle.fontFamily?: string
= undefined
• rules.banner.subtitle.fontWeight?: string
= undefined
• rules.banner.subtitle.foreground?: string
= undefined
• rules.banner.title?= undefined
• rules.banner.title.fontFamily?: string
= undefined
• rules.banner.title.fontWeight?: string
= undefined
• rules.banner.title.foreground?: string
= undefined
• rules.borderColor?: string
= undefined
• rules.borderColorAccent?: string
= undefined
• rules.borderColorSubdued?: string
= undefined
• rules.borderRadius?: string
= undefined
• rules.borderWidth?: string
= undefined
• rules.danger?: string
= undefined
• rules.dangerAccent?: string
= undefined
• rules.dangerBackground?: string
= undefined
• rules.dangerSubdued?: string
= undefined
• rules.fonts?= undefined
• rules.fonts.display?= undefined
• rules.fonts.display.fontFamily?: string
= undefined
• rules.fonts.display.fontWeight?: string
= undefined
• rules.fonts.monospace?= undefined
• rules.fonts.monospace.fontFamily?: string
= undefined
• rules.fonts.monospace.fontWeight?: string
= undefined
• rules.fonts.sans?= undefined
• rules.fonts.sans.fontFamily?: string
= undefined
• rules.fonts.sans.fontWeight?: string
= undefined
• rules.fonts.serif?= undefined
• rules.fonts.serif.fontFamily?: string
= undefined
• rules.fonts.serif.fontWeight?: string
= undefined
• rules.foreground?: string
= undefined
• rules.foregroundAccent?: string
= undefined
• rules.foregroundSubdued?: string
= undefined
• rules.form?= FormRules
• rules.form.columnGap?: string
= undefined
• rules.form.field?= undefined
• rules.form.field.input?= undefined
• rules.form.field.input.background?: string
= undefined
• rules.form.field.input.backgroundSubdued?: string
= undefined
• rules.form.field.input.borderColor?: string
= undefined
• rules.form.field.input.borderColorFocus?: string
= undefined
• rules.form.field.input.borderColorHover?: string
= undefined
• rules.form.field.input.boxShadow?: string
= undefined
• rules.form.field.input.boxShadowFocus?: string
= undefined
• rules.form.field.input.boxShadowHover?: string
= undefined
• rules.form.field.input.foreground?: string
= undefined
• rules.form.field.input.foregroundSubdued?: string
= undefined
• rules.form.field.input.height?: string
= undefined
• rules.form.field.input.padding?: string
= undefined
• rules.form.field.label?= undefined
• rules.form.field.label.fontFamily?: string
= undefined
• rules.form.field.label.fontWeight?: string
= undefined
• rules.form.field.label.foreground?: string
= undefined
• rules.form.rowGap?: string
= undefined
• rules.header?= undefined
• rules.header.background?: string
= undefined
• rules.header.borderColor?: string
= undefined
• rules.header.borderWidth?: string
= undefined
• rules.header.boxShadow?: string
= undefined
• rules.header.headline?= undefined
• rules.header.headline.fontFamily?: string
= undefined
• rules.header.headline.foreground?: string
= undefined
• rules.header.title?= undefined
• rules.header.title.fontFamily?: string
= undefined
• rules.header.title.fontWeight?: string
= undefined
• rules.header.title.foreground?: string
= undefined
• rules.navigation?= undefined
• rules.navigation.background?: string
= undefined
• rules.navigation.backgroundAccent?: string
= undefined
• rules.navigation.borderColor?: string
= undefined
• rules.navigation.borderWidth?: string
= undefined
• rules.navigation.list?= undefined
• rules.navigation.list.background?: string
= undefined
• rules.navigation.list.backgroundActive?: string
= undefined
• rules.navigation.list.backgroundHover?: string
= undefined
• rules.navigation.list.divider?= undefined
• rules.navigation.list.divider.borderColor?: string
= undefined
• rules.navigation.list.divider.borderWidth?: string
= undefined
• rules.navigation.list.fontFamily?: string
= undefined
• rules.navigation.list.foreground?: string
= undefined
• rules.navigation.list.foregroundActive?: string
= undefined
• rules.navigation.list.foregroundHover?: string
= undefined
• rules.navigation.list.icon?= undefined
• rules.navigation.list.icon.foreground?: string
= undefined
• rules.navigation.list.icon.foregroundActive?: string
= undefined
• rules.navigation.list.icon.foregroundHover?: string
= undefined
• rules.navigation.modules?= undefined
• rules.navigation.modules.background?: string
= undefined
• rules.navigation.modules.borderColor?: string
= undefined
• rules.navigation.modules.borderWidth?: string
= undefined
• rules.navigation.modules.button?= undefined
• rules.navigation.modules.button.background?: string
= undefined
• rules.navigation.modules.button.backgroundActive?: string
= undefined
• rules.navigation.modules.button.backgroundHover?: string
= undefined
• rules.navigation.modules.button.foreground?: string
= undefined
• rules.navigation.modules.button.foregroundActive?: string
= undefined
• rules.navigation.modules.button.foregroundHover?: string
= undefined
• rules.navigation.project?= undefined
• rules.navigation.project.background?: string
= undefined
• rules.navigation.project.borderColor?: string
= undefined
• rules.navigation.project.borderWidth?: string
= undefined
• rules.navigation.project.fontFamily?: string
= undefined
• rules.navigation.project.foreground?: string
= undefined
• rules.popover?= undefined
• rules.popover.menu?= undefined
• rules.popover.menu.background?: string
= undefined
• rules.popover.menu.borderRadius?: string
= undefined
• rules.popover.menu.boxShadow?: string
= undefined
• rules.primary?: string
= undefined
• rules.primaryAccent?: string
= undefined
• rules.primaryBackground?: string
= undefined
• rules.primarySubdued?: string
= undefined
• rules.public?= undefined
• rules.public.art?= undefined
• rules.public.art.background?: string
= undefined
• rules.public.art.primary?: string
= undefined
• rules.public.art.secondary?: string
= undefined
• rules.public.art.speed?: string
= undefined
• rules.public.background?: string
= undefined
• rules.public.foreground?: string
= undefined
• rules.public.foregroundAccent?: string
= undefined
• rules.public.form?= FormRules
• rules.public.form.columnGap?: string
= undefined
• rules.public.form.field?= undefined
• rules.public.form.field.input?= undefined
• rules.public.form.field.input.background?: string
= undefined
• rules.public.form.field.input.backgroundSubdued?: string
= undefined
• rules.public.form.field.input.borderColor?: string
= undefined
• rules.public.form.field.input.borderColorFocus?: string
= undefined
• rules.public.form.field.input.borderColorHover?: string
= undefined
• rules.public.form.field.input.boxShadow?: string
= undefined
• rules.public.form.field.input.boxShadowFocus?: string
= undefined
• rules.public.form.field.input.boxShadowHover?: string
= undefined
• rules.public.form.field.input.foreground?: string
= undefined
• rules.public.form.field.input.foregroundSubdued?: string
= undefined
• rules.public.form.field.input.height?: string
= undefined
• rules.public.form.field.input.padding?: string
= undefined
• rules.public.form.field.label?= undefined
• rules.public.form.field.label.fontFamily?: string
= undefined
• rules.public.form.field.label.fontWeight?: string
= undefined
• rules.public.form.field.label.foreground?: string
= undefined
• rules.public.form.rowGap?: string
= undefined
• rules.secondary?: string
= undefined
• rules.secondaryAccent?: string
= undefined
• rules.secondaryBackground?: string
= undefined
• rules.secondarySubdued?: string
= undefined
• rules.sidebar?= undefined
• rules.sidebar.background?: string
= undefined
• rules.sidebar.borderColor?: string
= undefined
• rules.sidebar.borderWidth?: string
= undefined
• rules.sidebar.fontFamily?: string
= undefined
• rules.sidebar.foreground?: string
= undefined
• rules.sidebar.section?= undefined
• rules.sidebar.section.form?= FormRules
• rules.sidebar.section.form.columnGap?: string
= undefined
• rules.sidebar.section.form.field?= undefined
• rules.sidebar.section.form.field.input?= undefined
• rules.sidebar.section.form.field.input.background?: ...= undefined
• rules.sidebar.section.form.field.input.backgroundSubdued?: ...= undefined
• rules.sidebar.section.form.field.input.borderColor?: ...= undefined
• rules.sidebar.section.form.field.input.borderColorFocus?: ...= undefined
• rules.sidebar.section.form.field.input.borderColorHover?: ...= undefined
• rules.sidebar.section.form.field.input.boxShadow?: ...= undefined
• rules.sidebar.section.form.field.input.boxShadowFocus?: ...= undefined
• rules.sidebar.section.form.field.input.boxShadowHover?: ...= undefined
• rules.sidebar.section.form.field.input.foreground?: ...= undefined
• rules.sidebar.section.form.field.input.foregroundSubdued?: ...= undefined
• rules.sidebar.section.form.field.input.height?: ...= undefined
• rules.sidebar.section.form.field.input.padding?: ...= undefined
• rules.sidebar.section.form.field.label?= undefined
• rules.sidebar.section.form.field.label.fontFamily?: ...= undefined
• rules.sidebar.section.form.field.label.fontWeight?: ...= undefined
• rules.sidebar.section.form.field.label.foreground?: ...= undefined
• rules.sidebar.section.form.rowGap?: string
= undefined
• rules.sidebar.section.toggle?= undefined
• rules.sidebar.section.toggle.background?: string
= undefined
• rules.sidebar.section.toggle.backgroundActive?: string
= undefined
• rules.sidebar.section.toggle.backgroundHover?: string
= undefined
• rules.sidebar.section.toggle.borderColor?: string
= undefined
• rules.sidebar.section.toggle.borderWidth?: string
= undefined
• rules.sidebar.section.toggle.fontFamily?: string
= undefined
• rules.sidebar.section.toggle.foreground?: string
= undefined
• rules.sidebar.section.toggle.foregroundActive?: string
= undefined
• rules.sidebar.section.toggle.foregroundHover?: string
= undefined
• rules.sidebar.section.toggle.icon?= undefined
• rules.sidebar.section.toggle.icon.foreground?: string
= undefined
• rules.sidebar.section.toggle.icon.foregroundActive?: string
= undefined
• rules.sidebar.section.toggle.icon.foregroundHover?: string
= undefined
• rules.success?: string
= undefined
• rules.successAccent?: string
= undefined
• rules.successBackground?: string
= undefined
• rules.successSubdued?: string
= undefined
• rules.warning?: string
= undefined
• rules.warningAccent?: string
= undefined
• rules.warningBackground?: string
= undefined
• rules.warningSubdued?: string
= undefined
Returns ​
Record
<string
, string
| number
>