/* ============================================================================ DMA (Dance Music Awards) - Overrides sopra il template Exhibiz. Stessa filosofia di idma/assets/css/idma.css: il template resta intatto, qui solo le differenze (branding, componenti nuovi per pagine che il template non prevede). Bumpare ASSET_VER (includes/helpers.inc) ad ogni modifica di questo file. ============================================================================ */ /* Voci di menu con sottomenu (es. "Partecipazione", "Link") usano un link segnaposto href="#": non deve navigare da solo, serve solo ad aprire il sottomenu (comportamento gia' gestito da designesia.js sull'hover/tap). */ #mainmenu > li > a[href="#"] { cursor: default; } /* Logo reale (assets/img/logo.png, 1126x638): il template presuppone un file gia' pre-dimensionato e non vincola l'altezza via CSS, quindi va vincolata qui esplicitamente sopra l'header (80px, 70px quando "scrolled"/.smaller) e sopra la versione piccola nel footer. */ #logo img.logo { max-height: 56px; width: auto; } header.smaller #logo img.logo { max-height: 46px; } .logo-small { max-height: 40px; width: auto; margin-bottom: 20px; } /* Elenco pieghevole "altri membri della categoria" in giuria.asp: il tema non ha un componente equivalente, stile minimo coerente col resto. */ .roster-details { margin-top: 14px; text-align: left; } .roster-details summary { cursor: pointer; color: var(--primary-color-1); } .roster-list { list-style: none; padding: 0; margin: 10px 0 0; } .roster-list li { padding: 4px 0; } .roster-list a { color: inherit; } /* Segnaposto foto quando manca l'immagine (iniziali su sfondo scuro) */ .team-pic-empty { width: 100%; aspect-ratio: 1/1; display: flex; align-items: center; justify-content: center; background: #222; color: var(--primary-color-1); font-size: 42px; font-weight: 700; } /* Pulsanti di invio dei moduli pubblici: il tema definisce .btn-custom con sfondo bianco fisso (style.css) - qui usata quasi ovunque insieme alla classe "text-white" per il testo, risultato testo bianco su sfondo bianco, illeggibile. Sovrascritto con l'oro del brand (stessa variabile di colors/yellow.css) e testo scuro, leggibile su sfondo sia chiaro che scuro. "!important" necessario per vincere sulla regola inline di style.css con la stessa specificita'. */ a.btn-custom, input.btn-custom, button.btn-custom { background: var(--primary-color-1) !important; color: #1a1a1a !important; border: none; font-weight: 700; } a.btn-custom:hover, button.btn-custom:hover { background: #fff !important; color: #1a1a1a !important; opacity: 1; } /* Pulsante disabilitato (es. "Invia e conferma via email" su vota-adesso.asp, finche' non si sono scelte abbastanza categorie): senza questa regola il browser applica una propria dissolvenza sopra l'oro, che sbiadisce anche il testo scuro rendendolo poco leggibile. Grigio neutro + testo bianco, contrasto sempre leggibile e chiaramente "non cliccabile ora". */ button.btn-custom:disabled, button.btn-custom.disabled { background: #6c757d !important; color: #fff !important; opacity: 1; cursor: not-allowed; } /* Countdown in home (Release 026/027/028): componente REALE del tema, la sezione dedicata "#section-countdown" di index.html (non il piccolo countdown incorporato nell'hero di altre varianti, scartato dopo il primo tentativo perche' non era quello richiesto) - una barra a tutta larghezza con sfondo sfumato (.gradient-to-right, gia' in color.css) subito sotto l'hero. Il layout/dimensionamento (percentuali per riquadro, non pixel fissi: .countdown-show4 .countdown-section{width:24.5%} in assets/css/ plugins.css) e' GIA' completo e corretto nel tema - qui NON va riscritto: un tentativo precedente lo sovrascriveva con una versione a flexbox/larghezza fissa che andava a capo su schermi stretti ("i secondi scendono sotto"), mentre l'originale del tema non lo fa mai (percentuali = si adattano sempre, il font cambia dimensione solo a un 'unica soglia responsive gia' prevista da style.css, senza mai spezzare la riga). Qui resta solo cio' che il tema lascia davvero incompleto: 1. ".gradient-to-right" usa var(--secondary-color), MAI definita in nessun file colore del tema (nemmeno nella sorgente originale): senza un valore la sfumatura non si applica affatto. Aggiunta qui, non nei file colore (che sono copie dirette del tema, si preferisce non toccarli) - vedi anche colors/yellow.css, dove serve comunque restare "--primary-color-1" come unica vera personalizzazione. 2. Un'ombra leggera su cifre/etichette (gia' bianche di suo, vedi plugins.css): garantisce un contrasto leggibile qualunque punto della sfumatura oro/nero si trovi sotto, senza toccare larghezze/font-size che il tema gestisce gia' da solo. */ :root { --secondary-color: #1a1a1a; } #section-countdown .countdown-amount, #section-countdown .countdown-period { text-shadow: 0 2px 8px rgba(0,0,0,.65); } #section-countdown .countdown-titolo { color: #fff; text-shadow: 0 2px 8px rgba(0,0,0,.65); margin-bottom: 20px; } /* Calendario (Release 031): "Event Schedule" reale del tema (.schedule-listing > .schedule-item > .sc-time/.sc-info, assets/css/ style.css), usato senza .sc-pic/.sc-name (foto+nome di un relatore: non esiste un "relatore" per una fase di concorso, a differenza di una sessione di conferenza - vedi commento in calendario.asp). Senza questa unica correzione, .sc-info (60% larghezza fissa nel tema) lascerebbe un vuoto a destra di .sc-time invece di occupare lo spazio che nel tema occupavano insieme .sc-pic+.sc-name (160px+120px). */ .calendario-schedule .sc-info { width: calc(100% - 160px); } /* Variante home "Video" con link YouTube (Release 032): il tema non ha nessuna variante YouTube (solo un file mp4 locale, vedi .de-video-container piu' sotto, gia' completo di suo), quindi qui una piccola aggiunta - non un'invenzione estetica, una lacuna reale come "--secondary-color" per il countdown. L'iframe YouTube va ritagliato per coprire sempre tutto lo sfondo (tecnica standard: oversize + centrato), cosa che ".de-video-container" gia' fa da solo per il tag