MediaWiki:Common.css: Unterschied zwischen den Versionen
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
| Zeile 1: | Zeile 1: | ||
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | /* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | ||
/* | /* Kopf bleibt Flex */ | ||
.kr-sb .kr-head{ display:flex; align-items:center; gap:.5rem; } | |||
/* Label/Link links, füllt Breite */ | |||
/* Label/Link links, | |||
.kr-sb .kr-head > a, | .kr-sb .kr-head > a, | ||
.kr-sb .kr-head > .kr-title{ | .kr-sb .kr-head > .kr-title{ | ||
order:1; | order:1; | ||
flex:1 1 auto; | flex:1 1 auto; | ||
min-width:0; | min-width:0; | ||
padding-right:.5rem; /* Platz, damit Link nicht unter den Pfeil reicht */ | |||
} | } | ||
/* Pfeil ganz rechts, | /* Pfeil ganz rechts, eigene Klickfläche, über dem Link */ | ||
.kr-sb .kr-head > .kr-arrow{ | .kr-sb .kr-head > .kr-arrow{ | ||
order:2; | order:2; | ||
margin-left:auto; | margin-left:auto; | ||
flex:0 0 1.4em; /* fixe Breite */ | |||
inline-size:1. | inline-size:1.4em; | ||
block-size:1. | block-size:1.4em; | ||
display:inline-grid; | display:inline-grid; | ||
place-items:center; | place-items:center; | ||
border:0; | border:0; background:transparent; padding:.25rem; | ||
cursor:pointer; | |||
position:relative; z-index:2; /* liegt über dem Link */ | |||
line-height:1; | line-height:1; | ||
} | } | ||
/* Symbol & | /* Symbol & Richtung */ | ||
.kr-sb .kr-arrow::before{ | .kr-sb .kr-arrow::before{ content:"▾"; transition:transform .15s ease; } | ||
.kr-sb li.is-collapsed > .kr-head > .kr-arrow::before{ transform:rotate(90deg); } /* ◂ nach links */ | |||
} | |||
.kr-sb li.is-collapsed > .kr-head > .kr-arrow::before{ | |||
} | |||
/* Unterlisten | /* Unterlisten wie gehabt */ | ||
.kr-sb ul.kr-sub{ list-style:none; margin:.25rem 0 .5rem 1rem; padding:0; } | .kr-sb ul.kr-sub{ list-style:none; margin:.25rem 0 .5rem 1rem; padding:0; } | ||
.kr-sb li.is-collapsed > ul.kr-sub{ display:none; } | .kr-sb li.is-collapsed > ul.kr-sub{ display:none; } | ||
.kr-sb .kr-title{ font-weight:600; } | .kr-sb .kr-title{ font-weight:600; } | ||
Version vom 10. Oktober 2025, 17:46 Uhr
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */
/* Kopf bleibt Flex */
.kr-sb .kr-head{ display:flex; align-items:center; gap:.5rem; }
/* Label/Link links, füllt Breite */
.kr-sb .kr-head > a,
.kr-sb .kr-head > .kr-title{
order:1;
flex:1 1 auto;
min-width:0;
padding-right:.5rem; /* Platz, damit Link nicht unter den Pfeil reicht */
}
/* Pfeil ganz rechts, eigene Klickfläche, über dem Link */
.kr-sb .kr-head > .kr-arrow{
order:2;
margin-left:auto;
flex:0 0 1.4em; /* fixe Breite */
inline-size:1.4em;
block-size:1.4em;
display:inline-grid;
place-items:center;
border:0; background:transparent; padding:.25rem;
cursor:pointer;
position:relative; z-index:2; /* liegt über dem Link */
line-height:1;
}
/* Symbol & Richtung */
.kr-sb .kr-arrow::before{ content:"▾"; transition:transform .15s ease; }
.kr-sb li.is-collapsed > .kr-head > .kr-arrow::before{ transform:rotate(90deg); } /* ◂ nach links */
/* Unterlisten wie gehabt */
.kr-sb ul.kr-sub{ list-style:none; margin:.25rem 0 .5rem 1rem; padding:0; }
.kr-sb li.is-collapsed > ul.kr-sub{ display:none; }
.kr-sb .kr-title{ font-weight:600; }