ngx-admin/src/app/theme/theme.constants.ts

export const IMAGES_ROOT = 'assets/img/';


export class colorHelper {
  static shade = (color, weight) => {
    return mix('#000000', color, weight);
  };

  static tint = (color, weight) => {
    return mix('#ffffff', color, weight);
  };
}

//SASS mix function
export let mix = (color1, color2, weight) => {
  // convert a decimal value to hex
  function d2h(d) {
    return d.toString(16);
  }

  // convert a hex value to decimal
  function h2d(h) {
    return parseInt(h, 16);
  }

  let result = "#";
  for (let i = 1; i < 7; i += 2) {
    let color1Part = h2d(color1.substr(i, 2));
    let color2Part = h2d(color2.substr(i, 2));
    let resultPart = d2h(Math.floor(color2Part + (color1Part - color2Part) * (weight / 100.0)));
    result += ('0' + resultPart).slice(-2);
  }
  return result;
};

export let hexToRgbA = (hex, alpha) => {
  var c;
  if (/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)) {
    c = hex.substring(1).split('');
    if (c.length == 3) {
      c = [c[0], c[0], c[1], c[1], c[2], c[2]];
    }
    c = '0x' + c.join('');
    return 'rgba(' + [(c >> 16) & 255, (c >> 8) & 255, c & 255].join(',') + ',' + alpha + ')';
  }
  throw new Error('Bad Hex');
};

export const layoutSizes = {
  resWidthCollapseSidebar: 1200,
  resWidthHideSidebar: 500
};

export const colorScheme = {
  primary: '#209e91',
  info: '#2dacd1',
  success: '#90b900',
  warning: '#dfb81c',
  danger: '#e85656',
};

export const bgColorPalette = {
  blueStone: '#005562',
  surfieGreen: '#0e8174',
  silverTree: '#6eba8c',
  gossip: '#b9f2a1',
  white: '#10c4b5',
};

export const layoutColors = {
  primary: colorScheme.primary,
  info: colorScheme.info,
  success: colorScheme.success,
  warning: colorScheme.warning,
  danger: colorScheme.danger,

  primaryLight: colorHelper.tint(colorScheme.primary, 30),
  infoLight: colorHelper.tint(colorScheme.info, 30),
  successLight: colorHelper.tint(colorScheme.success, 30),
  warningLight: colorHelper.tint(colorScheme.warning, 30),
  dangerLight: colorHelper.tint(colorScheme.danger, 30),

  primaryDark: colorHelper.shade(colorScheme.primary, 15),
  infoDark: colorHelper.shade(colorScheme.info, 15),
  successDark: colorHelper.shade(colorScheme.success, 15),
  warningDark: colorHelper.shade(colorScheme.warning, 15),
  dangerDark: colorHelper.shade(colorScheme.danger, 15),

  primaryBg: colorHelper.tint(colorScheme.primary, 20),
  infoBg: colorHelper.tint(colorScheme.info, 20),
  successBg: colorHelper.tint(colorScheme.success, 20),
  warningBg: colorHelper.tint(colorScheme.warning, 20),
  dangerBg: colorHelper.tint(colorScheme.danger, 20),

  default: '#ffffff',
  defaultText: '#666666',
  border: '#dddddd',

  bgColorPalette: {
    blueStone: bgColorPalette.blueStone,
    surfieGreen: bgColorPalette.surfieGreen,
    silverTree: bgColorPalette.silverTree,
    gossip: bgColorPalette.gossip,
    white: bgColorPalette.white,

    blueStoneDark: colorHelper.shade(bgColorPalette.blueStone, 15),
    surfieGreenDark: colorHelper.shade(bgColorPalette.surfieGreen, 15),
    silverTreeDark: colorHelper.shade(bgColorPalette.silverTree, 15),
    gossipDark: colorHelper.shade(bgColorPalette.gossip, 15),
    whiteDark: colorHelper.shade(bgColorPalette.white, 5),
  }
};

let _chartColors = [];
let _colorsForChart = [layoutColors.primary, layoutColors.danger, layoutColors.warning, layoutColors.success, layoutColors.info, layoutColors.default, layoutColors.primaryDark, layoutColors.successDark, layoutColors.warningLight, layoutColors.successLight, layoutColors.successBg];

_colorsForChart.forEach((color) => {
  _chartColors.push({
    fillColor: hexToRgbA(color, 0.2),
    strokeColor: hexToRgbA(color, 1),
    pointColor: hexToRgbA(color, 1),
    pointStrokeColor: color,
    pointHighlightFill: color,
    pointHighlightStroke: hexToRgbA(color, 0.8),
    color: hexToRgbA(color, 1),
    highlight: hexToRgbA(color, 0.8)
  });
});
export const chartColors = _chartColors;

export const layoutPaths = {
  images: {
    root: IMAGES_ROOT,
    profile: IMAGES_ROOT + 'app/profile/',
    amMap: 'assets/img/theme/vendor/ammap/',
    amChart: 'assets/img/theme/vendor/amcharts/dist/amcharts/images/'
  }
};