toggle-corp/react-store

View on GitHub
utils/styles/default/colors.js

Summary

Maintainability
A
0 mins
Test Coverage
const colorTextOnLight = 'rgba(0, 0, 0, .7)';
const colorTextOnDark = 'rgba(255, 255, 255, .8)';

const colorText = colorTextOnLight;
const colorTextAlt = '#000';

const colorTextPlaceholder = 'rgba(0, 0, 0, .4)';
const colorTextDisabled = 'rgba(0, 0, 0, .3)';
const colorTextLabel = 'rgba(0, 0, 0, .6)';

const colorPrimary = '#1672c6';
const colorTextOnPrimary = colorTextOnDark;
const colorAccent = '#008975';
const colorTextOnAccent = colorTextOnDark;
const colorInfo = '#41a1f0';
const colorTextOnInfo = colorTextOnDark;
const colorSuccess = '#41cf76';
const colorTextOnSuccess = colorTextOnDark;
const colorWarning = '#e0b652';
const colorTextOnWarning = colorTextOnDark;
const colorDanger = '#d3575e';
const colorTextOnDanger = colorTextOnDark;

const colorBackground = '#f6f6f6';
const colorTextOnBackground = colorTextOnLight;
const colorBackgroundAlt = '#f2f2f2';
const colorTextOnBackgroundAlt = colorTextOnLight;

const colorBackgroundAccentHint = 'rgba(0, 137, 117, .05)';
const colorTextOnAccentHint = colorTextOnLight;

const colorForeground = '#fff';
const colorTextOnForeground = colorTextOnLight;
const colorForegroundAlt = '#fafafa';
const colorTextOnForegroundAlt = colorTextOnLight;

const colorBackgroundHeader = '#fafafa';
const colorTextOnBackgroundHeader = colorTextOnLight;
const colorBackgroundHeaderAlt = '#f5f5f5';
const colorTextOnBackgroundHeaderAlt = colorTextOnLight;

const colorBackgroundHover = '#f7f7f7';
const colorTextOnBackgroundHover = colorTextOnLight;
const colorBackgroundDisabled = '#f2f2f2';
const colorTextOnBackgroundDisabled = colorTextOnLight;

const colorBackgroundSelected = colorAccent;
const colorTextOnSelected = colorTextOnAccent;

const colorBackgroundRow = colorForeground;
const colorBackgroundRowAlt = colorForeground;

const colorNavbar = colorForeground;
const colorNavbarMenuItemHover = colorAccent;
const colorTextOnNavbar = colorTextOnLight;
const colorTextActiveTab = colorPrimary;

const colorNegative = colorDanger;
const colorPositive = colorSuccess;

const colorSeparatorLight = 'rgba(0, 0, 0, .06)';
const colorSeparator = 'rgba(0, 0, 0, .1)';
const colorSeparatorAlt = 'rgba(0, 0, 0, .2)';
const colorSeparatorHover = 'rgba(0, 0, 0, .3)';

const colorShadowMedium = 'rgba(0, 0, 0, .5)';
const colorBackgroundButtonDefault = colorForeground;
const colorBackgroundScrollbar = '#eee';
const colorForegroundScrollbar = '#bbb';
const colorBackgroundOverlay = 'rgba(255, 255, 255, .77)';
const colorBackgroundModal = 'rgba(0, 0, 0, .77)';

const colorGridPath = '#e8e8e8';
const colorAxisPath = '#d3d3d3';
const colorLinks = '#eaeaea';
const colorVizBlue = '#3182bd';
const colorVizGrey = '#d3d3d3';
const colorVizOrange = '#FA6900';

const colorBackgroundHoverLayer = 'rgba(0, 0, 0, 0.16)';

const colors = {
    colorTextOnLight,
    colorTextOnDark,

    colorText,
    colorTextPlaceholder,
    colorTextDisabled,
    colorTextLabel,

    colorPrimary,
    colorTextOnPrimary,
    colorAccent,
    colorTextOnAccent,
    colorInfo,
    colorTextOnInfo,
    colorSuccess,
    colorTextOnSuccess,
    colorWarning,
    colorTextOnWarning,
    colorDanger,
    colorTextOnDanger,

    colorBackground,
    colorTextOnBackground,
    colorBackgroundAlt,
    colorTextOnBackgroundAlt,

    colorBackgroundAccentHint,
    colorTextOnAccentHint,

    colorForeground,
    colorTextOnForeground,
    colorForegroundAlt,
    colorTextOnForegroundAlt,

    colorBackgroundHeader,
    colorTextOnBackgroundHeader,
    colorBackgroundHeaderAlt,
    colorTextOnBackgroundHeaderAlt,

    colorBackgroundHover,
    colorTextOnBackgroundHover,
    colorBackgroundDisabled,
    colorTextOnBackgroundDisabled,

    colorBackgroundSelected,
    colorTextOnSelected,

    colorBackgroundRow,
    colorBackgroundRowAlt,

    colorNavbar,
    colorNavbarMenuItemHover,
    colorTextOnNavbar,
    colorTextActiveTab,

    colorNegative,
    colorPositive,

    colorSeparator,
    colorSeparatorLight,
    colorSeparatorAlt,
    colorSeparatorHover,

    colorShadowMedium,
    colorBackgroundButtonDefault,
    colorBackgroundScrollbar,
    colorForegroundScrollbar,
    colorBackgroundOverlay,
    colorBackgroundModal,

    colorGridPath,
    colorAxisPath,
    colorLinks,
    colorVizBlue,
    colorVizGrey,
    colorVizOrange,

    colorTextAlt,

    colorBackgroundHoverLayer,
};

export default colors;