Skip to main content

Theme

Theme Object

All Crono components are subject to the Design System chosen to develop the Matchplat interfaces.
In order to make the applications uniform among them, it was necessary to develop components with which it is possible to compose a fluid and functional graphic interface.

In case you cannot use the Crono components or they are not flexible enough for your APP, a theme object has been created.

import { theme } from "@matchplat/crono";

from which you can import at any time many of the values needed to build custom components.

Theme Values

Colors

mainColor mainLight mainLightPlaceholder secondaryColor secondaryLight secondaryLightPlaceholder errorColor doneColor placeholderColor darkColor greyColor

Fonts

article subArticle title titleMax subTitle buttonTextSize note fontFamily

Borders

borderRadius borderMainColor borderGreyColor borderSecondaryColor borderCurrentColor boxShadow navShadow boxShadowTransition boxShadowInput

Margins and Paddings

themePadding themeMenuPadding themeMargin themeMenuMargin themeMenuNegativeMargin inputsPadding themePaddingSingle themeMenuPaddingSingle themeMarginSingle themeMenuMarginSingle minPadding themeMinPaddingSingle

Spacing

standardSpacing halfSpacing doubleSpacing

Backgrounds

progresBackground

Utilities

getColorLight getColorDark