/* Theme Name: keySquare Master Theme URI: Author: keySquare Author URI: Description: The Master Theme for all keySquare Press Rooms Requires at least: 6.9 Tested up to: 6.9 Requires PHP: 7.2 Version: 1.21 Text Domain: keysquare-master Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news /* * Link styles * https://github.com/WordPress/gutenberg/issues/42319 */ a { text-decoration-thickness: 1px !important; text-underline-offset: .1em; } /* Focus styles */ :where(.wp-site-blocks *:focus) { outline-width: 2px; outline-style: solid; } /* Increase the bottom margin on submenus, so that the outline is visible. */ .wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) { margin-bottom: 3px; } /* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */ .wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content { outline-offset: 4px; } /* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */ .wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content { outline-offset: 0; } /* * Progressive enhancement to reduce widows and orphans * https://github.com/WordPress/gutenberg/issues/55190 */ h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p { text-wrap: pretty; } /*h2.wp-block-post-title { hyphens: auto; }*/ /* * Change the position of the more block on the front, by making it a block level element. * https://github.com/WordPress/gutenberg/issues/65934 */ .more-link { display: block; } /* * Prevents unnecessary scrollbars while handling long lines of preformatted text. * https://core.trac.wordpress.org/ticket/63875 */ :where(pre) { overflow-x: auto; } /* * Style search result filters */ .search-filters__fields { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end; } .search-filters__field { display: flex; flex-direction: column; gap: 0.25rem; } .search-filters__field label { font-size: 0.85rem; font-weight: 600; } .search-filters__field select, .search-filters__field button { padding: 0.4rem 0.75rem; border: 1px solid currentColor; border-radius: 4px; font-size: 0.9rem; } /* Style Search results */ .search-results .wp-block-post-featured-image img { aspect-ratio: 16 / 9; width: 100%; height: auto; object-fit: cover; display: block; } @media (min-width: 1300px) { .custom-search-results { padding-left: 40px; padding-right: 40px; } } /* Such-Settings-Zeile bricht um auf kleineren Bildschirmen */ @media (max-width: 981px) { .wp-block-group.is-layout-flex:has(> .wp-block-search):has(> .wp-block-group) { flex-direction: column !important; flex-wrap: wrap !important; align-items: flex-start !important; justify-content: flex-start !important; } } /*Spalten im Header und Footer brechen um auf Mobile*/ @media (max-width: 981px) { .wp-block-group.is-layout-flex.ks-header-row { flex-direction: column !important; flex-wrap: wrap !important; align-items: flex-start !important; justify-content: flex-start !important; } /* Im Editor gesetzte Breiten (flex-basis, z. B. 180px am Site-Logo) würden bei flex-direction: column zur HÖHE und erzeugen Phantom-Abstand – im Stapel-Modus neutralisieren. */ .wp-block-group.is-layout-flex.ks-header-row > * { flex-basis: auto !important; } } /* Verschachtelte ks-header-row (Zeile in Zeile) – gilt auf ALLEN Breiten: wird nicht gestapelt, sondern bricht nur bei Platzmangel um (wie die Suchfilter). Höhere Spezifität überschreibt Stapel-Regel, is-nowrap und die :has()-Suchzeilen-Regel. align-items: flex-end = Felder bündig an der Unterkante (ersetzt den 4px-margin-bottom-Ausgleich am Suchfeld); gap: 1rem = Abstand horizontal UND zwischen Umbruch-Zeilen (ersetzt das margin-right an der Kategorieliste). */ .wp-block-group.is-layout-flex.ks-header-row .wp-block-group.is-layout-flex.ks-header-row { flex-direction: row !important; flex-wrap: wrap !important; align-items: flex-end !important; gap: 1rem; } @media (max-width: 981px) { .footer-columns { flex-direction: column !important; flex-wrap: wrap !important; align-items: flex-start !important; justify-content: flex-start !important; } } /* Complianz-Platzhalter fixen */ :has(.cmplz-blocked-content-container) .wp-embed-responsive .wp-embed-aspect-16-9 .wp-block-embed__wrapper:before { padding-top: unset; } /* Beitragsbilder in Listen in der Größe vereinheitlichen */ .wp-block-post-featured-image img { aspect-ratio: 16 / 9 !important; object-fit: cover; width: 100%; height: auto; display: block; } /* Beitragstitel in Übersichten auf max. 4 Zeilen kürzen (…), netzwerkweit. Geclampt wird der im Titel (mit :not(:has(a))-Fallback für unverlinkte Titel), NICHT die h2 selbst: Deren display wird effektiv als flow-root gerendert, wodurch -webkit-line-clamp dort wirkungslos bleibt. .wp-block-post = jede Karte im Query Loop (auch Load-More-Klone); Titel auf Einzelbeitragsseiten liegen nicht in .wp-block-post und bleiben unberührt. */ .wp-block-post .wp-block-post-title a, .wp-block-post .wp-block-post-title:not(:has(a)) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; } /* Beiträge in Listen gleich groß machen (MSI + Uelzener) */ /* Spalten gleich hoch */ .wp-block-columns:has(.msi-card-hover), .wp-block-columns:has(.uelz-card) { align-items: stretch; } /* Höhe bis zur Karte durchreichen */ .wp-block-column:has(.msi-card-hover), .wp-block-query:has(.msi-card-hover), .msi-card-hover, .msi-card-hover > .wp-block-post, .wp-block-column:has(.uelz-card), .wp-block-query:has(.uelz-card), .uelz-card, .uelz-card > .wp-block-post { display: flex; flex-direction: column; } .wp-block-query:has(.msi-card-hover), .msi-card-hover, .msi-card-hover > .wp-block-post, .wp-block-query:has(.uelz-card), .uelz-card, .uelz-card > .wp-block-post { flex: 1 0 auto; } /* Datum an den unteren Rand */ .msi-card-hover .wp-block-post-date, .uelz-card .wp-block-post-date { margin-top: auto; } /* ────────────────────────────────────────────────────────────────────────── Netzwerkweit NUR das Dropdown-Icon vereinheitlichen – KEIN Box-Styling. appearance:none ist Pflicht, um den nativen Pfeil zu ersetzen. Farben/Rahmen/ BG/Font/Padding der Box bleiben bewusst draußen, damit jeder Raum die Box weiterhin frei stylen kann. Pfeilfarbe %231e1e1e ggf. pro Subsite anpassen. color-scheme + background-color:transparent sind Cross-Browser-Normalisierung (KEINE erzwungene Box-Farbe!): transparent entfernt Firefox' hellgrauen UA- Default-Hintergrund fuer Formularfelder, sodass der Seitenhintergrund wie in Chrome durchscheint. Raeume koennen background-color frei ueberschreiben. */ .wp-site-blocks select { appearance: none; -webkit-appearance: none; -moz-appearance: none; color-scheme: light; background-color: transparent; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2 4.5L6 8.5L10 4.5' stroke='%231e1e1e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.5rem center; background-size: 0.7rem auto; } /* Platz für das Icon NICHT über die Box, sondern über die Einträge schaffen: Die Auto-Breite des