From 049d94b7bf7e5df01392de4d8639beba713c46ee Mon Sep 17 00:00:00 2001 From: Lucas Orth Date: Tue, 22 Sep 2026 11:39:00 +0200 Subject: [PATCH] Plugin 1.2 (FAQ ohne Ueberschrift, Plus/Minus) und Beitragslayout-CSS --- wordpress/beitragslayout.css | 164 +++++++++++++++++++++++++++ wordpress/skrift-ratgeber-felder.php | 37 +----- 2 files changed, 167 insertions(+), 34 deletions(-) create mode 100644 wordpress/beitragslayout.css diff --git a/wordpress/beitragslayout.css b/wordpress/beitragslayout.css new file mode 100644 index 0000000..4b39e7e --- /dev/null +++ b/wordpress/beitragslayout.css @@ -0,0 +1,164 @@ +/* Skrift Ratgeber: Beitragslayout + Werte aus dem Elementor-Kit von skrift.de, Stand 22.09.2026. + Einfuegen: Theme Builder > Einzelbeitrag > Seiteneinstellungen > Erweitert > Benutzerdefiniertes CSS */ + +/* ---------- Titel: globale Typografie "H1" ---------- */ +.elementor-widget-theme-post-title .elementor-heading-title { + font-family: "Bitter", serif; + font-size: 45px; + line-height: 54px; + letter-spacing: 0.6px; + color: #1E3A6A; +} + +/* ---------- Beitragsinhalt: Fliesstext "Text" ---------- */ +.elementor-widget-theme-post-content { + font-family: "Work Sans", sans-serif; + font-size: 18px; + font-weight: 400; + line-height: 1.65; + color: #1A1A1A; +} +.elementor-widget-theme-post-content p { + margin: 0 0 1.1em; +} + +/* H2: globale Typografie "Primaer" */ +.elementor-widget-theme-post-content h2 { + font-family: "Bitter", serif; + font-size: 36px; + font-weight: 600; + line-height: 46px; + color: #1E3A6A; + margin: 1.8em 0 0.5em; +} + +/* H3: globale Typografie "Sekundaere" */ +.elementor-widget-theme-post-content h3 { + font-family: "Bitter", serif; + font-size: 27px; + font-weight: 400; + line-height: 32px; + color: #1E3A6A; + margin: 1.5em 0 0.4em; +} +.elementor-widget-theme-post-content > :first-child { + margin-top: 0; +} + +/* Links */ +.elementor-widget-theme-post-content a { + color: #1E3A6A; + text-decoration: underline; + text-underline-offset: 3px; +} +.elementor-widget-theme-post-content a:hover { + color: #1E50A5; +} + +/* Listen */ +.elementor-widget-theme-post-content ul, +.elementor-widget-theme-post-content ol { + margin: 0 0 1.1em; + padding-left: 1.3em; +} +.elementor-widget-theme-post-content li { + margin-bottom: 0.4em; +} + +/* Tabellen */ +.elementor-widget-theme-post-content table { + width: 100%; + border-collapse: collapse; + margin: 1.2em 0 1.6em; + font-size: 16px; + line-height: 1.5; + background: #FFFEFD; +} +.elementor-widget-theme-post-content th { + background: #EFEAE5; + color: #1E3A6A; + font-weight: 600; + text-align: left; +} +.elementor-widget-theme-post-content th, +.elementor-widget-theme-post-content td { + padding: 12px 14px; + border: 1px solid #C9B7A8; + vertical-align: top; +} + +/* ---------- Kurzantwort ---------- */ +.elementor .skrift-kurzantwort { + background: #EFEAE5; + border-left: 3px solid #1E3A6A; + padding: 20px 24px; + font-family: "Work Sans", sans-serif; + font-size: 18px; + line-height: 1.6; + color: #1A1A1A; +} +.elementor .skrift-kurzantwort p:last-child { + margin-bottom: 0; +} + +/* ---------- FAQ ---------- */ +.elementor .skrift-faq__eintrag { + border-bottom: 1px solid #C9B7A8; +} +.elementor .skrift-faq__eintrag:first-child { + border-top: 1px solid #C9B7A8; +} +/* Frage: globale Typografie "Third" */ +.elementor .skrift-faq__frage { + font-family: "Bitter", serif; + font-size: 22px; + font-weight: 400; + line-height: 32px; + color: #1E3A6A; + padding: 18px 0; +} +.elementor .skrift-faq__frage:hover { + color: #1E50A5; +} +.elementor .skrift-faq__frage::after { + color: #1E3A6A; +} +.elementor .skrift-faq__antwort { + font-family: "Work Sans", sans-serif; + font-size: 18px; + line-height: 1.65; + color: #1A1A1A; + padding: 0 2.5em 20px 0; +} + +/* ---------- Mobil ---------- */ +@media (max-width: 767px) { + .elementor-widget-theme-post-title .elementor-heading-title { + font-size: 32px; + line-height: 1.1em; + } + .elementor-widget-theme-post-content { + font-size: 17px; + } + .elementor-widget-theme-post-content h2 { + font-size: 28px; + line-height: 36px; + } + .elementor-widget-theme-post-content h3 { + font-size: 22px; + line-height: 30px; + } + .elementor-widget-theme-post-content table { + display: block; + overflow-x: auto; + font-size: 15px; + } + .elementor .skrift-faq__frage { + font-size: 19px; + line-height: 27px; + } + .elementor .skrift-kurzantwort { + padding: 16px 18px; + } +} diff --git a/wordpress/skrift-ratgeber-felder.php b/wordpress/skrift-ratgeber-felder.php index 57a127e..c1c8ed1 100644 --- a/wordpress/skrift-ratgeber-felder.php +++ b/wordpress/skrift-ratgeber-felder.php @@ -2,7 +2,7 @@ /** * Plugin Name: Skrift Ratgeber Felder * Description: Meta-Felder fuer Ratgeberartikel (kurzantwort, faq, cta_ziel, stand_datum) mit Eingabebox im Editor, Shortcodes und Elementor-Widgets, die das FAQ-Feld automatisch als Umschalter ausgeben. - * Version: 1.1.0 + * Version: 1.2.0 * Author: Lucas Orth * * Ablage: wp-content/mu-plugins/skrift-ratgeber-felder.php @@ -230,8 +230,8 @@ function skrift_faq_basis_css() { . '.skrift-faq__eintrag{border-bottom:1px solid rgba(0,0,0,.12)}' . '.skrift-faq__frage{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;font-weight:600}' . '.skrift-faq__frage::-webkit-details-marker{display:none}' - . '.skrift-faq__frage::after{content:"";flex:0 0 auto;width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s}' - . '.skrift-faq__eintrag[open] .skrift-faq__frage::after{transform:rotate(-135deg)}' + . '.skrift-faq__frage::after{content:"+";flex:0 0 auto;width:1em;text-align:center;font-weight:400;font-size:1.4em;line-height:1}' + . '.skrift-faq__eintrag[open] .skrift-faq__frage::after{content:"\\2212"}' . '.skrift-faq__antwort{padding:0 0 16px}' . '.skrift-faq__antwort>*:last-child{margin-bottom:0}' . ''; @@ -373,17 +373,6 @@ add_action( 'elementor/widgets/register', function ( $widgets_manager ) { 'type' => $C::RAW_HTML, 'raw' => 'Fragen und Antworten kommen aus dem Meta-Feld faq des jeweiligen Beitrags.', ) ); - $this->add_control( 'titel', array( - 'label' => 'Ueberschrift', - 'type' => $C::TEXT, - 'default' => 'Häufige Fragen', - ) ); - $this->add_control( 'titel_tag', array( - 'label' => 'HTML-Tag der Ueberschrift', - 'type' => $C::SELECT, - 'default' => 'h2', - 'options' => array( 'h2' => 'H2', 'h3' => 'H3', 'h4' => 'H4', 'div' => 'div' ), - ) ); $this->add_control( 'erste_offen', array( 'label' => 'Erste Frage geoeffnet', 'type' => $C::SWITCHER, @@ -396,24 +385,6 @@ add_action( 'elementor/widgets/register', function ( $widgets_manager ) { ) ); $this->end_controls_section(); - $this->start_controls_section( 'stil_titel', array( 'label' => 'Ueberschrift', 'tab' => $C::TAB_STYLE ) ); - $this->add_group_control( \Elementor\Group_Control_Typography::get_type(), array( - 'name' => 'titel_typo', - 'selector' => '{{WRAPPER}} .skrift-faq__titel', - ) ); - $this->add_control( 'titel_farbe', array( - 'label' => 'Farbe', - 'type' => $C::COLOR, - 'selectors' => array( '{{WRAPPER}} .skrift-faq__titel' => 'color: {{VALUE}};' ), - ) ); - $this->add_responsive_control( 'titel_abstand', array( - 'label' => 'Abstand darunter', - 'type' => $C::SLIDER, - 'size_units' => array( 'px', 'em' ), - 'selectors' => array( '{{WRAPPER}} .skrift-faq__titel' => 'margin-bottom: {{SIZE}}{{UNIT}};' ), - ) ); - $this->end_controls_section(); - $this->start_controls_section( 'stil_frage', array( 'label' => 'Frage', 'tab' => $C::TAB_STYLE ) ); $this->add_group_control( \Elementor\Group_Control_Typography::get_type(), array( 'name' => 'frage_typo', @@ -501,8 +472,6 @@ add_action( 'elementor/widgets/register', function ( $widgets_manager ) { } echo skrift_faq_html( $faq, array( // phpcs:ignore WordPress.Security.EscapeOutput - 'titel' => (string) ( $s['titel'] ?? '' ), - 'titel_tag' => (string) ( $s['titel_tag'] ?? 'h2' ), 'erste_offen' => 'yes' === ( $s['erste_offen'] ?? '' ), 'schema' => 'yes' === ( $s['schema'] ?? '' ) && ! $bearbeiten, ) );