funky-framadate-front/src/styles/variables.scss

@charset "UTF-8";

// colors from styleguide https://app.zeplin.io/project/5d4d83d68866d6522ff2ff10/styleguide/colors?cid=5d502bb032e23e3516af8154
$green: #64d16e;
$black: #000000;
$ugly-purple: #b24eb7;
$lavender-pink: #e9bdeb;
$white: #ffffff;
$dark-lavender: #7d6c99;
$dusty-orange: #f18647;
$violet: #bd10e0;
$red: #cd0000;
$cool-grey: #aeafb1;
$warm-grey: #807e7e;
$wisteria: #bf83c2;
$pale-purple: #d198d4;

$purple: #8a4d76;
$pink: #fa7c91;
$brown: #757763;
$beige-light: #d0d1cd;
$beige-lighter: #eff0eb;

// DINUM colors

$d-primary-intense: #3e3882; // bleu 800
$d-blue-700: #4f47af; // bleu 700
$d-primary: #6359cf; // bleu 600
$d-grey: #e3e3ea;
$d-blue30: #f6f5fd; // bleu 300
$d-rule: #e2e0fa; // bleu 100
$d-neutral: #b5b5c6;
$d-border: #4e4c59;
$d-grey: #767486;
$d-black: #383838;
$d-alt: #a9607f;

$d-info: #ecf4ff;
$d-info-text: #316ec7;
$intense-blue: #0a76f6;
$d-success: #ecfff5;
$d-success-text: #128149;
$d-warning: #dcd3bb;
$d-warning-text: #86671b;
$d-error: #ffecee;
$d-error-text: #d51b38;

// interpretations in app
$outline-color: $intense-blue; // #0a76f6
$success_color: $d-success-text;
$primary_color: $d-primary;
$primary-light: mix($d-primary, $white);
$primary: $d-primary;
$secondary_color: $d-primary-intense;
$bg-grey: $d-blue30;
$bar-progress-grey: #e3e3ea;
$font_color: $d-black;
$font_color_light: $d-grey;
$logo_color: $d-primary;
$logo_color_2: $d-primary-intense;
$legend_color: $d-info-text;
$legend_color_2: $d-info;
$choice_select_border_color: $d-info;
$hover-color: $d-neutral;
$rules: $d-rule;
$border-color: $d-neutral;
$input-border-color: $d-border;
$dark: $d-border;
$grey: $font_color_light;
$grey-dark: $d-primary;
$grey-lighter: $beige-light;
$clicked-color: $d-primary;
$mini-button-color: $d-primary-intense;
$warning: $d-warning;
$warning-dark: mix($d-warning, $dark);
$danger: $d-error;
$success: $d-success;

$default_font: 'helvetica', 'proza_libre', 'Arial', 'DejaVu Sans Mono';
$title_font: 'helvetica', 'proza_libre', 'Arial', 'DejaVu Sans Mono';

// sizes and breakpoints
$large-column-width: 588px;
$main-column-width: 25rem;
$main-column-width-inner: 23.75rem;
$logo-side: 40px;
$mobile-size: 25rem;
$header-nav-height: 4.85rem;
$header-nav-inner-height: 4.5rem;
$widescreen-width-main-column: 75rem;
$stepper-nav-height: 2rem;
$stepper-progress-bar-height: 5px;
$home-nav-height: 2rem;
$home-nav-height-small: 3.5rem;

//$widescreen: 60em;

// datepicker
$cell-size-datepicker-small: 30px;
$cell-size-datepicker-desktop: 42px;
$cell-size-datepicker: 50px;

// css vars
:root {
	--main-col-width: $main-column-width-inner;
}