139 lines
2.0 KiB
SCSS
139 lines
2.0 KiB
SCSS
$font-extra: 2.3rem;
|
|
$font-large: 1.6rem;
|
|
$font-big: 1rem;
|
|
$font-medium: .8rem;
|
|
$font-normal: .6rem;
|
|
$font-small: .45rem;
|
|
|
|
$col-met: #28429f;
|
|
$col-eur: #646578;
|
|
$col-mond: #ab9569;
|
|
$col-ter: #e01a35;
|
|
$col-1: #4dabc1;
|
|
$col-2: #61ab32;
|
|
|
|
$bck-col: #eff2f9;
|
|
$lightblue: #98d0d9;
|
|
$trame: url(../images/motif_croix.svg);
|
|
|
|
//programmes values
|
|
.programme-2{
|
|
.views-field-field-programme{
|
|
.field-content{
|
|
background: $col-1;
|
|
}
|
|
|
|
}
|
|
.views-field{
|
|
color: $col-1;
|
|
}
|
|
.views-field-title{
|
|
color: $col-1;
|
|
&:hover{
|
|
background: $col-1;
|
|
color:white;
|
|
}
|
|
}
|
|
}
|
|
|
|
.programme-3{
|
|
.views-field-field-programme{
|
|
.field-content{
|
|
background: $col-eur;
|
|
}
|
|
}
|
|
.views-field{
|
|
color: $col-eur;
|
|
}
|
|
.views-field-title{
|
|
color: $col-eur;
|
|
&:hover{
|
|
background: $col-eur;
|
|
color:white;
|
|
}
|
|
}
|
|
}
|
|
|
|
.programme-4{
|
|
.views-field-field-programme{
|
|
.field-content{
|
|
background: $col-2;
|
|
}
|
|
}
|
|
.views-field{
|
|
color: $col-2;
|
|
}
|
|
.views-field-title{
|
|
color: $col-2;
|
|
&:hover{
|
|
background: $col-2;
|
|
color:white;
|
|
}
|
|
}
|
|
}
|
|
|
|
.programme-5{
|
|
.views-field-field-programme{
|
|
.field-content{
|
|
background: $col-mond;
|
|
}
|
|
}
|
|
.views-field{
|
|
color: $col-mond;
|
|
}
|
|
.views-field-title{
|
|
color: $col-mond;
|
|
&:hover{
|
|
background: $col-mond;
|
|
color:white;
|
|
}
|
|
}
|
|
}
|
|
.programme-7{
|
|
.views-field-field-programme{
|
|
.field-content{
|
|
background: $col-met;
|
|
}
|
|
}
|
|
.views-field{
|
|
color: $col-met;
|
|
}
|
|
.views-field-title{
|
|
color: $col-met;
|
|
&:hover{
|
|
background: $col-met;
|
|
color:white;
|
|
}
|
|
}
|
|
}
|
|
.programme-6{
|
|
.views-field-field-programme{
|
|
.field-content{
|
|
background: $col-ter;
|
|
}
|
|
}
|
|
.views-field{
|
|
color: $col-ter;
|
|
}
|
|
.views-field-title{
|
|
color: $col-ter;
|
|
&:hover{
|
|
background: $col-ter;
|
|
color:white;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (min-width: 48rem) {
|
|
:root {
|
|
font-size: calc(1rem + ((1vw - .48rem) * 1.389));
|
|
/* .48rem = viewportWidthMinimum /100 */
|
|
/* 1.389rem = 100 * fontSizeDifference / viewportWidthDifference */
|
|
}
|
|
}
|
|
|
|
@media (min-width: 120em) {
|
|
:root {
|
|
font-size: 2rem;
|
|
}
|
|
} |