variables.scss

/**
 *
 *                          VARIABLES.SCSS
 * 
 * 
 *      Fichier contenant les variables de style de l'application
 * 
 * 
 */

// Bootstrap and its default variables
@import "node_modules/bootstrap/scss/bootstrap";

:root {
  --application-color-primary: #39468A;
  --application-color-primary-light: #4251a0;
  --application-color-primary-dark: #333f7c;
  --application-color-primary-text: #fff;

  --application-color-secondary: #464646;
  --application-color-secondary-active: #747474;
  --application-color-secondary-text: #bdbdbd;
  --application-color-secondary-text-active: #fff;

  --application-color-background: #f5f5f5;
  --application-color-background-dark5: #e8e8e8;
  --application-color-background-dark15: #d0d0d0;
  --application-color-background-text: #666;

  --application-color-map-btn: #666666;
  --application-color-map-btn-light: #5b5b5b;
  --application-color-map-btn-dark: #343434;
  --application-color-map-btn-text: #fff;
}

// Extend Bootstrap theme-colors
$theme-colors: map-merge(("indigo": $indigo,
    "purple": $purple,
    "pink": $pink,
    "orange": $orange,
    "teal": $teal,
    "cyan": $cyan),
  $theme-colors);

// Couleur principale
$application-color-primary: var(--application-color-primary);
$application-color-primary-light: var(--application-color-primary-light);
$application-color-primary-dark: var(--application-color-primary-dark);
$application-color-primary-text: var(--application-color-primary-text);

// Couleur menus
$application-color-secondary: var(--application-color-secondary);
$application-color-secondary-active: var(--application-color-secondary-active);
$application-color-secondary-text: var(--application-color-secondary-text);
$application-color-secondary-text-active: var(--application-color-secondary-text-active);

// Couleurs espace de travail
$application-color-background: var(--application-color-background);
$application-color-background-dark5: var(--application-color-background-dark5);
$application-color-background-dark15: var(--application-color-background-dark15);
$application-color-background-text: var(--application-color-background-text);

// Couleurs boutons de carte
$application-color-map-btn: var(--application-color-map-btn);
$application-color-map-btn-light: var(--application-color-map-btn-light);
$application-color-map-btn-dark: var(--application-color-map-btn-dark);
$application-color-map-btn-text: var(--application-color-map-btn-text);

// Couleurs des boutons
$btn-color-primary: $application-color-primary-light;