"use strict";

// import { merge } from 'chain-able-boost'
// import { rem, font, VIEWPORT_BASE_WIDTH, VIEWPORT_BASE_WIDTH_TABLET } from '../functions'
// import base from './classic'
const merge = require('chain-able-boost').dopemerge;

const {
  rem,
  font,
  VIEWPORT_BASE_WIDTH,
  VIEWPORT_BASE_WIDTH_TABLET
} = require('../functions');

const base = require('./classic');

const rems = rem.bind(undefined, undefined);
const fontSizeName = font.bind(undefined, undefined);
const colors = {
  'colors-secondary-background': '#EFEFEF',
  'colors-main-background': '#FFF',
  'colors-primary': '#25A9E0',
  'colors-secondary': '#159FD5',
  // white rabbit
  'colors-white': '#FFF',
  'colors-black': '#000',
  'colors-body': '#1E1E1E',
  'colors-blue': '#51a1d6',
  'colors-main-text': '#000',
  'colors-blackrabbit': '#2C2C2C',
  'colors-grey': '#6D707F',
  'colors-lightgrey': '#A6AFC1',
  'colors-cloud': '#EFEFEF',
  'colors-almostwhite': '#F5F5F5',
  'colors-actionblue': '#25A9E0',
  'colors-gogreen': '#009944',
  'colors-brightred': '#EA2227',
  'colors-nav-text': '#264C7C',
  'colors-darkblue': '#264C7C',
  'colors-greyblue': '#5F6C88',
  'colors-almostgreyblue': '#2E3748',
  'colors-lightestgrey': '#CCC',
  'colors-greyshade': '#ACB1B4',
  'colors-black-shade': '#231f20',
  'colors-medium-grey': '#c5c7c9',
  'colors-grey-shade': '#a6a8ab',
  'colors-yellow': '#ffc10e',
  'colors-stormcloud': '#586060',
  'colors-gainsboro': '#D0DEE1',
  'colors-darkblack': '#262626',
  'colors-toast-action-blue': '#56C1EB',
  'colors-bright-green': '#008A00',
  'colors-swatch-value-name': '#5f6c88',

  /**
   * @todo @see https://www.styled-components.com/docs/tooling#styled-theming
   */
  'colors-light-blue': '#25A9E0',
  'colors-inactive-radio-stroke': '#2C2C2C',
  'colors-active-radio-stroke': '#2C2C2C',
  'colors-active-radio-circle': '#25A9E0',
  'colors-pancake': '#000',
  'colors-curious-blue': '#159FD5',
  // Footer elements
  'colors-footer-bg': '#292929',
  'colors-footer-text': '#FFF',
  'colors-powered-by': '#17AEEA',
  'colors-white-alpha': 'rgba(255, 255, 255, 0.90)',
  // '#ffffffe6'
  // Gradient
  'colors-white-transclusion': 'linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 1%,rgba(255,255,255,1) 100%)'
};
const borders = {
  'border-radius': rems(2),
  'border-bold': rems(4),
  'border-invisible': `${rems(1)} solid transparent`,
  'border-light': `${rems(1)} solid ${colors['colors-secondary-background']}`,
  'border-basic': `${rems(1)} solid ${colors['colors-secondary-text']}`,
  'border-thin': `${rems(1)} solid ${colors['colors-lightgrey']}`,
  'border-white': `${rems(1)} solid ${colors['colors-almostwhite']}` // moved to fns...
  // seen in page of wr
  // const sizing = {
  //   maxWidth: 1200,
  // }

};
const shadow = {
  boxShadow: '0px 2px 4px rgba(0,0,0,0.4)',
  textShadow: '0px 0px 6px #564c4c'
};
const fontStyle = {
  'font-style-italic': 'italic',
  'font-style-unset': 'unset',
  'font-style-strike-line': 'line-through',
  'font-style-above-line': 'overline',
  'font-style-under-line': 'underline',
  // !!!!! SUPER IMPORTANT THIS BASE REM SIZE AFFECTS SIZING FOR THE ENTIRE REM OF THE APP
  'font-body': fontSizeName(16, 'regular')
};
const fonts = {
  // Regular
  'font-regular-very-small': fontSizeName(12, 'regular'),
  'font-regular-extra-small': fontSizeName(14, 'regular'),
  'font-regular-small': fontSizeName(16, 'regular'),
  'font-regular-default': fontSizeName(18, 'regular'),
  'font-regular-large': fontSizeName(20, 'regular'),
  'font-regular-xlarge': fontSizeName(24, 'regular'),
  'font-regular-big': fontSizeName(64, 'regular'),
  // Medium
  'font-medium-very-small': fontSizeName(12, 'semi'),
  'font-medium-extra-small': fontSizeName(14, 'semi'),
  'font-medium-small': fontSizeName(16, 'semi'),
  'font-medium-default': fontSizeName(18, 'semi'),
  'font-medium-large': fontSizeName(20, 'semi'),
  'font-medium-xlarge': fontSizeName(24, 'semi'),
  'font-medium-big': fontSizeName(64, 'semi'),
  // Bold
  'font-bold-very-small': fontSizeName(12, 'bold'),
  'font-bold-extra-small': fontSizeName(14, 'bold'),
  'font-bold-small': fontSizeName(16, 'bold'),
  'font-bold-default': fontSizeName(18, 'bold'),
  'font-bold-large': fontSizeName(20, 'bold'),
  'font-bold-xlarge': fontSizeName(24, 'bold'),
  'font-bold-big': fontSizeName(64, 'bold'),
  // Condensed
  'font-condensed-small-bold': 'bold 30px "Roboto Condensed"',
  'font-condensed-medium-bold': 'bold 32px "Roboto Condensed"',
  'font-condensed-large-bold': 'bold 52px "Roboto Condensed"',
  'font-condensed-extralarge-bold': 'bold 72px "Roboto Condensed"'
};
const baseSpacingSize = 16;
const spacing = {
  // 1
  'spacing-smallest': rems(baseSpacingSize / 16),
  // 2
  'spacing-very-small': rems(baseSpacingSize / 8),
  // 4
  'spacing-extra-small': rems(baseSpacingSize / 4),
  // 8
  'spacing-small': rems(baseSpacingSize / 2),
  // 16
  'spacing': rems(baseSpacingSize),
  // 24
  'spacing-big': rems(baseSpacingSize * 1.5),
  // 32
  'spacing2x': rems(baseSpacingSize * 2),
  // 32 + 16
  'spacing3x': rems(baseSpacingSize * 3),
  // 32 + 32
  'spacing4x': rems(baseSpacingSize * 4),
  'spacing5x': rems(baseSpacingSize * 5),
  'spacing6x': rems(baseSpacingSize * 6),
  'spacing7x': rems(baseSpacingSize * 7),
  'spacing8x': rems(baseSpacingSize * 8),
  'spacing-accessible': rems(baseSpacingSize / 8),
  'spacing-zero': rems(0)
};
const zindex = {
  'layer-position-1': 10,
  'layer-position-2': 20,
  'layer-position-3': 40,
  'layer-position-4': 60,
  'layer-position-5': 80,
  'layer-position-6': 90
};
const all = { ...font,
  ...colors,
  ...spacing,
  ...fonts,
  ...fontStyle,
  ...shadow,
  ...borders,
  ...zindex
};
const options = {
  stringToArray: false,
  boolToArray: false
};
const merged = merge(base, all, options);
module.exports = merged; // export default merged
// export = merged