More actions
No edit summary Tag: Manual revert |
Titolo editoriale leggero per le pagine di contenuto del namespace |
||
| (14 intermediate revisions by the same user not shown) | |||
| Line 23: | Line 23: | ||
display:block; | display:block; | ||
font-size:0.85em; | font-size:0.85em; | ||
margin-top:-0. | margin-top:-0.3em; | ||
margin-bottom:0.6em; | margin-bottom:0.6em; | ||
} | } | ||
| Line 30: | Line 30: | ||
color:inherit; | color:inherit; | ||
} | } | ||
/* === [ARCHIVIO-EDITORIALE] inizio === */ | |||
/* Stile editoriale per le Dashboard dei namespace-archivio. | |||
Layout "articolo di prima pagina": corpo a sinistra, indice a destra, | |||
come griglia interna al contenuto (niente dipendenza dal rail di Citizen). | |||
Usa le variabili Citizen. Accent per-archivio via --ns-accent. */ | |||
.archivio-editoriale { | |||
color: var( --color-base, #fff ); | |||
--ns-accent: var( --color-link-red, var( --color-destructive, #d33 ) ); | |||
} | |||
/* Cineteca Sarda (ns 3004): accent giallo del brand — dalla testata del logo | |||
di cinetecasarda.it — al posto del rosso, solo in questo namespace. */ | |||
body.ns-3004 .archivio-editoriale { | |||
--ns-accent: #e7b142; | |||
} | |||
/* Griglia: articolo (1fr) + indice (colonna fissa) */ | |||
.archivio-editoriale .art-layout { | |||
display: grid; | |||
grid-template-columns: minmax( 0, 1fr ) 300px; | |||
gap: 3.5rem; | |||
align-items: start; | |||
} | |||
.archivio-editoriale .art-main { | |||
min-width: 0; | |||
} | |||
/* Occhiello / cappello identitario */ | |||
.archivio-editoriale .occhiello { | |||
margin: 0 0 .7rem; | |||
font-size: .9rem; | |||
letter-spacing: .04em; | |||
color: var( --color-base--subtle, #b8b8b8 ); | |||
opacity: .85; | |||
} | |||
/* Headline da articolo di prima pagina */ | |||
.archivio-editoriale .ce-headline { | |||
margin: 0 0 1.3rem; | |||
border: 0; | |||
font-size: clamp( 2.4rem, 4.6vw, 3.6rem ); | |||
line-height: 1.03; | |||
font-weight: 700; | |||
letter-spacing: -.02em; | |||
color: #ffffff; | |||
} | |||
/* Lead: il racconto. Riempie la colonna dell'articolo. */ | |||
.archivio-editoriale .lead { | |||
margin: 0; | |||
max-width: none; | |||
} | |||
.archivio-editoriale .lead p { | |||
margin: 0 0 1rem; | |||
font-size: 1.08rem; | |||
line-height: 1.6; | |||
color: var( --color-base--subtle, #b8b8b8 ); | |||
} | |||
.archivio-editoriale .lead p:last-child { | |||
margin-bottom: 0; | |||
} | |||
.archivio-editoriale .lead strong { | |||
color: var( --color-base, #fff ); | |||
font-weight: 600; | |||
} | |||
/* === Indice nella colonna destra === */ | |||
.archivio-editoriale .art-aside { | |||
min-width: 0; | |||
} | |||
.archivio-editoriale .art-aside-titolo { | |||
margin: 0 0 .4rem; | |||
padding-bottom: .55rem; | |||
border-bottom: 1px solid var( --border-color-base, rgba( 255, 255, 255, .14 ) ); | |||
font-size: .76rem; | |||
text-transform: uppercase; | |||
letter-spacing: .08em; | |||
color: var( --color-base--subtle, #b8b8b8 ); | |||
} | |||
.archivio-editoriale .idx-sez { | |||
padding: .7rem 0; | |||
border-bottom: 1px solid var( --border-color-base, rgba( 255, 255, 255, .07 ) ); | |||
} | |||
.archivio-editoriale .idx-sez:last-child { | |||
border-bottom: 0; | |||
} | |||
.archivio-editoriale .idx-eti { | |||
margin-bottom: .2rem; | |||
font-size: .98rem; | |||
font-weight: 600; | |||
color: #ffffff; | |||
} | |||
.archivio-editoriale .idx-voci { | |||
font-size: .9rem; | |||
line-height: 1.5; | |||
color: var( --color-base--subtle, #b8b8b8 ); | |||
} | |||
.archivio-editoriale .idx-voci a, | |||
.archivio-editoriale .idx-voci a:visited { | |||
color: var( --ns-accent ); | |||
font-weight: 500; | |||
text-decoration: none; | |||
} | |||
.archivio-editoriale .idx-voci a:hover { | |||
text-decoration: underline; | |||
} | |||
/* Sotto i 900px: indice sotto l'articolo */ | |||
@media ( max-width: 900px ) { | |||
.archivio-editoriale .art-layout { | |||
grid-template-columns: 1fr; | |||
gap: 2.5rem; | |||
} | |||
} | |||
/* === [ARCHIVIO-EDITORIALE] fine === */ | |||
/* === [DASH-HERO] inizio === */ | |||
/* Dashboard come "articolo di prima pagina": nasconde il titolo standard di | |||
Citizen (firstHeading), perché l'headline editoriale vive nel contenuto. | |||
Resta il resto dell'header (nav/strumenti). Page-scoped (due varianti per | |||
l'escaping del ":"). */ | |||
body.page-CinetecaSarda_Dashboard #firstHeading, | |||
body.page-CinetecaSarda-Dashboard #firstHeading, | |||
body.page-CinetecaSarda_Dashboard .mw-first-heading, | |||
body.page-CinetecaSarda-Dashboard .mw-first-heading, | |||
body.page-CinetecaSarda_Dashboard .mw-page-title-main, | |||
body.page-CinetecaSarda-Dashboard .mw-page-title-main { | |||
display: none !important; | |||
} | |||
/* Spazio per le due colonne (articolo + indice), moderato. */ | |||
body.page-CinetecaSarda_Dashboard, | |||
body.page-CinetecaSarda-Dashboard { | |||
--width-layout: min( 1180px, 94vw ); | |||
} | |||
/* === [DASH-HERO] fine === */ | |||
/* === [NS-BRAND] inizio === */ | |||
/* ========================================================== | |||
Brand CinetecaSarda (namespace 3004) — vale su TUTTE le pagine | |||
========================================================== */ | |||
/* Link gialli del brand (dalla testata di cinetecasarda.it) al posto del blu | |||
di Citizen. I link a pagine mancanti (.new) restano rossi: segnale utile. */ | |||
body.ns-3004 .mw-parser-output a:not( .new ), | |||
body.ns-3004 .mw-parser-output a:not( .new ):visited { | |||
color: #e7b142; | |||
} | |||
body.ns-3004 .mw-parser-output a:not( .new ):hover { | |||
color: #f1c878; | |||
} | |||
/* Titolo "editoriale leggero" per le pagine di contenuto: occhiello giallo | |||
sopra, titolo bianco pulito. Sulla Dashboard #firstHeading è nascosto | |||
(ha il suo hero), quindi questo occhiello lì non compare. */ | |||
body.ns-3004 #firstHeading { | |||
color: #ffffff; | |||
} | |||
body.ns-3004 #firstHeading::before { | |||
content: "Cineteca Sarda"; | |||
display: block; | |||
margin-bottom: .35rem; | |||
font-size: .8rem; | |||
font-weight: 500; | |||
letter-spacing: .08em; | |||
text-transform: uppercase; | |||
color: #e7b142; | |||
} | |||
/* L'etichetta "in: Cineteca Sarda" è sostituita dall'occhiello */ | |||
body.ns-3004 .namespace-label { | |||
display: none; | |||
} | |||
/* === [NS-BRAND] fine === */ | |||
Revision as of 19:48, 15 June 2026
/* CSS placed here will be applied to all skins */
#footer { display: none; }
/* last modification stuff */
#footer-info { display: none; }
/* footer links */
#footer-places { display: none; }
/* powered by icon */
#footer-icon { display: none; }
.box-stato-archivio .citizen-card__body p{
margin: 0 0 .75em 0;
}
.box-stato-archivio .citizen-card__body p:last-child{
margin-bottom: 0;
}
/* === CSS per template IntestazionePagine === */
.namespace-label{
display:block;
font-size:0.85em;
margin-top:-0.3em;
margin-bottom:0.6em;
}
.namespace-label a,
.namespace-label a:visited{
color:inherit;
}
/* === [ARCHIVIO-EDITORIALE] inizio === */
/* Stile editoriale per le Dashboard dei namespace-archivio.
Layout "articolo di prima pagina": corpo a sinistra, indice a destra,
come griglia interna al contenuto (niente dipendenza dal rail di Citizen).
Usa le variabili Citizen. Accent per-archivio via --ns-accent. */
.archivio-editoriale {
color: var( --color-base, #fff );
--ns-accent: var( --color-link-red, var( --color-destructive, #d33 ) );
}
/* Cineteca Sarda (ns 3004): accent giallo del brand — dalla testata del logo
di cinetecasarda.it — al posto del rosso, solo in questo namespace. */
body.ns-3004 .archivio-editoriale {
--ns-accent: #e7b142;
}
/* Griglia: articolo (1fr) + indice (colonna fissa) */
.archivio-editoriale .art-layout {
display: grid;
grid-template-columns: minmax( 0, 1fr ) 300px;
gap: 3.5rem;
align-items: start;
}
.archivio-editoriale .art-main {
min-width: 0;
}
/* Occhiello / cappello identitario */
.archivio-editoriale .occhiello {
margin: 0 0 .7rem;
font-size: .9rem;
letter-spacing: .04em;
color: var( --color-base--subtle, #b8b8b8 );
opacity: .85;
}
/* Headline da articolo di prima pagina */
.archivio-editoriale .ce-headline {
margin: 0 0 1.3rem;
border: 0;
font-size: clamp( 2.4rem, 4.6vw, 3.6rem );
line-height: 1.03;
font-weight: 700;
letter-spacing: -.02em;
color: #ffffff;
}
/* Lead: il racconto. Riempie la colonna dell'articolo. */
.archivio-editoriale .lead {
margin: 0;
max-width: none;
}
.archivio-editoriale .lead p {
margin: 0 0 1rem;
font-size: 1.08rem;
line-height: 1.6;
color: var( --color-base--subtle, #b8b8b8 );
}
.archivio-editoriale .lead p:last-child {
margin-bottom: 0;
}
.archivio-editoriale .lead strong {
color: var( --color-base, #fff );
font-weight: 600;
}
/* === Indice nella colonna destra === */
.archivio-editoriale .art-aside {
min-width: 0;
}
.archivio-editoriale .art-aside-titolo {
margin: 0 0 .4rem;
padding-bottom: .55rem;
border-bottom: 1px solid var( --border-color-base, rgba( 255, 255, 255, .14 ) );
font-size: .76rem;
text-transform: uppercase;
letter-spacing: .08em;
color: var( --color-base--subtle, #b8b8b8 );
}
.archivio-editoriale .idx-sez {
padding: .7rem 0;
border-bottom: 1px solid var( --border-color-base, rgba( 255, 255, 255, .07 ) );
}
.archivio-editoriale .idx-sez:last-child {
border-bottom: 0;
}
.archivio-editoriale .idx-eti {
margin-bottom: .2rem;
font-size: .98rem;
font-weight: 600;
color: #ffffff;
}
.archivio-editoriale .idx-voci {
font-size: .9rem;
line-height: 1.5;
color: var( --color-base--subtle, #b8b8b8 );
}
.archivio-editoriale .idx-voci a,
.archivio-editoriale .idx-voci a:visited {
color: var( --ns-accent );
font-weight: 500;
text-decoration: none;
}
.archivio-editoriale .idx-voci a:hover {
text-decoration: underline;
}
/* Sotto i 900px: indice sotto l'articolo */
@media ( max-width: 900px ) {
.archivio-editoriale .art-layout {
grid-template-columns: 1fr;
gap: 2.5rem;
}
}
/* === [ARCHIVIO-EDITORIALE] fine === */
/* === [DASH-HERO] inizio === */
/* Dashboard come "articolo di prima pagina": nasconde il titolo standard di
Citizen (firstHeading), perché l'headline editoriale vive nel contenuto.
Resta il resto dell'header (nav/strumenti). Page-scoped (due varianti per
l'escaping del ":"). */
body.page-CinetecaSarda_Dashboard #firstHeading,
body.page-CinetecaSarda-Dashboard #firstHeading,
body.page-CinetecaSarda_Dashboard .mw-first-heading,
body.page-CinetecaSarda-Dashboard .mw-first-heading,
body.page-CinetecaSarda_Dashboard .mw-page-title-main,
body.page-CinetecaSarda-Dashboard .mw-page-title-main {
display: none !important;
}
/* Spazio per le due colonne (articolo + indice), moderato. */
body.page-CinetecaSarda_Dashboard,
body.page-CinetecaSarda-Dashboard {
--width-layout: min( 1180px, 94vw );
}
/* === [DASH-HERO] fine === */
/* === [NS-BRAND] inizio === */
/* ==========================================================
Brand CinetecaSarda (namespace 3004) — vale su TUTTE le pagine
========================================================== */
/* Link gialli del brand (dalla testata di cinetecasarda.it) al posto del blu
di Citizen. I link a pagine mancanti (.new) restano rossi: segnale utile. */
body.ns-3004 .mw-parser-output a:not( .new ),
body.ns-3004 .mw-parser-output a:not( .new ):visited {
color: #e7b142;
}
body.ns-3004 .mw-parser-output a:not( .new ):hover {
color: #f1c878;
}
/* Titolo "editoriale leggero" per le pagine di contenuto: occhiello giallo
sopra, titolo bianco pulito. Sulla Dashboard #firstHeading è nascosto
(ha il suo hero), quindi questo occhiello lì non compare. */
body.ns-3004 #firstHeading {
color: #ffffff;
}
body.ns-3004 #firstHeading::before {
content: "Cineteca Sarda";
display: block;
margin-bottom: .35rem;
font-size: .8rem;
font-weight: 500;
letter-spacing: .08em;
text-transform: uppercase;
color: #e7b142;
}
/* L'etichetta "in: Cineteca Sarda" è sostituita dall'occhiello */
body.ns-3004 .namespace-label {
display: none;
}
/* === [NS-BRAND] fine === */