const { defineConfig } = require('cypress')

module.exports = defineConfig({
  projectId: 'tnstsp',
  env: {
    black: 'rgb(10, 10, 10)',
    'black-bis': 'rgb(18, 18, 18)',
    'black-ter': 'rgb(36, 36, 36)',
    'grey-darker': 'rgb(54, 54, 54)',
    'grey-dark': 'rgb(74, 74, 74)',
    grey: 'rgb(122, 122, 122)',
    'grey-light': 'rgb(181, 181, 181)',
    'grey-lighter': 'rgb(219, 219, 219)',
    'grey-lightest': 'rgb(237, 237, 237)',
    'white-ter': 'rgb(245, 245, 245)',
    'white-bis': 'rgb(250, 250, 250)',
    white: 'rgb(255, 255, 255)',
    transparent: 'rgba(0, 0, 0, 0)',
    'black-transparent': 'rgba(0, 0, 0, 0.7)',
    orange: 'rgb(255, 71, 15)',
    yellow: 'rgb(255, 224, 138)',
    green: 'rgb(72, 199, 142)',
    turquoise: 'rgb(0, 209, 178)',
    cyan: 'rgb(62, 142, 208)',
    blue: 'rgb(72, 95, 199)',
    purple: 'rgb(184, 107, 255)',
    red: 'rgb(241, 70, 104)',
    'color-names': ['primary', 'link', 'info', 'success', 'warning', 'danger'],
    primary: 'rgb(0, 209, 178)',
    'primary-invert': 'rgb(255, 255, 255)',
    'primary-light': 'rgb(235, 255, 252)',
    'primary-dark': 'rgb(0, 148, 126)',
    link: 'rgb(72, 95, 199)',
    'link-invert': 'rgb(255, 255, 255)',
    'link-light': 'rgb(239, 241, 250)',
    'link-dark': 'rgb(56, 80, 183)',
    info: 'rgb(62, 142, 208)',
    'info-invert': 'rgb(255, 255, 255)',
    'info-light': 'rgb(239, 245, 251)',
    'info-dark': 'rgb(41, 111, 168)',
    success: 'rgb(72, 199, 142)',
    'success-invert': 'rgb(255, 255, 255)',
    'success-light': 'rgb(239, 250, 245)',
    'success-dark': 'rgb(37, 121, 83)',
    warning: 'rgb(255, 224, 138)',
    'warning-invert': 'rgba(0, 0, 0, 0.7)',
    'warning-light': 'rgb(255, 250, 235)',
    'warning-dark': 'rgb(148, 108, 0)',
    danger: 'rgb(241, 70, 104)',
    'danger-invert': 'rgb(255, 255, 255)',
    'danger-light': 'rgb(254, 236, 240)',
    'danger-dark': 'rgb(204, 15, 53)',
    'scheme-main': 'rgb(255, 255, 255)',
    'scheme-main-bis': 'rgb(250, 250, 250)',
    'scheme-main-ter': 'rgb(245, 245, 245)',
    border: 'rgb(219, 219, 219)',
    'border-hover': 'rgb(181, 181, 181)',
    text: 'rgb(74, 74, 74)',
    'text-strong': 'rgb(54, 54, 54)',
    'text-light': 'rgb(122, 122, 122)',
    'text-invert': 'rgb(255, 255, 255)',
    code: 'rgb(218, 16, 57)',
    'control-radius': '4px',
    'control-radius-small': '2px',
    'control-border-width': '1px',
    'control-height': '40px',
    'control-line-height': '24px',
    'control-padding-vertical': '7px',
    'control-padding-horizontal': '11px',
    'input-shadow': 'rgba(10, 10, 10, 0.05) 0px 1px 2px 0px inset',
    'size-small': '12px',
    'size-normal': '16px',
    'size-medium': '20px',
    'size-large': '24px',
    'weight-light': '300',
    'weight-normal': '400',
    'weight-medium': '500',
    'weight-semibold': '600',
    'weight-bold': '700',
    'family-code': 'monospace',
    viewports: {
      mobile: [320, 480],
      tablet: [769, 640],
      desktop: [1024, 800],
      widescreen: [1216, 900],
      fullhd: [1408, 1200],
    },
    sizes: {
      1: 48,
      2: 40,
      3: 32,
      4: 24,
      5: 20,
      6: 16,
      7: 12,
      small: 12,
      normal: 16,
      medium: 20,
      large: 24,
    },
    'just-sizes': ['small', 'normal', 'medium', 'large'],
  },
  e2e: {
    // We've imported your old cypress plugins here.
    // You may want to clean this up later by importing these.
    setupNodeEvents(on, config) {
      return require('./cypress/plugins/index.js')(on, config)
    },
    specPattern: 'cypress/e2e/**/*.{js,jsx,ts,tsx}',
  },
})