Bakehouse-CSS

    Template-Klassen

    Die folgenden Klassen sind für den Integrator beim Templating bei Bedarf anwendbar:

    bhe-content-noteditable
    Wird verwendet, um für den/die Redakteur:innen nicht wartbare – also vorzugsweise statische Bereiche – zu kennzeichnen. Im aktivierten edit Editier-Modus werden diese Bereiche gegenüber wartbaren Sektionen visuell zurückgenommen. 

    bhe-hideable 
    Die Front-End-Editing-Philosophie bringt für Redakteur:innen viele Vorteile. Jedoch besteht bei komplexen Template-Strukturen die Gefahr, dass Content-Bereiche und Content-Elemente teilweise überdeckt und damit die Wartung erschwert wird. Sektionen und Strukturen des Templates, welche für eine reibungslose Wartung temporär durch den/die Redakteur:in ausblendbar sein müssen, werden mit der Klasse bhe-hideable versehen. Ist die Klasse im Template integriert, wird die Werkzeugleiste um die Schaltfläche edithelperweitert, welche die besagte(n) Sektion(en) ein- und ausblendbar macht. 

    lightboxgroup
    Das Bakehouse liefert werksseitig die JavaScript-Lightbox-Library fancybox aus. Im Standardverhalten werden alle Elemente mit dem a-Tag-Attribut target="lightbox" in der Navigation der geöffneten Lightbox berücksichtigt. Alternativ können Elemente innerhalb von Lightbox-Gruppen zusammengefasst werden. Dadurch wird nur durch Elemente geschalten, die sich innerhalb der Klasse lightboxgroup befinden.

    bh-doubletap
    Projekte besitzen mitunter Navigationsstrukturen und Interaktions-Elemente mit :hover Funktionalität. Für Touch-Geräte wird diese Hover-Funktion mit der Klasse bh-doubletap simuliert.

    bh-search-exclude
    Inhalt, der mit dieser Klasse versehen wird, wird von der Bakehouse-Suche nicht berücksichtigt. 

    Body-Tag-Klassen

    bh-femode
    Die Klasse wird automatisiert auf den <body> gelegt, wenn man nicht eingeloggt ist.

    bh-bemode
    Die Klasse wird automatisiert auf den <body> gelegt, wenn man eingeloggt ist.

    bhe-state-editing
    Die Klasse wird dann auf den <body> gelegt, wenn man sich im edit "Editier-Modus" des Bakehouse befindet.

    bhe-state-dragging
    Die Klasse wird für den Zeitraum auf den <body> gelegt, während ein Content-Element aktiv per Drag & Drop verschoben wird. 

    bhe-editbg
    Die Klasse wird auf den <body> gelegt, sobald über die Werkzeugleiste bhe-hideable-Elemente ausgeblendet werden.

    bhe-state-show-hidden-content
    Die Klasse wird auf den <body> gelegt, sobald die Funktion "versteckte Elemente anzeigen" in der Werkzeugleiste aktiviert wurde.

    Content-Element-Klassen

    bhe-state-current-editing-element
    Sobald ein Content-Element inhaltlich bearbeitet wird, wird die Klasse auf das betreffende Element gelegt. Sie eignet sich beispielsweise bei komplexen Elementen mit Animationen und schwer erreichbaren Content-Sektionen, um die Wartung und Befüllung zu vereinfachen.

    Interface-Variablen

    --bh-safe-area-inset-top
    Gibt die Höhe des Bereichs an, welcher vom Bakehouse-Interface am oberen Bildschirmrand eingenommen wird.

    --bh-element-toolbar-height
    Gibt die Höhe der Toolbar von Content-Elementen an.