mauve et jaune bis

This commit is contained in:
tierce (Thierry Fenasse) 2022-08-02 17:28:04 +02:00
parent 9a15481ba8
commit 873b526398
Signed by: tierce
GPG Key ID: 56BF2A3A07DDEB1F
11 changed files with 192 additions and 1207 deletions

View File

@ -13,9 +13,11 @@
<BOUCLE_ariane(HIERARCHIE){id_article}> &gt;
<a href="#URL_RUBRIQUE">[(#TITRE|couper{80})]</a>
</BOUCLE_ariane>[ &gt; <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>

View File

@ -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
View 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; }

View File

@ -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
View 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
View 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
View 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

File diff suppressed because it is too large Load Diff

View File

@ -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
*/

View File

@ -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&nbsp;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>

View File

@ -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>