// @flow
export const layout = {
  padding: '1.5vw 1.875vw',
  vpadding: '1.5vw',
  hpadding: '1.875vw',
  sidebarWidth: '280px',
  sidebarMinWidth: '250px',
  sidebarMaxWidth: '350px',
};

export const size = {
  tiny: '2px',
  small: '4px',
  medium: '8px',
  large: '16px',
  huge: '24px',
  enormous: '32px',
};

export const fontSize = {
  small: '14px',
  medium: '16px',
  large: '18px',
  huge: '24px',
};

export const fontWeight = {
  ultraLight: 100,
  thin: 200,
  light: 300,
  regular: 400,
  medium: 500,
  semiBold: 600,
  bold: 700,
  heavy: 800,
};

export const fonts = {
  regular: `-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
  Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;`,
  monospace: `'Atlas Typewriter', 'Source Code Pro', Menlo, Consolas,
    'Liberation Mono', monospace;`,
};

export const color = {
  text: '#171B35',

  /* Brand */
  primary: '#2B8FBF',
  danger: '#D0021B',
  warning: '#f08a24' /* replace */,
  success: '#43AC6A' /* replace */,
  info: '#a0d3e8' /* replace */,
  offline: '#000000',

  /* Dark Grays */
  slate: '#9BA6B2',
  slateLight: '#DAE1E9',
  slateDark: '#4E5C6E',

  /* Light Grays */
  smoke: '#F4F7FA',
  smokeLight: '#F9FBFC',
  smokeDark: '#E8EBED',

  /* Misc */
  white: '#FFFFFF',
  black: '#000000',
  blue: '#16B3FF',
};