114 lines
3.3 KiB
SCSS
114 lines
3.3 KiB
SCSS
// ------------------------------
|
|
// Tailles typos
|
|
|
|
// valeur fixe (équivalence 1em)
|
|
$_base-font-size: 16px;
|
|
|
|
// valeur variable (taille du texte de base)
|
|
$body-font-size: 16px;
|
|
|
|
$typo-line-height: 1.6;
|
|
|
|
$spacer: em(16px);
|
|
|
|
// ------------------------------
|
|
// Palette de couleurs du site
|
|
|
|
// --------------------------------------------------
|
|
|
|
// Grays
|
|
// -------------------------
|
|
$black: #000;
|
|
$grayDarker: #222;
|
|
$grayDark: #333;
|
|
$gray: #555;
|
|
$grayLight: #999;
|
|
$grayLightL5: lighten($grayLight,5%);
|
|
$grayLighter: #eee;
|
|
$white: #fff;
|
|
|
|
$blancTransparent: rgba($white,0.7);
|
|
|
|
|
|
// Accent colors
|
|
// -------------------------
|
|
$blue: #049cdb;
|
|
$blueDark: #0064cd;
|
|
$green: #46a546;
|
|
$red: #9d261d;
|
|
$yellow: #ffc40d;
|
|
$orange: #f89406;
|
|
$pink: #c3325f;
|
|
$purple: #7a43b6;
|
|
|
|
|
|
$couleurPrincipale: #00365b;
|
|
$couleurPrincipaleOn: #004050;
|
|
$couleurSecondaire: #f7651a;
|
|
$couleurPrincipaleDowner: lighten($couleurPrincipale, 60%);
|
|
|
|
$couleurBackground: $white;
|
|
|
|
$couleurBackgroundTexte: #f5faff;
|
|
|
|
$couleur-primaire: #253288;
|
|
$couleurConnex: #005F6B;
|
|
|
|
$couleur-texte: #0A4250;
|
|
$couleur-titres: $couleur-texte;
|
|
$couleur-lien: #0a4756;
|
|
$couleur-lien-hover: lighten($couleur-lien, 10%);
|
|
|
|
$couleur-gris-bg: #EDEDED;
|
|
|
|
$couleur-erreur: #B01C16;
|
|
$couleur-erreur-bg: #FDF5F4;
|
|
$couleur-valide: #3E7723;
|
|
$couleur-valide-bg: #EFF9EF;
|
|
|
|
// Links
|
|
// -------------------------
|
|
/*$couleurLien: #0a4756;
|
|
$couleurLienHover: $couleurSecondaire;*/
|
|
|
|
// ------------------------------
|
|
// Palette de couleurs des formulaires
|
|
|
|
$couleur-boutons: $couleurPrincipale;
|
|
$couleur-boutons-hover: darken($couleur-boutons, 10%);
|
|
$couleur-placeholder: $couleurPrincipale;
|
|
$couleur-border-form: #D6D6D6;
|
|
$couleur-border-form-focus: $couleur-primaire;
|
|
|
|
// ------------------------------
|
|
// Variables
|
|
|
|
$container-width: 1200px;
|
|
|
|
$typo-margin-vertical: ($typo-line-height)*1em;
|
|
|
|
// ------------------------------
|
|
// Breakpoints
|
|
|
|
$screen-xxsmall: 380px;
|
|
$screen-small: 580px;
|
|
$screen-medium: 768px;
|
|
$screen-large: 980px;
|
|
$screen-largeplus: $container-width;
|
|
|
|
$bp-xxsmall: breakpoint(max-width, em($screen-xxsmall, $_base-font-size));
|
|
$bp-small: breakpoint(max-width, em($screen-small, $_base-font-size));
|
|
$bp-medium: breakpoint(max-width, em($screen-medium, $_base-font-size));
|
|
$bp-large: breakpoint(max-width, em($screen-large, $_base-font-size));
|
|
$bp-largeplus: breakpoint(max-width, em($screen-largeplus, $_base-font-size));
|
|
|
|
$bp-xxsmall-up: breakpoint(min-width, em($screen-xxsmall+1px, $_base-font-size));
|
|
$bp-small-up: breakpoint(min-width, em($screen-small+1px, $_base-font-size));
|
|
$bp-medium-up: breakpoint(min-width, em($screen-medium+1px, $_base-font-size));
|
|
$bp-large-up: breakpoint(min-width, em($screen-large+1px, $_base-font-size));
|
|
$bp-largeplus-up: breakpoint(min-width, em($screen-largeplus+1px, $_base-font-size));
|
|
|
|
|
|
|
|
|