Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:Common.css: Difference between revisions

MediaWiki interface page
No edit summary
Titolo editoriale leggero per le pagine di contenuto del namespace
(17 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.9em;
   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 === */