Sari la conținut

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

De la Enciclopedia Trimeria
Fără descriere a modificării
mFără descriere a modificării
Etichete: Modificare mobilă Modificare de pe versiunea pentru mobil
 
(Nu s-au afișat 22 de versiuni intermediare efectuate de același utilizator)
Linia 19: Linia 19:


/* ==========================================================================
/* ==========================================================================
   PERSONALIZARE CULORI GLOBALE - ENCICLOPEDIA TRIMERIA
   ENCICLOPEDIA TRIMERIA
  Tema oficială
   ========================================================================== */
   ========================================================================== */


/* 1. SCHIMBAREA FUNDALULUI GLOBAL AL SITE-ULUI */
/* ==========================================================================
  PALETA DE CULORI
  ========================================================================== */
 
:root {
    --trimeria-green: #5b8f3f;
    --trimeria-green-dark: #3f6d2d;
    --trimeria-green-light: #edf6e8;
 
    --trimeria-blue: #2f6e95;
 
    --trimeria-bg: #edf6e8;
    --trimeria-content: #ffffff;
 
    --trimeria-text: #222222;
 
    --trimeria-transition: 0.2s ease;
}
 
/* ==========================================================================
  FUNDAL GENERAL
  ========================================================================== */
 
html,
body {
body {
     background-color: #f4f9f1 !important; /* Un crem-verzui foarte deschis, odihnitor pentru ochi */
     background-color: var(--trimeria-bg) !important;
     color: #222222 !important; /* Text principal aproape negru, pentru contrast maxim */
     color: var(--trimeria-text);
}
}


/* Fundalul containerului de conținut (unde stau articolele) */
/* ==========================================================================
#content {
  TITLURI
     background-color: #ffffff !important;
  ========================================================================== */
     border: 1px solid #d2e4cb !important; /* Margine fină verzuie */
 
     border-radius: 8px; /* Colțuri ușor rotunjite pentru un aspect modern */
.firstHeading,
h1 {
     color: var(--trimeria-green-dark) !important;
     padding-bottom: 6px;
     margin-bottom: 16px;
}
}


/* 2. PERSONALIZARE TITLURI (H1, H2, H3 etc.) */
h2 {
h1, h2, .firstHeading {
     color: var(--trimeria-green-dark);
     color: #4a7532 !important; /* Verdele oficial Trimeria pentru titluri mari */
     padding-bottom: 3px;
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    margin-top: 28px;
     border-bottom: 2px solid #6aa84f !important; /* Linie elegantă sub titluri */
     margin-bottom: 12px;
}
}


h3, h4 {
h3,
     color: #2b5b84 !important; /* Un albastru-închis discret pentru subtitluri secundare */
h4,
h5,
h6 {
     color: var(--trimeria-blue);
    margin-top: 20px;
    margin-bottom: 10px;
}
}


/* 3. SCHIMBAREA CULORILOR PENTRU LINKURI */
/* ==========================================================================
  LINKURI
  ========================================================================== */
 
a {
a {
     color: #3b6b24 !important; /* Verde închis, foarte lizibil */
     color: var(--trimeria-green-dark) !important;
     font-weight: 600;
     text-decoration: none;
     transition: color 0.2s ease-in-out;
     transition: color var(--trimeria-transition);
}
}


/* Mouse deasupra pe un link */
a:hover {
a:hover {
     color: #6aa84f !important;
     color: var(--trimeria-green) !important;
     text-decoration: underline !important;
     text-decoration: underline;
}
}


/* Linkuri către pagini care NU există încă (celebrii „redlinks” din Wiki) */
/* redlinks */
a.new {
a.new {
     color: #bc111e !important; /* Roșu aprins pentru pagini ce trebuie create */
     color: #ba2d2d !important;
}
}
a.new:hover {
a.new:hover {
     color: #e0313f !important;
     color: #e54747 !important;
}
 
/* ==========================================================================
  TABELE WIKI
  ========================================================================== */
 
.wikitable {
    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;
    padding: 8px;
}
 
/* ==========================================================================
  TOC (CUPRINS)
  ========================================================================== */
 
.toc {
    background: #f8fbf6 !important;
}
 
.toctitle h2 {
    border: none !important;
}
}


/* 4. PERSONALIZARE MENIURI ȘI FILE */
.toc ul li {
#p-cactions li a {
     margin-bottom: 6px;
     background-color: #eaeaea !important;
    color: #444 !important;
    transition: all 0.2s;
}
}


#p-cactions li.selected a {
/* animație discretă la deschiderea cuprinsului */
     background-color: #4a7532 !important;
.vector-toc,
     color: #ffffff !important;
.sidebar-toc-list {
     border-color: #4a7532 !important;
    transition: max-height 0.25s ease, opacity 0.2s ease;
}
 
/* ==========================================================================
  BARA LATERALĂ
  ========================================================================== */
 
.vector-pinned-container,
#mw-panel {
    background: #f7faf5;
}
 
.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 {
    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);
}
}


/* Linkurile din bara laterală */
.ve-init-mw-desktopArticleTarget-targetContainer {
.mw-sidebar-action a, #mw-panel .portal .body ul li a {
     padding: 20px;
     color: #444444 !important;
}
}
.mw-sidebar-action a:hover, #mw-panel .portal .body ul li a:hover {
 
     color: #4a7532 !important;
/* ==========================================================================
  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;
}


/* =======================================
/* ==========================================================================
   PERSONALIZARE CONȚINUT INTERFAȚĂ MOBIL
   CĂUTARE
   ======================================= */
   ========================================================================== */


/* 1. SCHIMBAREA FUNDALULUI UNDE ESTE CONȚINUTUL PAGINII */
.vector-search-box-input {
.mw-body, #content, #mw-content-text {
     transition: border-color var(--trimeria-transition), box-shadow var(--trimeria-transition);
     background-color: #ffffff !important;  
}
}
.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 {
#mw-content-text {
     background-color: #fcfdfe !important;
    animation: trimeria-fade-in 0.35s ease;
    padding: 15px;
}
     border-radius: 6px;
 
@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;
}
}


/* 2. BARA DE INSTRUMENTE ȘI MENIUL LATERAL PE MOBIL (Stil elegant, curat) */
#mw-mf-page-left {
.mw-navigation, .navigation-drawer, .mw-sidebar, #mw-panel {
  background-color: #d6e7c2;
    background-color: #ffffff !important;
    border-right: 3px solid #4a7532 !important;
}
}


/* Linkurile din meniu devin verzi și clare */
.header-container.header-chrome {
.mw-navigation a, .navigation-drawer a, .sidebar-list a, .mw-sidebar-action a {
     background-color: #daffc7;
     color: #4a7532 !important; /* Scris verde oficial */
    font-weight: bold !important;
}
}


.mw-navigation a:hover, .navigation-drawer a:hover, .sidebar-list a:hover {
.toggle-list-item__label {
     background-color: #f4f9f1 !important; /* Un fundal verzui foarte pal și discret */
    color: #00233f;
     color: #3b6b24 !important;
    font-weight: bold;
    font-size: 0.875rem;
    overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap
}
}


.mw-ui-icon, .mw-ui-icon-wikimedia-menu, .main-menu-button {
#mw-mf-page-left ul .toggle-list-item {
     filter: sepia(1) saturate(3) hue-rotate(60deg) !important;  
     background-color: #9cba78;
    position: relative;
    border-top: 1px solid var(--border-color-muted,#dadde3);
    margin-top: -1px
}
}


/* 3. ANTET MOBIL */
.mw-footer {
.header-container, .header {
     background-color: #1c350f;
     background-color: #ffffff !important; /* Fundal alb, aerisit */
    color: #ffffff;
     border-bottom: 2px solid #6aa84f !important; /* Doar o linie subțire verde jos, pentru stil */
     padding: 14px;
}
}


/* Titlul și elementele din header revin la nuanțe închise/verzi pe fundal alb */
.mw-footer a {
.header h1, .header a {
     color: #ffffff !important;
     color: #4a7532 !important;  
}
}

Versiunea curentă din 20 iulie 2026 22:05

/** CSS plasate aici vor fi aplicate tuturor aparițiilor */

.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-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);
}

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

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

h2 {
    color: var(--trimeria-green-dark);
    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-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;
    padding: 8px;
}

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

.toc {
    background: #f8fbf6 !important;
}

.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;
}

.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 {
    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 {
    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;
}

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

.header-container.header-chrome {
    background-color: #daffc7;
}

.toggle-list-item__label {
    color: #00233f;
    font-weight: bold;
    font-size: 0.875rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

#mw-mf-page-left ul .toggle-list-item {
    background-color: #9cba78;
    position: relative;
    border-top: 1px solid var(--border-color-muted,#dadde3);
    margin-top: -1px
}

.mw-footer {
    background-color: #1c350f;
    color: #ffffff;
    padding: 14px;
}

.mw-footer a {
    color: #ffffff !important;
}