@itamar.wmde/wikit-css/build/tokens/index.js

Prototype for a Design System and UI toolkit for WMDE Wikibase

/**
 * Do not edit directly
 * Generated on Fri, 17 Apr 2020 15:53:40 GMT
 */

export const ButtonPrimarySizeMediumHeight = "32px";
export const ButtonPrimarySizeMediumTextPaddingX = "12px";
export const ButtonPrimarySizeMediumTextPaddingY = "5px";
export const ButtonPrimarySizeLargeHeight = "40px";
export const ButtonPrimarySizeLargeTextPaddingX = "16px";
export const ButtonPrimarySizeLargeTextPaddingY = "9px";
export const ButtonPrimaryTextFontFamily = "-apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Lato', 'Helvetica', 'Arial', sans-serif;";
export const ButtonPrimaryTextColorDefault = "#ffffff";
export const ButtonPrimaryTextColorDisabled = "#ffffff";
export const ButtonPrimaryTextFontWeight = "600";
export const ButtonPrimaryTextFontSize = "16px";
export const ButtonPrimaryTextLineHeight = "1.25";
export const ButtonPrimaryBackgroundColorDefault = "#3366cc";
export const ButtonPrimaryBackgroundColorHover = "#447ff5";
export const ButtonPrimaryBackgroundColorActive = "#2a4b8d";
export const ButtonPrimaryBackgroundColorFocus = "#3366cc";
export const ButtonPrimaryBackgroundColorDisabled = "#c8ccd1";
export const ButtonPrimaryBorderColorDefault = "#3366cc";
export const ButtonPrimaryBorderColorHover = "#447ff5";
export const ButtonPrimaryBorderColorActive = "#2a4b8d";
export const ButtonPrimaryBorderColorFocus = "#3366cc";
export const ButtonPrimaryBorderColorDisabled = "#c8ccd1";
export const ButtonPrimaryBorderRadius = "2px";
export const ButtonPrimaryBorderWidthDefault = "1px";
export const ButtonPrimaryBorderWidthIncrease = "2px";
export const ButtonTextLineHeight = "1.25";
export const ButtonTextFontSize = "16px";
export const ButtonTextFontWeight = "600";
export const ButtonTextPaddingMediumX = "12px";
export const ButtonTextPaddingMediumY = "5px";
export const ButtonTextPaddingLargeX = "16px";
export const ButtonTextPaddingLargeY = "9px";
export const ButtonTextColorPositive = "#202122";
export const ButtonTextColorReversed = "#ffffff";
export const ButtonHeightMedium = "32px";
export const ButtonHeightLarge = "40px";
export const ButtonBorderColorDisabled = "#c8ccd1";
export const ButtonBackgroundColorDisabled = "#c8ccd1";
export const TextColorBase = "#202122";
export const TextColorEmphasized = "#000000";
export const TextColorSecondary = "#72777d";
export const BackgroundColorUnframedBase = "#ffffff";
export const BackgroundColorUnframedHover = "#eaecf0";
export const BackgroundColorUnframedFocus = "#ffffff";
export const BackgroundColorUnframedDisabled = "#eaecf0";
export const BackgroundColorFramedBase = "#f8f9fa";
export const BackgroundColorFramedHover = "#ffffff";
export const BackgroundColorFramedActive = "#72777d";
export const BackgroundColorFramedDisabled = "#c8ccd1";
export const BorderColorBase = "#a2a9b1";
export const BorderColorHover = "#72777d";
export const BorderColorActive = "#72777d";
export const BorderColorFocus = "#a2a9b1";
export const BorderColorDisabled = "#c8ccd1";
export const BorderRadiusNone = "0px";
export const BorderRadiusRound = "2px";
export const BorderRadiusRounder = "4px";
export const BorderWidthThin = "1px";
export const BorderWidthThick = "2px";
export const FontFamilySans = "-apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Lato', 'Helvetica', 'Arial', sans-serif;";
export const FontFamilySerif = "'Linux Libertine', 'Georgia', 'Times', serif;";
export const FontFamilyMonospace = "'Menlo', 'Consolas', 'Liberation Mono', 'Courier New', monospace;";
export const FontWeightRegular = "400";
export const FontWeightBold = "600";
export const FontLineHeightSmall = "1.25";
export const FontLineHeightMedium = "1.5";
export const FontLineHeightLarge = "1.6";
export const ColorBase0 = "#000000";
export const ColorBase10 = "#202122";
export const ColorBase20 = "#54595d";
export const ColorBase30 = "#72777d";
export const ColorBase50 = "#a2a9b1";
export const ColorBase70 = "#c8ccd1";
export const ColorBase80 = "#eaecf0";
export const ColorBase90 = "#f8f9fa";
export const ColorBase100 = "#ffffff";
export const ColorAccent30 = "#2a4b8d";
export const ColorAccent50 = "#3366cc";
export const ColorAccent90 = "#eaf3ff";
export const ColorUtilityRed30 = "#b32424";
export const ColorUtilityRed50 = "#dd3333";
export const ColorUtilityRed90 = "#fee7e6";
export const ColorUtilityGreen30 = "#14866d";
export const ColorUtilityGreen50 = "#00af89";
export const ColorUtilityGreen90 = "#d5fdf4";
export const ColorUtilityYellow30 = "#ac6600";
export const ColorUtilityYellow50 = "#ffcc33";
export const ColorUtilityYellow90 = "#fef6e7";
export const ColorInteractionPrimaryHover = "#447ff5";
export const ColorInteractionDestructiveActive = "#d11d13";
export const DimensionFontSizeXsmall = "13px";
export const DimensionFontSizeSmall = "14px";
export const DimensionFontSizeMedium = "16px";
export const DimensionFontSizeLarge = "18px";
export const DimensionFontSizeXlarge = "20px";
export const DimensionFontSizeXxlarge = "24px";
export const DimensionFontSizeXxxlarge = "32px";
export const DimensionStaticSize0 = "0px";
export const DimensionStaticSize10 = "1px";
export const DimensionStaticSize25 = "2px";
export const DimensionStaticSize50 = "4px";
export const DimensionStaticSize65 = "5px";
export const DimensionStaticSize100 = "8px";
export const DimensionStaticSize110 = "9px";
export const DimensionStaticSize150 = "12px";
export const DimensionStaticSize200 = "16px";
export const DimensionStaticSize250 = "20px";
export const DimensionStaticSize300 = "24px";
export const DimensionStaticSize400 = "32px";
export const DimensionStaticSize500 = "40px";
export const TransitionDurationFast = "100ms";
export const TransitionDurationRegular = "200ms";
export const TransitionDurationSlower = "300ms";
export const TransitionDurationSlowest = "400ms";