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

107 lines
2.5 KiB
SCSS
Raw Normal View History

@charset "UTF-8";
2021-11-07 14:52:49 +01:00
// colors from styleguide https://app.zeplin.io/project/5d4d83d68866d6522ff2ff10/styleguide/colors?cid=5d502bb032e23e3516af8154
$green: #64d16e;
2019-08-11 17:06:07 +02:00
$black: #000000;
2021-11-07 14:52:49 +01:00
$ugly-purple: #b24eb7;
$lavender-pink: #e9bdeb;
2019-08-11 17:06:07 +02:00
$white: #ffffff;
2021-11-07 14:52:49 +01:00
$dark-lavender: #7d6c99;
$dusty-orange: #f18647;
$violet: #bd10e0;
2021-11-07 14:52:49 +01:00
$red: #cd0000;
$cool-grey: #aeafb1;
$warm-grey: #807e7e;
$wisteria: #bf83c2;
$pale-purple: #d198d4;
2020-04-21 10:50:26 +02:00
2021-11-07 14:52:49 +01:00
$purple: #8a4d76;
$pink: #fa7c91;
2020-04-21 10:50:26 +02:00
$brown: #757763;
$beige-light: #d0d1cd;
$beige-lighter: #eff0eb;
2021-11-07 14:52:49 +01:00
// DINUM colors
$d-primary-intense: #3e3882; // bleu 800
$d-blue-700: #4f47af; // bleu 700
$d-primary: #6359cf; // bleu 600
$d-grey: #e3e3ea;
2022-02-02 16:28:52 +01:00
$d-blue30: #f6f5fd; // bleu 300
2021-11-18 11:22:44 +01:00
$d-rule: #e2e0fa; // bleu 100
2021-12-21 16:02:25 +01:00
$d-neutral: #b5b5c6;
$d-border: #4e4c59;
2022-02-15 16:12:01 +01:00
$d-grey: #767486;
2022-02-02 16:28:52 +01:00
$d-black: #383838;
2021-11-07 14:52:49 +01:00
$d-alt: #a9607f;
$d-info: #ecf4ff;
$d-info-text: #316ec7;
$intense-blue: #0a76f6;
2021-11-07 14:52:49 +01:00
$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;
2021-11-07 14:52:49 +01:00
$primary_color: $d-primary;
2022-03-10 11:06:18 +01:00
$primary-light: mix($d-primary, $white);
2021-11-07 14:52:49 +01:00
$primary: $d-primary;
$secondary_color: $d-primary-intense;
$bg-grey: $d-blue30;
$bar-progress-grey: #e3e3ea;
2022-02-02 16:28:52 +01:00
$font_color: $d-black;
2022-02-15 16:12:01 +01:00
$font_color_light: $d-grey;
2021-11-07 14:52:49 +01:00
$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;
2021-11-18 11:22:44 +01:00
$rules: $d-rule;
2021-11-07 14:52:49 +01:00
$border-color: $d-neutral;
2021-12-21 16:02:25 +01:00
$input-border-color: $d-border;
2022-03-10 11:06:18 +01:00
$dark: $d-border;
$grey: $font_color_light;
2021-11-07 14:52:49 +01:00
$grey-dark: $d-primary;
$grey-lighter: $beige-light;
$clicked-color: $d-primary;
$mini-button-color: $d-primary-intense;
$warning: $d-warning;
2022-03-10 11:06:18 +01:00
$warning-dark: mix($d-warning, $dark);
2021-11-07 14:52:49 +01:00
$danger: $d-error;
$success: $d-success;
2021-11-30 11:17:44 +01:00
$default_font: 'helvetica', 'proza_libre', 'Arial', 'DejaVu Sans Mono';
$title_font: 'helvetica', 'proza_libre', 'Arial', 'DejaVu Sans Mono';
2021-12-09 11:21:41 +01:00
// sizes and breakpoints
2022-02-09 11:30:22 +01:00
$large-column-width: 588px;
2021-12-13 15:30:00 +01:00
$main-column-width: 25rem;
$main-column-width-inner: 23.75rem;
2022-02-11 11:43:50 +01:00
$logo-side: 40px;
2021-12-13 15:30:00 +01:00
$mobile-size: 25rem;
2022-02-09 14:27:22 +01:00
$header-nav-height: 4.85rem;
$header-nav-inner-height: 4.5rem;
$widescreen-width-main-column: 75rem;
2022-02-15 14:48:50 +01:00
$stepper-nav-height: 2rem;
$stepper-progress-bar-height: 5px;
2022-02-15 14:48:50 +01:00
$home-nav-height: 2rem;
2022-02-09 14:47:51 +01:00
$home-nav-height-small: 3.5rem;
2022-03-10 11:06:18 +01:00
//$widescreen: 60em;
2021-12-13 15:30:00 +01:00
// datepicker
2022-02-11 12:11:53 +01:00
$cell-size-datepicker-small: 30px;
$cell-size-datepicker-desktop: 42px;
$cell-size-datepicker: 50px;
2021-12-13 15:30:00 +01:00
// css vars
:root {
--main-col-width: $main-column-width-inner;
}