692 lines
12 KiB
SCSS
692 lines
12 KiB
SCSS
/* les surcharges de chaque site dans un plugin indépendant */
|
||
body {
|
||
font-family:$typo-Merriweather;
|
||
font-size:0.9rem;
|
||
font-weight:200;
|
||
line-height:1.7;
|
||
}
|
||
|
||
.page_container {
|
||
max-width:1068px;
|
||
}
|
||
|
||
|
||
a {
|
||
|
||
&.tp {
|
||
background:none !important;
|
||
padding:0;
|
||
color:$couleurPrincipale;
|
||
position:relative;
|
||
border:0 !important;
|
||
font-weight:700;
|
||
text-decoration:none;
|
||
&:before {
|
||
content:'' !important;
|
||
display:inline-block !important;
|
||
position:absolute;
|
||
bottom:-0.5em;
|
||
left:0;
|
||
min-width:18px;
|
||
padding-bottom: 10px;
|
||
background-image:radial-gradient(circle, $couleurSecondaire 2px, rgba(255,255,255,0) 2px);
|
||
background-position: bottom left;
|
||
background-size: 6px 4px;
|
||
background-repeat: repeat-x;
|
||
}
|
||
&:hover, &:focus, &.on {
|
||
color:$couleurSecondaire;
|
||
&:before {
|
||
background-image:radial-gradient(circle, $couleurSecondaire 2px, rgba(255,255,255,0) 2px);
|
||
background-position: bottom left;
|
||
background-size: 14px 4px;
|
||
background-repeat: repeat-x;
|
||
min-width:70px;
|
||
left:-4px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
|
||
@mixin gradient-4 ($couleur1: #007682,$couleur2: $couleurConnex 7.5%,$couleur3: $couleurConnex 92.5%,$couleur4: #007884) {
|
||
background: -webkit-linear-gradient($couleur1,$couleur2,$couleur3,$couleur4);
|
||
background: -moz-linear-gradient($couleur1,$couleur2,$couleur3,$couleur4);
|
||
background: -ms-linear-gradient($couleur1,$couleur2,$couleur3,$couleur4);
|
||
background: -o-linear-gradient($couleur1,$couleur2,$couleur3,$couleur4);
|
||
}
|
||
|
||
|
||
|
||
//
|
||
// modele bouton
|
||
//
|
||
.btn {
|
||
@include bouton();
|
||
&.right {
|
||
float:right;
|
||
margin-left:$spacer;
|
||
}
|
||
&.left {
|
||
float:left;
|
||
margin-right:$spacer;
|
||
}
|
||
}
|
||
|
||
//
|
||
// modele themes = liste de mots-clefs
|
||
.liste.liste_mots {
|
||
.tri {
|
||
a {
|
||
text-decoration:underline;
|
||
}
|
||
}
|
||
.listes {
|
||
display:flex;
|
||
flex-wrap:wrap;
|
||
> ul {
|
||
width:25%;
|
||
margin:0;
|
||
list-style:none;
|
||
@include media($bp-small) {
|
||
width:50%;
|
||
}
|
||
}
|
||
li {
|
||
margin: 0 1.5em 0.2em 0;
|
||
a {
|
||
line-height:1.1;
|
||
display:block;
|
||
padding:0.3rem 0;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
/* blocs */
|
||
.page_header .header_initiatives, .page_header .header_initiatives .nav, .btn-nav, .page_header .header_initiatives .btn-initiatives {
|
||
@include gradient-4($couleurPrincipale,$couleurPrincipale,$couleurPrincipale,#184f5e);
|
||
opacity:1;
|
||
}
|
||
.nav {
|
||
a {
|
||
padding-bottom: 10px;
|
||
border:0;
|
||
background-position: bottom left;
|
||
background-size: 6px 4px;
|
||
background-repeat: repeat-x;
|
||
&.on, &:hover, &:focus {
|
||
background-image:radial-gradient(circle, $couleurSecondaire 2px, rgba(255,255,255,0) 2px);
|
||
}
|
||
}
|
||
}
|
||
.page_connex {
|
||
background:$couleurConnex;
|
||
@include gradient-4();
|
||
color:#fff;
|
||
padding:($spacer*2) 0;
|
||
h2 {
|
||
margin-bottom:($spacer);
|
||
color: lighten(desaturate($couleurConnex,40%),48%)/*#C5EBF0*/;
|
||
line-height: inherit;
|
||
font-size: 1.1em;
|
||
font-weight: 200;
|
||
}
|
||
.liste_articles {
|
||
position:relative;
|
||
font-size:120%;
|
||
margin-bottom:($spacer*3);
|
||
&:last-child {
|
||
margin-bottom:0;
|
||
}
|
||
.article-resume.block-link-parent {
|
||
margin-bottom:0;
|
||
border: 0;
|
||
background: none;
|
||
color: white;
|
||
padding:$spacer 0 0;
|
||
}
|
||
.article-resume__texte {
|
||
padding-top:($spacer/2);
|
||
color: white;
|
||
border-top:1px solid lighten(desaturate($couleurConnex,50%),30%);
|
||
}
|
||
.article-resume__date {
|
||
top:0;
|
||
left:0;
|
||
}
|
||
.article-resume .article-resume__titre {
|
||
font-size:1.2rem;
|
||
line-height:1.4;
|
||
a {
|
||
color:white;
|
||
&:hover {
|
||
color:$couleur-texte;
|
||
}
|
||
}
|
||
}
|
||
.article-resume__intro, .article-resume__soustitre {
|
||
color:white;
|
||
font-size:0.9rem;
|
||
}
|
||
.spip_logo, .tp {
|
||
@include visuallyhidden;
|
||
}
|
||
.btn {
|
||
position:absolute;
|
||
right:0;
|
||
top:($spacer/3);
|
||
background:none;
|
||
color:white;
|
||
font-size:0.8rem;
|
||
&:focus {
|
||
background:transparent !important;
|
||
color:lighten(desaturate($couleurConnex,50%),30%);
|
||
}
|
||
}
|
||
@include media($bp-medium-up){
|
||
> div {
|
||
@include flex();
|
||
@include vendor-prefix(flex-direction,raw);
|
||
@include vendor-prefix(justify-content,space-between);
|
||
> * {
|
||
width:30%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
.page_footer {
|
||
|
||
.page_connexplus {
|
||
padding:($spacer*1.5) 0;
|
||
background:$couleurConnexplus;
|
||
color:$couleur-titres;
|
||
margin-bottom:($spacer*1.5);
|
||
.liste.liste_mots {
|
||
h2 {
|
||
/* color:$couleur-lien; */
|
||
}
|
||
.listes {
|
||
> ul {
|
||
font-size:0.85rem;
|
||
}
|
||
li {
|
||
a {
|
||
line-height:1.1;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
padding-top:0;
|
||
.formulaire_spip.formulaire_recherche {
|
||
display:none;// pour ne pas surcharger tout le footer
|
||
}
|
||
}
|
||
|
||
|
||
// layout
|
||
.page_content {
|
||
margin-bottom:$spacer*2;
|
||
.composition_sanscolonne & {
|
||
margin-right:0;
|
||
}
|
||
}
|
||
|
||
|
||
|
||
// page sommaire
|
||
.page_sommaire {
|
||
.page_content {
|
||
margin-right:0;
|
||
.liste_articles {
|
||
.btn.voirtous {
|
||
display: block;
|
||
width: 300px;
|
||
margin:0 auto;
|
||
padding:1.5rem;
|
||
box-shadow:6px 6px 6px #90abb3;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.texte_accueil {
|
||
line-height: 1.6;
|
||
margin-bottom:$spacer;
|
||
font-family:$typo-Merriweather;
|
||
font-weight:200;
|
||
color:$couleur-lien;
|
||
@include clearfix();
|
||
@include flex();
|
||
.main {
|
||
max-width: 65%;
|
||
font-size: 1.6rem;
|
||
padding:$spacer ($spacer*4) $spacer 0;
|
||
.btn {
|
||
margin-bottom:2rem;
|
||
margin-right:2rem;
|
||
}
|
||
}
|
||
aside {
|
||
max-width:35%;
|
||
padding-top: $spacer;
|
||
}
|
||
@media ($bp-medium) {
|
||
flex-direction:column;
|
||
.main, aside {
|
||
max-width:100%;
|
||
padding:$spacer;
|
||
font-size:1.2rem;
|
||
.modele_citation .citation_texte {
|
||
font-size:1.2rem;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.formulaire_spip.formulaire_recherche {
|
||
font-size:1rem;
|
||
form {
|
||
border:0;
|
||
box-shadow: inset 0 0 5px 0px rgba(10,115,141, 0.7);
|
||
}
|
||
}
|
||
|
||
/* page blog */
|
||
.rubrique-blog {
|
||
|
||
}
|
||
|
||
|
||
|
||
.cartouche .publication {
|
||
@include visuallyhidden;
|
||
}
|
||
.liste.articles {
|
||
.liste-items {
|
||
margin-left:0;
|
||
list-style:none;
|
||
}
|
||
&.blog {
|
||
|
||
|
||
// resume
|
||
.article-resume {
|
||
border-left:0;
|
||
background-color:transparent;
|
||
padding:1.5rem 0 0;
|
||
margin-bottom:($spacer*2);
|
||
.article-resume__texte {
|
||
border-top:1px solid $couleurBordureBleue;
|
||
}
|
||
.article-resume__titre {
|
||
/* font-size: 1.4rem; */
|
||
/* line-height: 1.6; */
|
||
}
|
||
.hero .article-resume__titre {
|
||
/* font-size:1.8rem; */
|
||
}
|
||
.article-resume__soustitre {
|
||
/* font-weight:700; */
|
||
/* margin:0; */
|
||
}
|
||
.article-resume__logo {
|
||
}
|
||
.article-resume__date {
|
||
top:0.2rem;
|
||
left:0;
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
|
||
// resume
|
||
.article-resume {
|
||
display:block;
|
||
border-left:solid $couleurConnexplus ($spacer/3);
|
||
background-color:$couleurBkgT;
|
||
padding:($spacer*2.5) $spacer $spacer ($spacer*1.5);
|
||
margin-bottom:($spacer*2);
|
||
|
||
&, a {
|
||
color:$couleur-lien-resume;
|
||
}
|
||
&:after {
|
||
content:'';
|
||
display:block;
|
||
clear:both;
|
||
}
|
||
.article-resume__titre {
|
||
font-size: 1.4rem;
|
||
line-height: 1.6;
|
||
}
|
||
&.hero .article-resume__titre {
|
||
font-size:1.8rem;
|
||
}
|
||
.article-resume__soustitre {
|
||
font-weight:700;
|
||
margin:0;
|
||
}
|
||
.article-resume__logo {
|
||
float:right;
|
||
margin:-($spacer*1.5) 0 0 ($spacer * 1.5);
|
||
max-width:30%;
|
||
width:auto;
|
||
}
|
||
.article-resume__date {
|
||
position:absolute;
|
||
top:($spacer/2);
|
||
/* left:($spacer*1.5); */
|
||
font-size:0.75rem;
|
||
.aside & {
|
||
left:$spacer;
|
||
}
|
||
&:before {
|
||
display:none;
|
||
}
|
||
}
|
||
.article-auteurs {
|
||
font-size:110%;
|
||
font-weight:700;
|
||
}
|
||
}
|
||
.article-appel {
|
||
border-left:solid $couleurBordureBleue ($spacer/4);
|
||
padding:0 0 0 ($spacer);
|
||
.soustitre {
|
||
margin:0;
|
||
}
|
||
}
|
||
|
||
// composition
|
||
.composition_transcriptions {
|
||
.page_content {
|
||
margin-right:0;
|
||
article {
|
||
padding:($spacer*2.5) ($spacer*2) $spacer;
|
||
background-color:$couleurBkgT;
|
||
border-radius:0 0 6px 6px;
|
||
@include media($bp-medium-up) {
|
||
padding:($spacer*2.5) ($spacer*4) $spacer;
|
||
}
|
||
.avertissement {
|
||
background:$couleurBkgAvertissement;
|
||
margin-bottom:-$spacer;
|
||
margin-top:0;
|
||
border-radius:0 0 6px 6px;
|
||
}
|
||
&.import {
|
||
.main {
|
||
.strong_to_dl {
|
||
@include clearfix;
|
||
&:first-of-type:before {
|
||
content:'Média d’origine';
|
||
display:block;
|
||
@extend .h2;
|
||
dt {
|
||
clear:both;
|
||
float:left;
|
||
margin-right:$spacer/2;
|
||
}
|
||
dd {
|
||
margin:0;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.liste_articles article {
|
||
padding:($spacer*2.5) $spacer $spacer ($spacer*2);
|
||
@include media($bp-medium-up) {
|
||
padding:($spacer*2.5) $spacer $spacer ($spacer*4);
|
||
}
|
||
}
|
||
.article__texte br + b {
|
||
display: block;
|
||
margin-top: 1em;
|
||
}
|
||
}
|
||
.article__infos {
|
||
position:relative;
|
||
height:auto;
|
||
width:auto;
|
||
overflow:auto;
|
||
clip: auto;
|
||
clip-path: border-box;
|
||
}
|
||
footer {
|
||
.btn {
|
||
margin:($spacer*2) 0;
|
||
}
|
||
}
|
||
}
|
||
.article__transcription_origine, .avertissement, .import .main .strong_to_dl:first-of-type {
|
||
/* width:100%; */
|
||
margin:($spacer*2) -($spacer*2) 0;
|
||
padding:($spacer*2);
|
||
background:$couleurBkgTOrigine;
|
||
color:$couleurTDetails;
|
||
@include media($bp-medium-up) {
|
||
margin:($spacer*2) -($spacer*4) 0;
|
||
padding:($spacer*2) ($spacer*4);
|
||
}
|
||
> *:last-child {
|
||
margin-bottom:0;
|
||
}
|
||
dt {
|
||
float:left;
|
||
margin-right:($spacer/2);
|
||
}
|
||
dd {
|
||
margin:0;
|
||
min-height:1.3rem;
|
||
border-bottom:1px solid $couleurBkgT;
|
||
&:last-child {
|
||
border:0;
|
||
}
|
||
}
|
||
}
|
||
.fiches_personnes {
|
||
@include flex();
|
||
@include vendor-prefix(justify-content,space-between);
|
||
margin:($spacer*4) 0 0;
|
||
font-family:$typo-Merriweather;
|
||
.fiche {
|
||
width:46%;
|
||
}
|
||
.spip_logo {
|
||
float: left;
|
||
margin-right: $spacer;
|
||
}
|
||
p {
|
||
margin:0;
|
||
}
|
||
.fiche__titre {
|
||
font-weight:700;
|
||
}
|
||
.fiche__texte {
|
||
font-size:0.8rem;
|
||
clear:both;
|
||
}
|
||
}
|
||
|
||
|
||
.cartouche {
|
||
border-left:($spacer/2) solid $couleurBkgTOrigine;
|
||
padding-left:($spacer*1.5);
|
||
.composition_transcriptions & {
|
||
margin-left:-($spacer*2);
|
||
}
|
||
@include clearfix;
|
||
.spip_logo {
|
||
float:right;
|
||
border:1px solid $couleurBordureBleue;
|
||
}
|
||
}
|
||
.mots {
|
||
font-size:0.7rem;
|
||
@include clearfix;
|
||
&:before {
|
||
border-top:1px solid $couleurBkgTOrigine;
|
||
}
|
||
&:last-child {
|
||
border-bottom:1px solid $couleurBkgTOrigine;
|
||
}
|
||
a {
|
||
display:inline-block;
|
||
background:#fff;
|
||
border-radius:($spacer/3);
|
||
padding:0 ($spacer/1.5);
|
||
border: 1px solid lighten($couleurBkgTOrigine,12);
|
||
font-size:0.9em;
|
||
margin: 0.2em 0.05em;
|
||
line-height: 2em;
|
||
&:hover {
|
||
background:$couleurSecondaire;
|
||
color:#fff;
|
||
text-decoration:none;
|
||
}
|
||
}
|
||
}
|
||
|
||
// article
|
||
.article__soustitre {
|
||
display:block;
|
||
font-size:1rem;
|
||
}
|
||
.nav-sommaire-1 {
|
||
display:block;
|
||
}
|
||
.nav-sommaire {
|
||
border:0;
|
||
margin:($spacer*2) 0;
|
||
.sommaire_titre {
|
||
font-size:0.8rem;
|
||
@include bouton();
|
||
&.plein {
|
||
border-radius:0;
|
||
}
|
||
&.on .fas {
|
||
&:before {
|
||
content:'\f0d7';
|
||
}
|
||
}
|
||
}
|
||
> ul {
|
||
background-color: $couleurPrincipale;
|
||
margin-left:0;
|
||
padding:1em 2.5em;
|
||
list-style-type: decimal;
|
||
color: #FFF;
|
||
font-size: 0.8em;
|
||
ul {
|
||
margin-left: 2.5em;
|
||
}
|
||
a.spip_ancre {
|
||
color:white;
|
||
display:inline-block;
|
||
width:100%;
|
||
border-bottom: 1px solid $couleurBordureBleue;
|
||
line-height: 2em;
|
||
&:hover {
|
||
text-decoration:none;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.article__notes {
|
||
border-top:1px solid $couleurBkgTOrigine;
|
||
padding:$spacer;
|
||
clear:both;
|
||
}
|
||
|
||
.formulaire_signaler {
|
||
|
||
}
|
||
.ariaformprop {
|
||
clear:both;
|
||
}
|
||
|
||
|
||
// page_mot
|
||
.page_mot {
|
||
.page_content {
|
||
margin-right:0;
|
||
}
|
||
}
|
||
|
||
|
||
|
||
|
||
/* modeles */
|
||
/* citation */
|
||
.modele_citation {
|
||
@include clearfix();
|
||
.citation_texte {
|
||
background:$couleurBkgBleu;
|
||
border-radius:$spacer/2;
|
||
padding:$spacer;
|
||
font-size:1.15rem;
|
||
color:$couleur-lien;
|
||
}
|
||
.citation_image {
|
||
float:right;
|
||
position:relative;
|
||
margin-top:10px;
|
||
padding-left:46px;
|
||
&:after {
|
||
display:block; content:''; width:0; height:0;
|
||
position:absolute; left:0; top:-32px;
|
||
border-top: 60px solid $couleurBkgBleu;
|
||
border-left: 20px solid transparent;
|
||
border-right: 10px solid transparent;
|
||
border-bottom: 0;
|
||
@include rotate(-50deg);
|
||
z-index:0;
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
.fond {
|
||
padding:($spacer*1.5);
|
||
margin:($spacer*2) 0;
|
||
&.lienstp a {
|
||
@extend .tp;
|
||
display:inline-block;
|
||
margin-bottom:1.5em;
|
||
}
|
||
div > &:first-child {
|
||
margin-top:0;
|
||
}
|
||
}
|
||
.fondbleu {
|
||
background:$couleurBkgBleu;
|
||
}
|
||
.fondbeige {
|
||
background:$couleurBkgBeige;
|
||
}
|
||
|
||
|
||
.periode {
|
||
color:$couleurBordureBleue;
|
||
.annees {
|
||
color:$couleur-lien;
|
||
}
|
||
}
|
||
|
||
|
||
|