|
|
| (2 versions intermédiaires par le même utilisateur non affichées) |
| Ligne 1 : |
Ligne 1 : |
| /*************************************************************** | | /* =============================================================== |
| ⚜️ THEME GLOBAL — ALFI ROYAL CSS ⚜️ | | ⚜️ STYLE GLOBAL ROYAL ALFI — Version 2026 |
| Association des Lignages de France et de l’International
| | =============================================================== */ |
| Style graphique : Monarchie spirituelle – Élégance française
| |
| Version 2.0 (avril 2026) – Trois thèmes : Clair / Impérial / Nocturne | |
| ****************************************************************/
| |
|
| |
|
| /* ======================= VARIABLES DE BASE ======================= */
| | #alfi-index { |
| :root { | | position: sticky; |
| --couleur-texte: #2a1b0a; | | top: 0; |
| --couleur-fond: #fffdf8; | | z-index: 100; |
| --doré: #d4af37; | | text-align: center; |
| --doré-clair: #f6e27f; | | background: #fffdf8e8; |
| --brun-foncé: #3b2a0b; | | backdrop-filter: blur(6px); |
| --fond-tableau: #f6ecd4; | | border-bottom: 2px solid #d4af37; |
| --fond-citation: #fefaf3; | | box-shadow: 0 3px 12px rgba(212,175,55,0.25); |
| | padding: 25px 15px; |
| | margin-bottom: 35px; |
| | font-family: 'EB Garamond','Garamond',serif; |
| } | | } |
|
| |
|
| /* ======================= THEME CLAIR ======================= */
| | .lettre-alfi { |
| .alfi-theme-clair { | | background: linear-gradient(180deg,#f8f2d0,#f6e27f); |
| --couleur-texte: #2a1b0a;
| | border: 1px solid #d4af37; |
| --couleur-fond: #fffdf8;
| | border-radius: 6px; |
| --doré: #d4af37;
| | padding: 7px 12px; |
| --doré-clair: #f6e27f;
| |
| --brun-foncé: #3b2a0b;
| |
| --fond-tableau: #f6ecd4;
| |
| --fond-citation: #fefaf3;
| |
| background-color: var(--couleur-fond); | |
| color: var(--couleur-texte);
| |
| }
| |
| | |
| /* ======================= THEME IMPERIAL ======================= */
| |
| .alfi-theme-imperial {
| |
| --couleur-texte: #3a260b;
| |
| --couleur-fond: #f8f5eb;
| |
| --doré: #c9a13d;
| |
| --doré-clair: #f5e6a0;
| |
| --brun-foncé: #31200a;
| |
| --fond-tableau: #f2e8cf;
| |
| --fond-citation: #fdf9ef;
| |
| background-color: var(--couleur-fond);
| |
| color: var(--couleur-texte);
| |
| }
| |
| | |
| /* ======================= THEME NOCTURNE ======================= */
| |
| .alfi-theme-nocturne {
| |
| --couleur-texte: #f6eecf;
| |
| --couleur-fond: #121014;
| |
| --doré: #d4af37; | |
| --doré-clair: #ffecb3; | |
| --brun-foncé: #f9f5dc; | |
| --fond-tableau: #1e1a22;
| |
| --fond-citation: #1a1620;
| |
| background-color: var(--couleur-fond);
| |
| color: var(--couleur-texte);
| |
| }
| |
| | |
| /* ======================= BASE TYPOGRAPHIQUE ======================= */
| |
| body, .alfi-theme-clair, .alfi-theme-imperial, .alfi-theme-nocturne {
| |
| font-family: "Crimson Pro", serif;
| |
| font-size: 17px; | | font-size: 17px; |
| line-height: 1.6; | | font-weight: bold; |
| margin: 0; | | color: #3a260b; |
| padding: 0; | | box-shadow: 0 0 5px rgba(212,175,55,0.25); |
| | transition: all 0.3s ease; |
| | text-decoration: none; |
| | display: inline-block; |
| } | | } |
| | | .lettre-alfi:hover { |
| /* ======================= JUSTIFICATION ======================= */
| | background: linear-gradient(180deg,#fff8cc,#f9e27a); |
| .mw-parser-output p, | | color: #a40000; |
| .mw-parser-output li,
| | box-shadow: 0 0 12px rgba(212,175,55,0.6), 0 0 4px #fff8cc inset; |
| .mw-parser-output td {
| | transform: translateY(-1px); |
| text-align: justify; | |
| text-justify: inter-word; | |
| hyphens: auto; | |
| } | | } |
|
| |
|
| /* ======================= TITRES ======================= */
| | .bouton-footer { |
| h1, h2, h3, h4, h5 {
| | display: inline-block; |
| font-family: "EB Garamond", serif; | | margin: 0 10px; |
| text-transform: none; | | padding: 8px 14px; |
| line-height: 1.3; | | color: #3a260b; |
| color: var(--couleur-texte); | | font-weight: bold; |
| | text-decoration: none; |
| | border: 1px solid #d4af37; |
| | border-radius: 8px; |
| | background: linear-gradient(180deg,#f9eeb8,#f6e27f); |
| | transition: all 0.3s ease; |
| | box-shadow: 0 0 6px rgba(212,175,55,0.25); |
| } | | } |
| | | .bouton-footer:hover { |
| /* ⚜️ Titre royal */
| | background: linear-gradient(180deg,#fff7c6,#fbe88f); |
| h1 {
| | color: #a40000; |
| font-size: 1.55em;
| | box-shadow: 0 0 12px rgba(212,175,55,0.6); |
| font-weight: 700;
| | transform: translateY(-1px); |
| text-align: center;
| |
| margin: 0.8em auto 0.4em;
| |
| padding-bottom: 0.4em;
| |
| position: relative;
| |
| max-width: 90%;
| |
| }
| |
| | |
| h1::after {
| |
| content: "";
| |
| display: block;
| |
| width: 100px;
| |
| height: 2px;
| |
| background: linear-gradient(to right, var(--doré), var(--doré-clair), var(--doré)); | |
| margin: 10px auto 0 auto; | |
| border-radius: 2px;
| |
| box-shadow: 0 0 5px rgba(212, 175, 55, 0.3); | |
| }
| |
| | |
| h2 {
| |
| font-size: 1.35em;
| |
| font-weight: 600;
| |
| border-left: 4px solid var(--doré);
| |
| padding-left: 8px; | |
| margin-top: 1.2em;
| |
| }
| |
| | |
| h3 {
| |
| font-size: 1.18em;
| |
| font-weight: 600;
| |
| color: var(--brun-foncé);
| |
| margin-top: 1em;
| |
| } | | } |
|
| |
|
| /* ======================= CITATIONS ======================= */
| | #alfi-footer { |
| blockquote {
| | position: fixed; |
| font-family: "Cormorant Garamond", serif; | | bottom: 0; |
| font-size: 1.05em; | | left: 0; |
| font-style: italic;
| | width: 100%; |
| background-color: var(--fond-citation); | | background: rgba(255,253,248,0.85); |
| border-left: 4px solid var(--doré);
| | backdrop-filter: blur(5px); |
| margin: 1em 2em;
| | border-top: 2px solid #d4af37; |
| padding: 0.8em 1.2em;
| | box-shadow: 0 -2px 8px rgba(212,175,55,0.25); |
| color: var(--brun-foncé); | |
| }
| |
| | |
| /* ======================= TABLES ======================= */
| |
| table {
| |
| border-collapse: collapse;
| |
| background-color: var(--fond-tableau); | |
| }
| |
| th, td {
| |
| border: 1px solid var(--doré);
| |
| padding: 6px 10px;
| |
| color: var(--couleur-texte);
| |
| }
| |
| | |
| /* ======================= LIENS ======================= */
| |
| a, a:visited { color: var(--brun-foncé); text-decoration: none; }
| |
| a:hover { color: var(--doré); text-decoration: underline; }
| |
| | |
| /* ======================= CITATION ROYALE ("ordo") ======================= */
| |
| .ordo { | |
| font-family: "Cinzel", serif;
| |
| text-align: center;
| |
| color: var(--brun-foncé);
| |
| background: var(--fond-citation); | |
| border: 2px solid var(--doré);
| |
| border-radius: 10px; | |
| padding: 15px;
| |
| margin: 1.5em auto;
| |
| width: 80%;
| |
| font-size: 1.1em;
| |
| }
| |
| | |
| /* ======================= SIGNATURE ======================= */
| |
| .signature-alfi {
| |
| text-align: center;
| |
| font-family: "Cinzel", serif;
| |
| font-size: 1em;
| |
| margin-top: 2em;
| |
| color: var(--couleur-texte); | |
| }
| |
| .signature-alfi::before { content: "⚜️ "; color: var(--doré); }
| |
| .signature-alfi::after { content: " ⚜️"; color: var(--doré); }
| |
| | |
| /* ======================= TABLE DES SOMMAIRES ======================= */
| |
| #toc, .toc {
| |
| background: var(--fond-citation);
| |
| border: 1px solid var(--doré);
| |
| border-radius: 8px;
| |
| font-family: "EB Garamond", serif;
| |
| padding: 10px 15px;
| |
| margin: 1em auto;
| |
| width: 80%;
| |
| }
| |
| #toc h2 {
| |
| text-align: center; | | text-align: center; |
| color: var(--couleur-texte); | | padding: 10px 0; |
| border: none;
| | font-family: 'EB Garamond',serif; |
| font-weight: 700;
| | z-index: 99; |
| font-size: 1.15em;
| |
| }
| |
| | |
| /* ======================= RESPONSIVE ======================= */
| |
| @media (max-width: 600px) {
| |
| h1 { font-size: 1.3em; line-height: 1.2; }
| |
| h2 { font-size: 1.1em; }
| |
| h3 { font-size: 1em; } | |
| .mw-parser-output p { text-align: left; } | |
| } | | } |
|
| |
|
| /***************************************************************
| | @media (max-width:600px) { |
| ⚜️ THEME D’IMPRESSION — ALFI IMPRIMATUR v1.0 ⚜️
| | #recherche-alfi { width:90%; font-size:16px; } |
| Format : A4 — Usage : Chartes, Statuts, Actes, Dossiers royaux
| | .lettre-alfi { font-size:18px; padding:9px 13px; } |
| ****************************************************************/
| |
| @media print { | |
| body { | |
| font-family: "Crimson Pro", serif;
| |
| font-size: 12.5pt;
| |
| line-height: 1.55;
| |
| color: #2a1b0a;
| |
| background: #fffdf8;
| |
| margin: 2.5cm;
| |
| text-align: justify;
| |
| text-justify: inter-word;
| |
| hyphens: auto;
| |
| }
| |
| h1 { | |
| font-family: "EB Garamond", serif;
| |
| font-size: 16pt;
| |
| text-align: center;
| |
| font-weight: 700;
| |
| border-bottom: 1.5pt solid #d4af37;
| |
| padding-bottom: 6pt;
| |
| }
| |
| h2 {
| |
| font-size: 14pt;
| |
| border-left: 4pt solid #d4af37;
| |
| padding-left: 8pt;
| |
| margin-top: 18pt;
| |
| }
| |
| p, li {
| |
| text-align: justify;
| |
| orphans: 3;
| |
| widows: 3;
| |
| }
| |
| blockquote {
| |
| font-family: "Cormorant Garamond", serif;
| |
| font-style: italic;
| |
| border-left: 3pt solid #d4af37;
| |
| margin: 10pt 20pt;
| |
| padding: 6pt 12pt;
| |
| }
| |
| table {
| |
| border-collapse: collapse;
| |
| width: 100%;
| |
| }
| |
| th, td {
| |
| border: 0.5pt solid #d4af37;
| |
| padding: 6pt;
| |
| }
| |
| body::after {
| |
| content: "";
| |
| position: fixed;
| |
| top: 50%;
| |
| left: 50%;
| |
| width: 50%;
| |
| height: 50%;
| |
| background: url("https://wiki.alfinternational.eu/images/logo_alfi_gold.png") no-repeat center;
| |
| background-size: contain;
| |
| opacity: 0.06;
| |
| transform: translate(-50%, -50%);
| |
| }
| |
| } | | } |
/* ===============================================================
⚜️ STYLE GLOBAL ROYAL ALFI — Version 2026
=============================================================== */
#alfi-index {
position: sticky;
top: 0;
z-index: 100;
text-align: center;
background: #fffdf8e8;
backdrop-filter: blur(6px);
border-bottom: 2px solid #d4af37;
box-shadow: 0 3px 12px rgba(212,175,55,0.25);
padding: 25px 15px;
margin-bottom: 35px;
font-family: 'EB Garamond','Garamond',serif;
}
.lettre-alfi {
background: linear-gradient(180deg,#f8f2d0,#f6e27f);
border: 1px solid #d4af37;
border-radius: 6px;
padding: 7px 12px;
font-size: 17px;
font-weight: bold;
color: #3a260b;
box-shadow: 0 0 5px rgba(212,175,55,0.25);
transition: all 0.3s ease;
text-decoration: none;
display: inline-block;
}
.lettre-alfi:hover {
background: linear-gradient(180deg,#fff8cc,#f9e27a);
color: #a40000;
box-shadow: 0 0 12px rgba(212,175,55,0.6), 0 0 4px #fff8cc inset;
transform: translateY(-1px);
}
.bouton-footer {
display: inline-block;
margin: 0 10px;
padding: 8px 14px;
color: #3a260b;
font-weight: bold;
text-decoration: none;
border: 1px solid #d4af37;
border-radius: 8px;
background: linear-gradient(180deg,#f9eeb8,#f6e27f);
transition: all 0.3s ease;
box-shadow: 0 0 6px rgba(212,175,55,0.25);
}
.bouton-footer:hover {
background: linear-gradient(180deg,#fff7c6,#fbe88f);
color: #a40000;
box-shadow: 0 0 12px rgba(212,175,55,0.6);
transform: translateY(-1px);
}
#alfi-footer {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background: rgba(255,253,248,0.85);
backdrop-filter: blur(5px);
border-top: 2px solid #d4af37;
box-shadow: 0 -2px 8px rgba(212,175,55,0.25);
text-align: center;
padding: 10px 0;
font-family: 'EB Garamond',serif;
z-index: 99;
}
@media (max-width:600px) {
#recherche-alfi { width:90%; font-size:16px; }
.lettre-alfi { font-size:18px; padding:9px 13px; }
}