/* * Bananenkrieg – Zusatz-Styles * Warnstreifen-Motiv, Hell/Dunkel-Umschalter, Story-Schutz */ /* ---------- Warnstreifen (Markenzeichen) ---------- */ .bk-stripes { height: 10px; background: repeating-linear-gradient( 45deg, var(--wp--preset--color--banana) 0, var(--wp--preset--color--banana) 16px, var(--wp--preset--color--base) 16px, var(--wp--preset--color--base) 32px ); } /* ---------- Heller Lesemodus ---------- */ /* Wird per JS über data-bk-mode="light" am aktiviert. Wir überschreiben die theme.json-Farbvariablen, dadurch folgt das gesamte Theme automatisch. */ html[data-bk-mode="light"] body { --wp--preset--color--base: #faf7ef; --wp--preset--color--surface: #ffffff; --wp--preset--color--contrast: #1a1a1a; --wp--preset--color--muted: #5f5e5a; --wp--preset--color--line: #ddd8c8; } /* Sanfter Übergang beim Umschalten */ body, .wp-block-group, .wp-block-post-content { transition: background-color 0.25s ease, color 0.25s ease; } /* ---------- Moduswechsel-Button ---------- */ .bk-mode-toggle { background: transparent; border: 1px solid var(--wp--preset--color--line); color: var(--wp--preset--color--contrast); border-radius: 4px; padding: 0.4rem 0.8rem; font-size: 0.85rem; cursor: pointer; font-family: var(--wp--preset--font-family--tech); } .bk-mode-toggle:hover { border-color: var(--wp--preset--color--banana); color: var(--wp--preset--color--banana); } /* Beschriftung je nach Modus umschalten */ .bk-mode-toggle .bk-label-light { display: inline; } .bk-mode-toggle .bk-label-dark { display: none; } html[data-bk-mode="light"] .bk-mode-toggle .bk-label-light { display: none; } html[data-bk-mode="light"] .bk-mode-toggle .bk-label-dark { display: inline; } /* ---------- Story-Bereich: Schutz vor einfachem Kopieren ---------- */ /* Gilt nur innerhalb der Kapitel-Ansicht (.bk-story). */ .bk-story .wp-block-post-content, .bk-story .wp-block-post-title { -webkit-user-select: none; -moz-user-select: none; user-select: none; -webkit-touch-callout: none; /* iOS: Kontextmenü bei langem Druck */ } /* Bilder im Story-Bereich: Drag & Drop unterbinden */ .bk-story img { -webkit-user-drag: none; user-drag: none; pointer-events: none; } /* Verlinkte Bilder sollen klickbar bleiben */ .bk-story a img { pointer-events: auto; } /* ---------- Leseansicht-Feinschliff ---------- */ .bk-story .wp-block-post-content > p { margin-bottom: 1.4em; } /* Kapitel-Kicker (z. B. "KAPITEL 03") */ .bk-kicker { font-family: var(--wp--preset--font-family--tech); font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--wp--preset--color--banana); } /* Karten in der Kapitelübersicht */ .bk-card { background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--line); border-radius: 6px; overflow: hidden; }