/** * Footer Partner Component * * Der Kooperationshinweis der Fusszeile steht seit #111 in EINEM Absatz * ("Eine Kooperation von und "). Vorher war der Satz auf * drei Absaetze verteilt. * * Damit das Layout unveraendert bleibt, uebernimmt der Absatz selbst die * Spalte, die vorher .kbd-footer__col--partners gebildet hat: gleiche * Flussrichtung, gleicher Abstand (10px), gleiche Ausrichtung. * * Wird in inc/filters.php eingebunden - assets/css/components/ wird weder von * gulp noch von functions.php erfasst. Laedt nach assets/css/blocks/footer.css. */ .kbd-footer__col--partners > .kbd-footer__coop { display: flex; flex-direction: column; align-items: stretch; gap: 10px; } /* Die Logo-Links waren vorher direkte Flex-Kinder der Spalte; als Kinder des Absatzes brauchen sie dieselbe Blockdarstellung. */ .kbd-footer__coop .kbd-footer__logo-wrapper { display: flex; } /* Das "und" war vorher ein Absatz und uebernahm damit Schriftgroesse und Zeilenhoehe des Fliesstexts: theme.json setzt fuer Absaetze global `:root :where(p){font-size:18px}`, und diese Regel schlug die 13px aus footer.css, weil die global-styles spaeter im stehen. Als span greift sie nicht mehr - dadurch setzten sich die 13px durch und das "und" wurde sichtbar kleiner (#111). inherit uebernimmt die Groesse des umgebenden Absatzes und stellt den Zustand von vor dem Umbau wieder her. */ .kbd-footer__coop .kbd-footer__and { display: block; font-size: inherit; line-height: calc( var( --wp--preset--font-size--body ) * 1.6 ); } /* Tablet Portrait: die Spalte hatte hier 20px Abstand. */ @media ( max-width: 768px ) { .kbd-footer__col--partners > .kbd-footer__coop { gap: 20px; } /* Im Entwurf ist das "und" ab hier nicht mehr sichtbar. Frueher stand dafuer `display: none` - der Satz waere damit fuer Screenreader unvollstaendig. Stattdessen nur optisch entfernen, vorgelesen wird er weiterhin ganz. */ .kbd-footer__coop .kbd-footer__and { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect( 0 0 0 0 ); clip-path: inset( 50% ); white-space: nowrap; } } /* Mobile: ebenfalls 20px. */ @media ( max-width: 480px ) { .kbd-footer__col--partners > .kbd-footer__coop { gap: 20px; } }