Zum Inhalt springen


MediaWiki:Common.css: Unterschied zwischen den Versionen

Aus Firestone Idle RPG Wiki
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. */
/* ==== Sidebar-Collapser (Vector-2022) ==== */
/* ==== Sidebar-Collapser (Vector-2022) – v7 ==== */


.kr-sb .kr-head{
.kr-sb .kr-head{
   position: relative;
   position: relative;
   display: flex; align-items: center; gap: .5rem;
   display: flex; align-items: center; gap: .5rem;
   /* rechter Gutter: Link endet VOR der Toggle-Zone */
   padding-right: 2.25rem;              /* Platz für Pfeil/Hit-Zone rechts */
   padding-right: 2.25rem;
   cursor: pointer;                     /* Kopfzeile zeigt Finger */
}
}


/* Link/Titel normal klickbar */
.kr-sb .kr-head > a,
.kr-sb .kr-head > a,
.kr-sb .kr-head > .kr-title{ pointer-events: auto; }
.kr-sb .kr-head > .kr-title{ pointer-events: auto; }
Zeile 16: Zeile 15:
   position: absolute; top: 50%; right: .25rem; transform: translateY(-50%);
   position: absolute; top: 50%; right: .25rem; transform: translateY(-50%);
   display: grid; place-items: center;
   display: grid; place-items: center;
   width: 2rem; height: 2rem;               /* große Touch-Fläche */
   width: 2rem; height: 2rem;
   border: 0; background: transparent; padding: 0;
   border: 0; background: transparent; padding: 0;
   cursor: pointer; z-index: 2;
   cursor: pointer; z-index: 2;
   font-size: 1em;                           /* gleiche Größe wie Text */
   font-size: 1em;                     /* an Textgröße gekoppelt */
   line-height: 1;
   line-height: 1;
}
}
.kr-sb .kr-head > .kr-arrow::before{
.kr-sb .kr-head > .kr-arrow::before{
   content: "▾"; display: block;
   content: "▾"; display: block;
Zeile 28: Zeile 26:
}
}


/* Zu = nach links (‹) */
/* Zugeklappt: nach LINKS (‹) — 90°, nicht -90° */
.kr-sb li.is-collapsed > .kr-head > .kr-arrow::before{
.kr-sb li.is-collapsed > .kr-head > .kr-arrow::before{
   transform: rotate(-90deg);
   transform: rotate(90deg);
}
}


/* Unsichtbare Klickfläche rechts (gleiche Zone wie Pfeil) */
/* Unsichtbare Hit-Zone rechts – ebenfalls Click/Finger */
.kr-sb .kr-head > .kr-hit{
.kr-sb .kr-head > .kr-hit{
   position: absolute; top: 50%; right: .125rem; transform: translateY(-50%);
   position: absolute; top: 50%; right: .125rem; transform: translateY(-50%);
   width: 2.25rem; height: 2.25rem;
   width: 2.25rem; height: 2.25rem;
   cursor: pointer; z-index: 1;             /* unter dem Button, aber vor dem Link */
   cursor: pointer; z-index: 1;
}
}


/* Unterlisten */
/* Unterliste */
.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; }
/* Titel ohne Link */
.kr-sb .kr-title{ font-weight: 600; }
.kr-sb .kr-title{ font-weight: 600; }

Version vom 10. Oktober 2025, 18:30 Uhr

/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */
/* ==== Sidebar-Collapser (Vector-2022) – v7 ==== */

.kr-sb .kr-head{
  position: relative;
  display: flex; align-items: center; gap: .5rem;
  padding-right: 2.25rem;              /* Platz für Pfeil/Hit-Zone rechts */
  cursor: pointer;                     /* Kopfzeile zeigt Finger */
}

.kr-sb .kr-head > a,
.kr-sb .kr-head > .kr-title{ pointer-events: auto; }

.kr-sb .kr-head > .kr-arrow{
  position: absolute; top: 50%; right: .25rem; transform: translateY(-50%);
  display: grid; place-items: center;
  width: 2rem; height: 2rem;
  border: 0; background: transparent; padding: 0;
  cursor: pointer; z-index: 2;
  font-size: 1em;                      /* an Textgröße gekoppelt */
  line-height: 1;
}
.kr-sb .kr-head > .kr-arrow::before{
  content: "▾"; display: block;
  transition: transform .15s ease;
}

/* Zugeklappt: nach LINKS (‹) — 90°, nicht -90° */
.kr-sb li.is-collapsed > .kr-head > .kr-arrow::before{
  transform: rotate(90deg);
}

/* Unsichtbare Hit-Zone rechts – ebenfalls Click/Finger */
.kr-sb .kr-head > .kr-hit{
  position: absolute; top: 50%; right: .125rem; transform: translateY(-50%);
  width: 2.25rem; height: 2.25rem;
  cursor: pointer; z-index: 1;
}

/* Unterliste */
.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; }

/* Titel ohne Link */
.kr-sb .kr-title{ font-weight: 600; }