Différences entre versions de « Common.css »
De FNEEQ - 50 ans à faire école par nos luttes
(49 versions intermédiaires par 2 utilisateurs non affichées) | |||
Ligne 1 : | Ligne 1 : | ||
− | /* Le CSS placé ici sera appliqué à tous les habillages. */ | + | /* Le CSS placé ici sera appliqué à tous les habillages; comme un seul habillage est configuré (Pivot), il y a quelques éléments spécifiques à celui-ci (comme #p-cactions, sidebar, tab-bar, etc.) */ |
+ | /* Chargement de polices via Google Fonts */ | ||
+ | /* https://www.mediawiki.org/wiki/Customizing_MediaWiki_for_beginners */ | ||
+ | @import url("https://fonts.googleapis.com/css?family=Cardo|Open+Sans+Condensed:300,700|Open+Sans:400,700&display=swap") | ||
− | + | /* Mettre la barre latérale en bleu */ | |
+ | body { | ||
+ | background-color: #bbdee7; | ||
+ | } | ||
+ | /* Mettre le texte principal à Cardo */ | ||
+ | #p-cactions { | ||
+ | font-family: 'Cardo', serif; | ||
+ | background-color: #F8F8F8; | ||
+ | } | ||
− | body {font- | + | /* Agrandir un peu la police sur les écrans desktop */ |
− | + | @media only screen and (min-width: 40.0625em) { | |
+ | body { | ||
+ | line-height: 1.6em; | ||
+ | font-size:16px | ||
+ | } | ||
+ | p, ul, ol, dl { | ||
+ | font-size:16px | ||
+ | } | ||
+ | } | ||
− | div#content h1, div#content h2 {font-family: 'Open Sans Condensed', sans-serif} | + | /* Changer les titres pour Open Sans Condensed Light */ |
− | /* | + | div#content h1, div#content h2 { |
+ | font-family: 'Open Sans Condensed', sans-serif; | ||
+ | font-weight:300; | ||
+ | } | ||
+ | |||
+ | /* Changer les titres pour Open Sans Condensed Light */ | ||
+ | h1.title, .title a span{ | ||
+ | font-family: 'Open Sans Condensed', sans-serif; | ||
+ | font-weight:300; | ||
+ | } | ||
+ | |||
+ | /* Agrandir les titres H1 */ | ||
+ | div#content h1{ | ||
+ | font-size: 2.5em; | ||
+ | } | ||
− | h4.namespace.label{ | + | /* Espacer un peu les H2 */ |
+ | div#content h2{ | ||
+ | margin-top:10px; | ||
+ | } | ||
+ | |||
+ | /* Titres H3 en Cardo */ | ||
+ | div#content h3{ | ||
+ | font-family: 'Cardo', serif; | ||
+ | } | ||
+ | |||
+ | /* Mettre les liens de la barre latérale en Open Sans */ | ||
+ | #sidebar ul li a{ | ||
+ | font-family: 'Open Sans', sans-serif; | ||
+ | } | ||
+ | |||
+ | /* Mettre les étiquettes de la barre latérale en violet avec texte en noir */ | ||
+ | ul.side-nav label{ | ||
+ | background: #dbb8d7; | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | /* Changer le slogan sur les petits écrans */ | ||
+ | span.show-for-small-only{ | ||
+ | visibility:hidden; | ||
+ | } | ||
+ | span.show-for-small-only:after{ | ||
+ | content: 'FNEEQ - 50 ans'; | ||
+ | visibility: visible; | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | padding: 0px; | ||
+ | top: 1px; | ||
+ | } | ||
+ | |||
+ | /* Mettre les étiquettes (barre latérale et contenu) en Open Sans */ | ||
+ | h4.namespace.label, .sidebar{ | ||
font-family: 'Open Sans Condensed', sans-serif; | font-family: 'Open Sans Condensed', sans-serif; | ||
font-weight:bold; | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | /* Mettre la barre d'en-tête en violet */ | ||
+ | .tab-bar{ | ||
+ | background: #dbb8d7; | ||
+ | } | ||
+ | |||
+ | /* Mettre le titre d'en-tête en noir */ | ||
+ | .title a span, #menu-user i{ | ||
+ | color:#000000; | ||
+ | } | ||
+ | |||
+ | /* Mettre le titre d'en-tête en gris foncé lorsqu'en état "hover" */ | ||
+ | .title a:hover span{ | ||
+ | color:#222222; | ||
+ | } | ||
+ | |||
+ | /* Mettre les étiquettes dans le contenu en orange */ | ||
+ | h4.namespace.label{ | ||
+ | background: #d58e6e; | ||
+ | } | ||
+ | |||
+ | /* Menu utilisateur qui glisse de la droite */ | ||
+ | /* Mettre l'étiquette du haut en taupe */ | ||
+ | ul.off-canvas-list li label{ | ||
+ | background: #d18f75; | ||
+ | } | ||
+ | |||
+ | /* Mettre le fond en jaune */ | ||
+ | .right-off-canvas-menu, .left-off-canvas-menu{ | ||
+ | background: #ffeea5; | ||
+ | } | ||
+ | |||
+ | /* Mettre le texte en noir */ | ||
+ | ul.off-canvas-list li a{ | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | /* Mettre le fond en orange en état "hover", avec texte en blanc */ | ||
+ | ul.off-canvas-list li a:hover{ | ||
+ | background: #d58e6e; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | |||
+ | /* emmanuel 2020-08-02 */ | ||
+ | /* Donner un peu d'espace aux images alignées sur la droite */ | ||
+ | div.thumb.tright{ | ||
+ | margin-left: 50px; | ||
+ | margin-top: 50px; | ||
+ | margin-bottom: 50px; | ||
+ | } | ||
+ | |||
+ | div.thumbcaption{ | ||
+ | font-size: small; | ||
+ | font-style: italic; | ||
} | } |
Version actuelle datée du 2 août 2020 à 08:23
/* Le CSS placé ici sera appliqué à tous les habillages; comme un seul habillage est configuré (Pivot), il y a quelques éléments spécifiques à celui-ci (comme #p-cactions, sidebar, tab-bar, etc.) */ /* Chargement de polices via Google Fonts */ /* https://www.mediawiki.org/wiki/Customizing_MediaWiki_for_beginners */ @import url("https://fonts.googleapis.com/css?family=Cardo|Open+Sans+Condensed:300,700|Open+Sans:400,700&display=swap") /* Mettre la barre latérale en bleu */ body { background-color: #bbdee7; } /* Mettre le texte principal à Cardo */ #p-cactions { font-family: 'Cardo', serif; background-color: #F8F8F8; } /* Agrandir un peu la police sur les écrans desktop */ @media only screen and (min-width: 40.0625em) { body { line-height: 1.6em; font-size:16px } p, ul, ol, dl { font-size:16px } } /* Changer les titres pour Open Sans Condensed Light */ div#content h1, div#content h2 { font-family: 'Open Sans Condensed', sans-serif; font-weight:300; } /* Changer les titres pour Open Sans Condensed Light */ h1.title, .title a span{ font-family: 'Open Sans Condensed', sans-serif; font-weight:300; } /* Agrandir les titres H1 */ div#content h1{ font-size: 2.5em; } /* Espacer un peu les H2 */ div#content h2{ margin-top:10px; } /* Titres H3 en Cardo */ div#content h3{ font-family: 'Cardo', serif; } /* Mettre les liens de la barre latérale en Open Sans */ #sidebar ul li a{ font-family: 'Open Sans', sans-serif; } /* Mettre les étiquettes de la barre latérale en violet avec texte en noir */ ul.side-nav label{ background: #dbb8d7; color: #000000; } /* Changer le slogan sur les petits écrans */ span.show-for-small-only{ visibility:hidden; } span.show-for-small-only:after{ content: 'FNEEQ - 50 ans'; visibility: visible; display: block; position: absolute; padding: 0px; top: 1px; } /* Mettre les étiquettes (barre latérale et contenu) en Open Sans */ h4.namespace.label, .sidebar{ font-family: 'Open Sans Condensed', sans-serif; font-weight:bold; } /* Mettre la barre d'en-tête en violet */ .tab-bar{ background: #dbb8d7; } /* Mettre le titre d'en-tête en noir */ .title a span, #menu-user i{ color:#000000; } /* Mettre le titre d'en-tête en gris foncé lorsqu'en état "hover" */ .title a:hover span{ color:#222222; } /* Mettre les étiquettes dans le contenu en orange */ h4.namespace.label{ background: #d58e6e; } /* Menu utilisateur qui glisse de la droite */ /* Mettre l'étiquette du haut en taupe */ ul.off-canvas-list li label{ background: #d18f75; } /* Mettre le fond en jaune */ .right-off-canvas-menu, .left-off-canvas-menu{ background: #ffeea5; } /* Mettre le texte en noir */ ul.off-canvas-list li a{ color: #000000; } /* Mettre le fond en orange en état "hover", avec texte en blanc */ ul.off-canvas-list li a:hover{ background: #d58e6e; color: #ffffff; } /* emmanuel 2020-08-02 */ /* Donner un peu d'espace aux images alignées sur la droite */ div.thumb.tright{ margin-left: 50px; margin-top: 50px; margin-bottom: 50px; } div.thumbcaption{ font-size: small; font-style: italic; }