Sie sind hier: Start Komponenten
Theme "lightBrown" erfolgreich aktiviert
Um das Theme zu aktivieren, muss folgende CSS-Datei eingebunden werden:


<!-- CSS link (HTML header), replace with "https://style.brandenburg.de/%VERSION_ALIAS%/css/app.css" -->

<link type="text/css" rel="stylesheet" href="https://style.brandenburg.de/%VERSION_ALIAS%/css/themes/lightBrown.css"/>
                

5.9 Meldungen

Meldungen informieren die Besucherinnen und Besucher der Seite nach einer Interaktion über deren aktuellen Zustand. Sie können auch zur Informationswiedergabe sowie Warnung verwendet werden.

Erfolgreich (#DAEACE)
Aktion erfolgreich abgeschlossen.
Information (#FFFAD1)
Bitte beachten Sie diesen Hinweis.
Warnung (#FFEDD1)
Bitte überprüfen Sie Ihre Eingaben.
Fehler 404 (#FACFBB)
Diese Seite wurde nicht gefunden.
  • Quelltext

    <div data-alert class="alert-box bb-alert success (#DAEACE)">
        <div class="bb-alert-content">
            <div class="bb-alert-title" title="Erfolgreich (#DAEACE)"> Erfolgreich (#DAEACE)</div>
            <div class="bb-alert-description">Aktion erfolgreich abgeschlossen.</div>
        </div>
    </div>
    
    <div data-alert class="alert-box bb-alert information (#FFFAD1)">
        <div class="bb-alert-content">
            <div class="bb-alert-title" title="Information (#FFFAD1)"> Information (#FFFAD1)</div>
            <div class="bb-alert-description">Bitte beachten Sie diesen Hinweis.</div>
        </div>
    </div>
    
    <div data-alert class="alert-box bb-alert warning (#FFEDD1)">
        <div class="bb-alert-content">
            <div class="bb-alert-title" title="Warnung (#FFEDD1)"> Warnung (#FFEDD1)</div>
            <div class="bb-alert-description">Bitte überprüfen Sie Ihre Eingaben.</div>
        </div>
    </div>
    
    <div data-alert class="alert-box bb-alert error (#FACFBB)">
        <div class="bb-alert-content">
            <div class="bb-alert-title" title="Fehlermeldung (#FACFBB)">Fehler 404  (#FACFBB)</div>
            <div class="bb-alert-description">Diese Seite wurde nicht gefunden.</div>
        </div>
    </div>
    
  • Benötigtes Javascript

    <script type="text/javascript" src="style.brandenburg.de/2_3/js/vendors/2jquery.min.js"></script>
     <script type="text/javascript" src="style.brandenburg.de/2_3/js/vendors/5foundation.min.js"></script>
     <script type="text/javascript" src="style.brandenburg.de/2_3/js/finalApp.js"></script>
    
Aufbau
  • Jede Meldung zeigt einen Zustand im Sinne eines Erfolgs, Fehlers, einer Information oder Warnung.
  • Der Hintergrund der Meldung ist in dem Farbschema, wie oben dargestellt, zu realisieren. Die Farbcodes sind in der Grafik enthalten.
  • Links und rechts werden einheitliche Symbole zur visuellen Unterstützung der Bedeutung angezeigt.
  • Der Rahmen ist HELLGRAU einzufärben.
Spezifische Anforderungen

keine Beschränkungen

Barrierefreiheit

keine Beschränkungen

Aktionsverhalten

keine Beschränkungen

Responsive Design

Die Icons können auf kleinen Geräten ausgeblendet werden.