MediaWiki:Common.css: Difference between revisions

From bwCloud-OS
Jump to navigation Jump to search
Admin (talk | contribs)
No edit summary
Admin (talk | contribs)
No edit summary
Line 13: Line 13:


/* fuer "quickstart" auf startpage
/* fuer "quickstart" auf startpage
/* Grund-Styling für den gesamten aufklappbaren Container */
/* Grund-Styling für den gesamten aufklappbaren Container */
.mw-collapsible.modern-box {
.mw-collapsible.modern-box {
    background-color: #f9f9f9;
     border: 1px solid #e1e1e1; /* Ein heller, dezenter Rand */
     border: 1px solid #e1e1e1;
     border-radius: 8px; /* Abgerundete Ecken für ein weicheres Aussehen */
     border-radius: 8px;
     box-shadow: 0 4px 10px rgba(0,0,0,0.08); /* Moderner Schatten für Tiefe */
     box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    padding: 0;
     margin: 1em 0;
     margin: 1em 0;
     overflow: hidden; /* Wichtig für abgerundete Ecken */
    background-color: #ffffff; /* Weißer Hintergrund */
     overflow: hidden; /* Stellt sicher, dass sich alles innerhalb der abgerundeten Ecken befindet */
}
}


Line 29: Line 26:
.mw-collapsible.modern-box > .mw-collapsible-toggle {
.mw-collapsible.modern-box > .mw-collapsible-toggle {
     display: block;
     display: block;
     padding: 12px 18px;
     padding: 15px 20px;
     cursor: pointer;
     cursor: pointer;
     font-weight: bold;
     font-weight: bold;
     position: relative;
     position: relative; /* Wichtig für die Positionierung des Icons */
     text-align: left;
     background-color: #f9f9f9; /* Leicht abgesetzter Hintergrund für den Header */
}
}


/* Versteckt den Standard-Text "[Anzeigen]" / "[Verbergen]" */
/* Fügt eine feine Linie zwischen Header und Inhalt hinzu, wenn ausgeklappt */
.mw-collapsible.modern-box:not(.mw-collapsed) > .mw-collapsible-toggle {
    border-bottom: 1px solid #e1e1e1;
}
 
/* Versteckt den Standard-Link-Text "[Anzeigen]" / "[Verbergen]" */
.mw-collapsible.modern-box .mw-collapsible-toggle-text {
.mw-collapsible.modern-box .mw-collapsible-toggle-text {
     display: none;
     display: none;
}
}


/* Erstellt das Pfeil-Icon mit einem CSS-Pseudo-Element */
/* Erstellt das Pfeil-Icon (Chevron) als Ersatz für den Text */
.mw-collapsible.modern-box > .mw-collapsible-toggle::after {
.mw-collapsible.modern-box > .mw-collapsible-toggle::after {
     content: '\\25B6'; /* Unicode-Zeichen für Pfeil nach rechts */
     content: ''; /* Unicode Chevron-Zeichen */
     position: absolute;
     position: absolute;
     right: 18px;
     right: 20px;
     top: 50%;
     top: 50%;
     transform: translateY(-50%) rotate(0deg);
    font-size: 28px;
     transition: transform 0.2s ease-in-out;
    font-weight: bold;
    font-size: 12px;
    color: #888;
    color: #555;
    line-height: 1;
     transform: translateY(-50%) rotate(0deg); /* Startposition (geschlossen) */
     transition: transform 0.2s ease-in-out; /* Flüssige Animation */
}
}


/* Dreht das Pfeil-Icon, wenn der Inhalt ausgeklappt ist */
/* Dreht das Pfeil-Icon um 90 Grad, wenn der Inhalt ausgeklappt ist */
.mw-collapsible.modern-box:not(.mw-collapsed) > .mw-collapsible-toggle::after {
.mw-collapsible.modern-box:not(.mw-collapsed) > .mw-collapsible-toggle::after {
     transform: translateY(-50%) rotate(90deg);
     transform: translateY(-50%) rotate(90deg);
Line 60: Line 64:
/* Styling für den Inhaltsbereich */
/* Styling für den Inhaltsbereich */
.mw-collapsible.modern-box .mw-collapsible-content {
.mw-collapsible.modern-box .mw-collapsible-content {
     padding: 0 18px 15px 18px;
     padding: 15px 20px;
    border-top: 1px solid #e1e1e1;
     margin: 0; /* Setzt den Standard-Margin zurück */
     margin-top: 0;
}
}

Revision as of 14:05, 15 October 2025

/* CSS placed here will be applied to all skins */
#ca-history { display: none !important;} 
#ca-viewsource { display: none !important; }
#ca-talk { display: none !important; }


/* fuer vector legacy, um logo richtig darzustellen */ 
#p-logo a {
    background-size: contain !important; /* skaliert das Bild passend */
    background-position: center center;
}


/* fuer "quickstart" auf startpage
/* Grund-Styling für den gesamten aufklappbaren Container */
.mw-collapsible.modern-box {
    border: 1px solid #e1e1e1; /* Ein heller, dezenter Rand */
    border-radius: 8px; /* Abgerundete Ecken für ein weicheres Aussehen */
    box-shadow: 0 4px 10px rgba(0,0,0,0.08); /* Moderner Schatten für Tiefe */
    margin: 1em 0;
    background-color: #ffffff; /* Weißer Hintergrund */
    overflow: hidden; /* Stellt sicher, dass sich alles innerhalb der abgerundeten Ecken befindet */
}

/* Styling für den klickbaren Kopfbereich (Titel) */
.mw-collapsible.modern-box > .mw-collapsible-toggle {
    display: block;
    padding: 15px 20px;
    cursor: pointer;
    font-weight: bold;
    position: relative; /* Wichtig für die Positionierung des Icons */
    background-color: #f9f9f9; /* Leicht abgesetzter Hintergrund für den Header */
}

/* Fügt eine feine Linie zwischen Header und Inhalt hinzu, wenn ausgeklappt */
.mw-collapsible.modern-box:not(.mw-collapsed) > .mw-collapsible-toggle {
    border-bottom: 1px solid #e1e1e1;
}

/* Versteckt den Standard-Link-Text "[Anzeigen]" / "[Verbergen]" */
.mw-collapsible.modern-box .mw-collapsible-toggle-text {
    display: none;
}

/* Erstellt das Pfeil-Icon (Chevron) als Ersatz für den Text */
.mw-collapsible.modern-box > .mw-collapsible-toggle::after {
    content: '›'; /* Unicode Chevron-Zeichen */
    position: absolute;
    right: 20px;
    top: 50%;
    font-size: 28px;
    font-weight: bold;
    color: #888;
    line-height: 1;
    transform: translateY(-50%) rotate(0deg); /* Startposition (geschlossen) */
    transition: transform 0.2s ease-in-out; /* Flüssige Animation */
}

/* Dreht das Pfeil-Icon um 90 Grad, wenn der Inhalt ausgeklappt ist */
.mw-collapsible.modern-box:not(.mw-collapsed) > .mw-collapsible-toggle::after {
    transform: translateY(-50%) rotate(90deg);
}

/* Styling für den Inhaltsbereich */
.mw-collapsible.modern-box .mw-collapsible-content {
    padding: 15px 20px;
    margin: 0; /* Setzt den Standard-Margin zurück */
}