mauve et jaune bis
This commit is contained in:
parent
9a15481ba8
commit
873b526398
|
@ -13,9 +13,11 @@
|
|||
<BOUCLE_ariane(HIERARCHIE){id_article}> >
|
||||
<a href="#URL_RUBRIQUE">[(#TITRE|couper{80})]</a>
|
||||
</BOUCLE_ariane>[ > <strong class="on">(#TITRE|couper{80})</strong>]
|
||||
<br/>
|
||||
[(#LESAUTEURS)][, le (#DATE|affdate)][, modifié le (#DATE_MODIF|affdate)]
|
||||
</p>
|
||||
|
||||
[(#TEXTE|image_reduire{672,*})]
|
||||
[(#LESAUTEURS)][, le (#DATE|affdate)][, modifié le (#DATE_MODIF|affdate)]
|
||||
</BOUCLE_principale>
|
||||
|
||||
</section>
|
||||
|
|
|
@ -1,96 +1,48 @@
|
|||
/* classes */
|
||||
/* .classes
|
||||
*/
|
||||
|
||||
.smaller {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
font-size: 1.2rem; }
|
||||
|
||||
.hide
|
||||
{
|
||||
visibility: hidden;
|
||||
}
|
||||
.hide {
|
||||
visibility: hidden; }
|
||||
|
||||
.right
|
||||
{
|
||||
float: right;
|
||||
}
|
||||
.right {
|
||||
float: right; }
|
||||
|
||||
.left
|
||||
{
|
||||
float: left;
|
||||
}
|
||||
.left {
|
||||
float: left; }
|
||||
|
||||
.white
|
||||
{
|
||||
color: white;
|
||||
}
|
||||
/* elements.classes
|
||||
*/
|
||||
|
||||
.yellow
|
||||
{
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
a.button
|
||||
{
|
||||
a.button {
|
||||
display:inline-block;
|
||||
padding:0.35em 1.2em;
|
||||
/* border:0.1em solid magenta; */
|
||||
/* border:0.1em solid magenta; */
|
||||
margin:0 0.3em 0.3em 0;
|
||||
border-radius:0.12em;
|
||||
box-sizing: border-box;
|
||||
text-decoration:none;
|
||||
color: lightgreen;
|
||||
color: var(--cliquable);
|
||||
text-align:center;
|
||||
transition: all 0.2s;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
font-size: 1.5rem; }
|
||||
|
||||
a.button > i
|
||||
{
|
||||
a.button > i {
|
||||
padding-right: 0.5em;
|
||||
color: yellow;
|
||||
}
|
||||
color: var(--icones); }
|
||||
|
||||
a.button:hover, a:hover
|
||||
{
|
||||
color:#0F0F0F;
|
||||
background-color: lightgreen;
|
||||
}
|
||||
a.button:hover, a:hover {
|
||||
color: var(--fond);
|
||||
background-color: var(--cliquable); }
|
||||
|
||||
a.button:hover > i
|
||||
{
|
||||
a.button:hover > i {
|
||||
padding-right: 0.5em;
|
||||
color: #0F0F0F;
|
||||
}
|
||||
color: var(--fond); }
|
||||
|
||||
hr.title {
|
||||
border: 0.3rem solid red;
|
||||
}
|
||||
border: 0.3rem solid var(--rupture); }
|
||||
|
||||
#footer
|
||||
{
|
||||
color:red;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
img.reduce
|
||||
{
|
||||
width: 15rem;
|
||||
}
|
||||
|
||||
/* for smaller screens transformations */
|
||||
@media (max-width: 1024px)
|
||||
{
|
||||
|
||||
a.button
|
||||
{
|
||||
padding:0.35em 0.1em;
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
a.button > i
|
||||
{
|
||||
padding-right: 0.3em;
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
}
|
||||
img.reduce {
|
||||
width: 15rem; }
|
||||
|
|
73
css/elements.css
Normal file
73
css/elements.css
Normal file
|
@ -0,0 +1,73 @@
|
|||
/* Élements HTML
|
||||
*/
|
||||
|
||||
/* Simples
|
||||
*/
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: var(--cliquable); }
|
||||
|
||||
body {
|
||||
background-color: var(--fond);
|
||||
font-family: OpenDyslexic;
|
||||
color: var(--principal); }
|
||||
|
||||
code {
|
||||
background-color: var(--fond);
|
||||
color: var(--terminal); }
|
||||
|
||||
h1 {
|
||||
font-size: 3rem;
|
||||
color: var(--titres); }
|
||||
|
||||
h2 {
|
||||
font-size: 2rem;
|
||||
color: var(--titres); }
|
||||
|
||||
h3 {
|
||||
font-size: 1.5rem;
|
||||
color: var(--titres); }
|
||||
|
||||
hr {
|
||||
border: 0.3rem solid var(--titres);
|
||||
border-radius: 0.5rem; }
|
||||
|
||||
img {
|
||||
height: auto; }
|
||||
|
||||
pre {
|
||||
padding-left: 1%;
|
||||
background-color: var(--fond);
|
||||
overflow:auto;
|
||||
/* Hide scrollbar for IE, Edge and Firefox */
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */ }
|
||||
|
||||
pre::-webkit-scrollbar {
|
||||
/* Hide scrollbar for Chrome, Safari and Opera */
|
||||
display: none; }
|
||||
|
||||
table {
|
||||
min-width: 80%; }
|
||||
|
||||
/* Multiples
|
||||
*/
|
||||
nav,
|
||||
section {
|
||||
max-width: 85%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 1rem;
|
||||
line-height: 3rem; }
|
||||
|
||||
p,
|
||||
table,
|
||||
ul {
|
||||
font-size: 1.5rem; }
|
||||
|
||||
code,
|
||||
pre {
|
||||
line-height: 2.1rem;
|
||||
font-family: courier;
|
||||
font-size: 1.5rem; }
|
||||
|
|
@ -1,105 +0,0 @@
|
|||
@import "Fork-Awesome/css/fork-awesome.min.css";
|
||||
@import "classes.css";
|
||||
@import "syntax.css";
|
||||
@import "pure-min.css";
|
||||
|
||||
/* fonts */
|
||||
@font-face
|
||||
{
|
||||
font-family: "OpenDyslexic";
|
||||
src: url("../polices/OpenDyslexic-Regular.eot");
|
||||
src: url("../polices/OpenDyslexic-Regular.woff") format("woff"),
|
||||
url("../polices/OpenDyslexic-Regular.ttf") format("truetype"),
|
||||
url("../polices/OpenDyslexic-Regular.svg") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
/* common html tags */
|
||||
body
|
||||
{
|
||||
background-color: #0F0F0F;
|
||||
font-family: OpenDyslexic;
|
||||
color: darkturquoise;
|
||||
}
|
||||
|
||||
section, nav{
|
||||
max-width: 85%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 1rem;
|
||||
line-height: 3rem;
|
||||
}
|
||||
|
||||
a
|
||||
{
|
||||
text-decoration: none;
|
||||
color: lightgreen;
|
||||
}
|
||||
|
||||
h1
|
||||
{
|
||||
font-size: 3rem;
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
h2
|
||||
{
|
||||
font-size: 2rem;
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
h3
|
||||
{
|
||||
font-size: 1.5rem;
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
hr
|
||||
{
|
||||
border: 0.3rem solid #bbb;
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
img
|
||||
{
|
||||
height: auto;
|
||||
}
|
||||
|
||||
p, ul, table
|
||||
{
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
table
|
||||
{
|
||||
min-width: 80%;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
line-height: 2.1rem;
|
||||
font-family: courier;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
/* for smaller screens transformations */
|
||||
@media (max-width: 1024px)
|
||||
{
|
||||
/* common html tags */
|
||||
body
|
||||
{
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
img
|
||||
{
|
||||
max-width: 90%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
p
|
||||
{
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
}
|
9
css/ids.css
Normal file
9
css/ids.css
Normal file
|
@ -0,0 +1,9 @@
|
|||
/* #ids
|
||||
*/
|
||||
#footer {
|
||||
color:var(--rupture);
|
||||
font-size: 1.5rem; }
|
||||
|
||||
#head h3 {
|
||||
color: var(--flashy); }
|
||||
|
34
css/medias.css
Normal file
34
css/medias.css
Normal file
|
@ -0,0 +1,34 @@
|
|||
/* Pour les transformations en fonction des médias d'affichage ou d'impression
|
||||
Essayons de suivre la même logique d'organisation pour
|
||||
- les éléments html
|
||||
- les ids
|
||||
- les classes
|
||||
*/
|
||||
|
||||
/* elements
|
||||
*/
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
|
||||
body {
|
||||
line-height: 1.8; }
|
||||
|
||||
img {
|
||||
max-width: 90%;
|
||||
height: auto; }
|
||||
|
||||
p {
|
||||
font-size: 2rem; }}
|
||||
|
||||
/* elements.classes
|
||||
*/
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
|
||||
a.button {
|
||||
padding:0.35em 0.1em;
|
||||
font-size: 2.5rem; }
|
||||
|
||||
a.button > i {
|
||||
padding-right: 0.3em;
|
||||
color: var(--icones); }}
|
42
css/principal.css
Normal file
42
css/principal.css
Normal file
|
@ -0,0 +1,42 @@
|
|||
/* fichiers importés
|
||||
*/
|
||||
@import "classes.css";
|
||||
@import "elements.css";
|
||||
@import "ids.css";
|
||||
@import "medias.css";
|
||||
@import "Fork-Awesome/css/fork-awesome.min.css";
|
||||
|
||||
|
||||
/* polices de caractère
|
||||
*/
|
||||
@font-face {
|
||||
font-family: "OpenDyslexic";
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
src: url("../polices/OpenDyslexic-Regular.eot");
|
||||
src: url("../polices/OpenDyslexic-Regular.woff") format("woff"),
|
||||
url("../polices/OpenDyslexic-Regular.ttf") format("truetype"),
|
||||
url("../polices/OpenDyslexic-Regular.svg") format("svg"); }
|
||||
|
||||
/* couleurs sous forme de variables
|
||||
|
||||
:root {
|
||||
--fond: #0F0F0F;
|
||||
--flashy: white;
|
||||
--icones: yellow;
|
||||
--cliquable: lightgreen;
|
||||
--principal: darkturquoise;
|
||||
--titres: #ccc;
|
||||
--terminal: #bbb;
|
||||
--rupture: #ff0000 }
|
||||
|
||||
*/
|
||||
:root {
|
||||
--fond: #0E0E0E;
|
||||
--flashy: gold;
|
||||
--icones: purple;
|
||||
--cliquable: yellowgreen;
|
||||
--principal: beige;
|
||||
--titres: blueviolet;
|
||||
--terminal: yellowgreen;
|
||||
--rupture: blueviolet }
|
1007
css/pure-min.css
vendored
1007
css/pure-min.css
vendored
File diff suppressed because it is too large
Load Diff
|
@ -1,17 +0,0 @@
|
|||
/* for the code highlight */
|
||||
|
||||
.highlight pre, code {
|
||||
background: #272822;
|
||||
color: #bbb;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* inspiration potentielle ?
|
||||
|
||||
- https://gist.github.com/demisx/025698a7b5e314a7a4b5
|
||||
- https://github.com/mkaz/code-syntax-block
|
||||
|
||||
*/
|
|
@ -1,7 +1,5 @@
|
|||
<section id="footer">
|
||||
|
||||
Copyleft <span class="fa fa-copyright fa-flip-horizontal"></span>
|
||||
<BOUCLE_annee(ARTICLES){par date}{0,1}>[(#DATE|annee|!={#VAL{Y}|date}|oui)[(#DATE|annee)]]</BOUCLE_annee> - </B_annee>[(#DATE|annee) ]#NOM_SITE_SPIP
|
||||
<a rel="contents" href="#URL_PAGE{plan}" class="first"><:plan_site:></a>[
|
||||
(#SESSION{id_auteur}|non) | <a href="[(#URL_PAGE{login}|parametre_url{url,#SELF})]" rel="nofollow" class='login_modal'><:lien_connecter:></a>][
|
||||
(#AUTORISER{ecrire})| <a href="#CONST{_DIR_RESTREINT_ABS}"><:espace_prive:></a>][
|
||||
|
@ -9,5 +7,8 @@
|
|||
<a rel="nofollow" href="#URL_PAGE{contact}"><:contact:></a> |
|
||||
<a href="#URL_PAGE{backend}" rel="alternate" title="<:syndiquer_site:>" class="last">RSS 2.0</a> |
|
||||
[<a href="https://www.spip.net/" rel="generator" title="<:site_realise_avec_spip:>">(#CHEMIN{spip.svg}|balise_svg{'',SPIP})</a>]
|
||||
<br/>
|
||||
Copyleft <span class="fa fa-copyright fa-flip-horizontal"></span>
|
||||
<BOUCLE_annee(ARTICLES){par date}{0,1}>[(#DATE|annee|!={#VAL{Y}|date}|oui)[(#DATE|annee)]]</BOUCLE_annee> - </B_annee>[(#DATE|annee) ]#NOM_SITE_SPIP
|
||||
|
||||
</section>
|
|
@ -34,7 +34,7 @@
|
|||
-->
|
||||
|
||||
[<link rel="stylesheet" href="(#CHEMIN{css/spip.css}|direction_css|timestamp)" type="text/css" />]
|
||||
[<link rel="stylesheet" href="(#CHEMIN{css/gnuragistes.css}|direction_css|timestamp)" type="text/css" />]
|
||||
[<link rel="stylesheet" href="(#CHEMIN{css/principal.css}|direction_css|timestamp)" type="text/css" />]
|
||||
|
||||
|
||||
[<link href="(#CHEMIN{images/zebras-favicon.png})" rel="shortcut icon" />]
|
||||
|
@ -43,6 +43,7 @@
|
|||
-->
|
||||
[<meta name="generator" content="SPIP (#SPIP_VERSION|header_silencieux)" />]
|
||||
<!--
|
||||
Fait-il vraiment affiché la version de spip utilisée ?
|
||||
Faut-il vraiment affiché la version de spip utilisée ?
|
||||
-->
|
||||
|
||||
</head>
|
||||
|
|
Loading…
Reference in New Issue
Block a user