Sari la conținut

MediaWiki:Common.css: Diferență între versiuni

De la Enciclopedia Trimeria
mFără descriere a modificării
Fără descriere a modificării
Etichete: Modificare mobilă Modificare de pe versiunea pentru mobil
Linia 1: Linia 1:
/** CSS plasate aici vor fi aplicate tuturor aparițiilor */
/** CSS plasate aici vor fi aplicate tuturor apariențelor */


.page-Pagina_principală .firstHeading {
.page-Pagina_principală .firstHeading {
Linia 40: Linia 40:


     --trimeria-text: #222222;
     --trimeria-text: #222222;
    --trimeria-transition: 0.2s ease;
}
}


Linia 50: Linia 52:
     background-color: var(--trimeria-bg) !important;
     background-color: var(--trimeria-bg) !important;
     color: var(--trimeria-text);
     color: var(--trimeria-text);
}
/* ==========================================================================
  SPAȚIERE GENERALĂ TEXT (rezolvă senzația de „text strâns”)
  ========================================================================== */
#mw-content-text,
.mw-parser-output {
    line-height: 1.7;
    font-size: 15.5px;
}
#mw-content-text p {
    margin: 0 0 14px 0;
}
#mw-content-text ul,
#mw-content-text ol {
    margin: 0 0 14px 24px;
    line-height: 1.7;
}
#mw-content-text li {
    margin-bottom: 4px;
}
}


Linia 61: Linia 87:
     border-bottom: 2px solid var(--trimeria-border);
     border-bottom: 2px solid var(--trimeria-border);
     padding-bottom: 6px;
     padding-bottom: 6px;
    margin-bottom: 16px;
}
}


Linia 67: Linia 94:
     border-bottom: 1px solid var(--trimeria-border);
     border-bottom: 1px solid var(--trimeria-border);
     padding-bottom: 3px;
     padding-bottom: 3px;
    margin-top: 28px;
    margin-bottom: 12px;
}
}


Linia 74: Linia 103:
h6 {
h6 {
     color: var(--trimeria-blue);
     color: var(--trimeria-blue);
    margin-top: 20px;
    margin-bottom: 10px;
}
}


Linia 83: Linia 114:
     color: var(--trimeria-green-dark) !important;
     color: var(--trimeria-green-dark) !important;
     text-decoration: none;
     text-decoration: none;
    transition: color var(--trimeria-transition);
}
}


Linia 107: Linia 139:
     border-collapse: collapse;
     border-collapse: collapse;
     background-color: white;
     background-color: white;
}
.wikitable th,
.wikitable td {
    padding: 8px 12px;
}
}


Linia 122: Linia 159:
.wikitable tr:nth-child(even) {
.wikitable tr:nth-child(even) {
     background-color: #f8fbf6;
     background-color: #f8fbf6;
}
.wikitable tr {
    transition: background-color var(--trimeria-transition);
}
.wikitable tr:hover {
    background-color: #eef7e9;
}
}


Linia 138: Linia 183:
pre {
pre {
     padding: 10px;
     padding: 10px;
    line-height: 1.5;
}
}


Linia 148: Linia 194:
     border: 1px solid var(--trimeria-border);
     border: 1px solid var(--trimeria-border);
     border-radius: 6px;
     border-radius: 6px;
     padding: 8px;
     padding: 10px 14px;
    margin-top: 24px;
}
}


Linia 159: Linia 206:
     border: 1px solid var(--trimeria-border) !important;
     border: 1px solid var(--trimeria-border) !important;
     border-radius: 6px;
     border-radius: 6px;
    padding: 10px 14px;
}
}


.toctitle h2 {
.toctitle h2 {
     border: none !important;
     border: none !important;
}
.toc ul li {
    margin-bottom: 6px;
}
/* animație discretă la deschiderea cuprinsului */
.vector-toc,
.sidebar-toc-list {
    transition: max-height 0.25s ease, opacity 0.2s ease;
}
}


Linia 197: Linia 255:
     background-color: var(--trimeria-green-dark);
     background-color: var(--trimeria-green-dark);
     border-radius: 4px 4px 0 0;
     border-radius: 4px 4px 0 0;
    transition: background-color var(--trimeria-transition);
}
.vector-menu-tabs li a {
    transition: background-color var(--trimeria-transition);
}
}


Linia 205: Linia 268:
.thumb {
.thumb {
     border-color: var(--trimeria-border) !important;
     border-color: var(--trimeria-border) !important;
    transition: box-shadow var(--trimeria-transition);
}
.thumb:hover {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
}


.thumbcaption {
.thumbcaption {
     background: #f8fbf6;
     background: #f8fbf6;
    line-height: 1.5;
    padding: 6px 8px;
}
}


Linia 243: Linia 313:
.fmbox {
.fmbox {
     border-radius: 6px;
     border-radius: 6px;
    padding: 10px 14px;
    line-height: 1.5;
}
}


Linia 251: Linia 323:
.vector-search-box-input {
.vector-search-box-input {
     border: 1px solid var(--trimeria-border);
     border: 1px solid var(--trimeria-border);
    transition: border-color var(--trimeria-transition), box-shadow var(--trimeria-transition);
}
}


.vector-search-box-input:focus {
.vector-search-box-input:focus {
     border-color: var(--trimeria-green);
     border-color: var(--trimeria-green);
    box-shadow: 0 0 0 2px rgba(91, 143, 63, 0.15);
}
/* ==========================================================================
  FADE-IN DISCRET LA ÎNCĂRCAREA CONȚINUTULUI
  ========================================================================== */
#mw-content-text {
    animation: trimeria-fade-in 0.35s ease;
}
@keyframes trimeria-fade-in {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
}


Linia 265: Linia 358:
     background-color: #e8ffe7 !important;
     background-color: #e8ffe7 !important;
     border-radius: 8px;
     border-radius: 8px;
     padding: 12px;
     padding: 14px;
}
}


Linia 276: Linia 369:
}
}


#mw-mf-page-left {
.skin-minerva #mw-mf-page-left {
  background-color: #d6e7c2;
    background-color: #d6e7c2;
}
 
/* Text mai mare și mai spațiat pe mobil, pentru citire ușoară */
.skin-minerva #mw-content-text,
.skin-minerva .mw-parser-output {
    font-size: 16px;
    line-height: 1.75;
}
 
/* Infocaseta pe mobil: full-width, fără scroll orizontal, coloane clare */
.skin-minerva .infobox,
.skin-minerva table.infobox {
    width: 100% !important;
    display: block;
    margin: 16px 0;
}
 
.skin-minerva .infobox > tbody,
.skin-minerva .infobox > tbody > tr {
    display: block;
    width: 100%;
}
 
.skin-minerva .infobox > tbody > tr > th,
.skin-minerva .infobox > tbody > tr > td {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
    white-space: normal;
}
 
.skin-minerva .infobox > tbody > tr > th:not(:first-child) {
    border-bottom: none;
    padding-bottom: 2px !important;
    font-size: 13px;
    color: var(--trimeria-blue);
    background: transparent;
}
 
/* Titluri secțiuni ceva mai compacte pe telefon, dar tot spațiate */
.skin-minerva h2 {
    font-size: 20px;
    margin-top: 22px;
}
 
.skin-minerva h3 {
    font-size: 17px;
}
 
/* Imagini responsive, fără să depășească ecranul */
.skin-minerva img,
.skin-minerva .thumb img {
    max-width: 100% !important;
    height: auto !important;
}
 
/* Zone tactile mai mari pentru linkuri, ușor de apăsat pe telefon */
.skin-minerva #mw-content-text a {
    padding: 1px 2px;
}
 
/* Tranziție discretă la deschiderea/închiderea meniului lateral pe mobil */
.mw-mf-page-left,
.overlay-enabled {
    transition: transform 0.25s ease;
}
}

Versiunea de la data 20 iulie 2026 20:02

/** CSS plasate aici vor fi aplicate tuturor apariențelor */

.page-Pagina_principală .firstHeading {
    display: none !important;
}

#footer-info {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 5px;
}

#footer-info li {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ==========================================================================
   ENCICLOPEDIA TRIMERIA
   Tema oficială
   ========================================================================== */

/* ==========================================================================
   PALETA DE CULORI
   ========================================================================== */

:root {
    --trimeria-green: #5b8f3f;
    --trimeria-green-dark: #3f6d2d;
    --trimeria-green-light: #edf6e8;

    --trimeria-blue: #2f6e95;

    --trimeria-border: #cddfc5;

    --trimeria-bg: #edf6e8;
    --trimeria-content: #ffffff;

    --trimeria-text: #222222;

    --trimeria-transition: 0.2s ease;
}

/* ==========================================================================
   FUNDAL GENERAL
   ========================================================================== */

html,
body {
    background-color: var(--trimeria-bg) !important;
    color: var(--trimeria-text);
}

/* ==========================================================================
   SPAȚIERE GENERALĂ TEXT (rezolvă senzația de „text strâns”)
   ========================================================================== */

#mw-content-text,
.mw-parser-output {
    line-height: 1.7;
    font-size: 15.5px;
}

#mw-content-text p {
    margin: 0 0 14px 0;
}

#mw-content-text ul,
#mw-content-text ol {
    margin: 0 0 14px 24px;
    line-height: 1.7;
}

#mw-content-text li {
    margin-bottom: 4px;
}

/* ==========================================================================
   TITLURI
   ========================================================================== */

.firstHeading,
h1 {
    color: var(--trimeria-green-dark) !important;
    border-bottom: 2px solid var(--trimeria-border);
    padding-bottom: 6px;
    margin-bottom: 16px;
}

h2 {
    color: var(--trimeria-green-dark);
    border-bottom: 1px solid var(--trimeria-border);
    padding-bottom: 3px;
    margin-top: 28px;
    margin-bottom: 12px;
}

h3,
h4,
h5,
h6 {
    color: var(--trimeria-blue);
    margin-top: 20px;
    margin-bottom: 10px;
}

/* ==========================================================================
   LINKURI
   ========================================================================== */

a {
    color: var(--trimeria-green-dark) !important;
    text-decoration: none;
    transition: color var(--trimeria-transition);
}

a:hover {
    color: var(--trimeria-green) !important;
    text-decoration: underline;
}

/* redlinks */
a.new {
    color: #ba2d2d !important;
}

a.new:hover {
    color: #e54747 !important;
}

/* ==========================================================================
   TABELE WIKI
   ========================================================================== */

.wikitable {
    border: 1px solid var(--trimeria-border) !important;
    border-collapse: collapse;
    background-color: white;
}

.wikitable th,
.wikitable td {
    padding: 8px 12px;
}

.wikitable th {
    background-color: #dcecd4 !important;
    color: var(--trimeria-green-dark);
    border: 1px solid var(--trimeria-border);
    font-weight: bold;
}

.wikitable td {
    border: 1px solid var(--trimeria-border);
}

.wikitable tr:nth-child(even) {
    background-color: #f8fbf6;
}

.wikitable tr {
    transition: background-color var(--trimeria-transition);
}

.wikitable tr:hover {
    background-color: #eef7e9;
}

/* ==========================================================================
   COD
   ========================================================================== */

code,
pre,
.mw-code {
    background: #f6f6f6;
    border: 1px solid #dddddd;
    border-radius: 4px;
}

pre {
    padding: 10px;
    line-height: 1.5;
}

/* ==========================================================================
   CATEGORII
   ========================================================================== */

.catlinks {
    background: #f8fbf6;
    border: 1px solid var(--trimeria-border);
    border-radius: 6px;
    padding: 10px 14px;
    margin-top: 24px;
}

/* ==========================================================================
   TOC (CUPRINS)
   ========================================================================== */

.toc {
    background: #f8fbf6 !important;
    border: 1px solid var(--trimeria-border) !important;
    border-radius: 6px;
    padding: 10px 14px;
}

.toctitle h2 {
    border: none !important;
}

.toc ul li {
    margin-bottom: 6px;
}

/* animație discretă la deschiderea cuprinsului */
.vector-toc,
.sidebar-toc-list {
    transition: max-height 0.25s ease, opacity 0.2s ease;
}

/* ==========================================================================
   BARA LATERALĂ
   ========================================================================== */

.vector-pinned-container,
#mw-panel {
    background: #f7faf5;
    border-right: 1px solid var(--trimeria-border);
}

.vector-pinned-container a,
#mw-panel a {
    color: var(--trimeria-green-dark);
}

/* ==========================================================================
   ANTET VECTOR
   ========================================================================== */

.vector-header {
    border-bottom: 3px solid var(--trimeria-green);
}

/* ==========================================================================
   FILE
   ========================================================================== */

.vector-menu-tabs .selected a,
.vector-menu-tabs .selected span {
    color: white !important;
    background-color: var(--trimeria-green-dark);
    border-radius: 4px 4px 0 0;
    transition: background-color var(--trimeria-transition);
}

.vector-menu-tabs li a {
    transition: background-color var(--trimeria-transition);
}

/* ==========================================================================
   IMAGINI
   ========================================================================== */

.thumb {
    border-color: var(--trimeria-border) !important;
    transition: box-shadow var(--trimeria-transition);
}

.thumb:hover {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.thumbcaption {
    background: #f8fbf6;
    line-height: 1.5;
    padding: 6px 8px;
}

/* ==========================================================================
   VISUALEDITOR
   ========================================================================== */

.ve-ui-toolbar {
    border-bottom: 2px solid var(--trimeria-green);
}

.ve-init-mw-desktopArticleTarget-targetContainer {
    padding: 20px;
}

/* ==========================================================================
   PAGINI SPECIALE
   ========================================================================== */

.mw-specialpages-table,
.mw-spcontent,
.mw-changeslist {
    background-color: white;
}

/* ==========================================================================
   CASETE DE MESAJE
   ========================================================================== */

.ambox,
.tmbox,
.cmbox,
.ombox,
.fmbox {
    border-radius: 6px;
    padding: 10px 14px;
    line-height: 1.5;
}

/* ==========================================================================
   CĂUTARE
   ========================================================================== */

.vector-search-box-input {
    border: 1px solid var(--trimeria-border);
    transition: border-color var(--trimeria-transition), box-shadow var(--trimeria-transition);
}

.vector-search-box-input:focus {
    border-color: var(--trimeria-green);
    box-shadow: 0 0 0 2px rgba(91, 143, 63, 0.15);
}

/* ==========================================================================
   FADE-IN DISCRET LA ÎNCĂRCAREA CONȚINUTULUI
   ========================================================================== */

#mw-content-text {
    animation: trimeria-fade-in 0.35s ease;
}

@keyframes trimeria-fade-in {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ==========================================================================
   MOBIL - MINERVANEUE
   ========================================================================== */

.skin-minerva #content,
.skin-minerva .content {
    background-color: #e8ffe7 !important;
    border-radius: 8px;
    padding: 14px;
}

.skin-minerva .header {
    border-bottom: 3px solid var(--trimeria-green);
}

.skin-minerva a {
    color: var(--trimeria-green-dark);
}

.skin-minerva #mw-mf-page-left {
    background-color: #d6e7c2;
}

/* Text mai mare și mai spațiat pe mobil, pentru citire ușoară */
.skin-minerva #mw-content-text,
.skin-minerva .mw-parser-output {
    font-size: 16px;
    line-height: 1.75;
}

/* Infocaseta pe mobil: full-width, fără scroll orizontal, coloane clare */
.skin-minerva .infobox,
.skin-minerva table.infobox {
    width: 100% !important;
    display: block;
    margin: 16px 0;
}

.skin-minerva .infobox > tbody,
.skin-minerva .infobox > tbody > tr {
    display: block;
    width: 100%;
}

.skin-minerva .infobox > tbody > tr > th,
.skin-minerva .infobox > tbody > tr > td {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
    white-space: normal;
}

.skin-minerva .infobox > tbody > tr > th:not(:first-child) {
    border-bottom: none;
    padding-bottom: 2px !important;
    font-size: 13px;
    color: var(--trimeria-blue);
    background: transparent;
}

/* Titluri secțiuni ceva mai compacte pe telefon, dar tot spațiate */
.skin-minerva h2 {
    font-size: 20px;
    margin-top: 22px;
}

.skin-minerva h3 {
    font-size: 17px;
}

/* Imagini responsive, fără să depășească ecranul */
.skin-minerva img,
.skin-minerva .thumb img {
    max-width: 100% !important;
    height: auto !important;
}

/* Zone tactile mai mari pentru linkuri, ușor de apăsat pe telefon */
.skin-minerva #mw-content-text a {
    padding: 1px 2px;
}

/* Tranziție discretă la deschiderea/închiderea meniului lateral pe mobil */
.mw-mf-page-left,
.overlay-enabled {
    transition: transform 0.25s ease;
}