minasa-cms:widget

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

Link zu der Vergleichsansicht

Beide Seiten, vorherige Überarbeitung Vorherige Überarbeitung
minasa-cms:widget [19.05.2026 11:53] – [HTML-Konfigurationsattribute] alexminasa-cms:widget [19.05.2026 11:55] (aktuell) – [HTML-Konfigurationsattribute] alex
Zeile 59: Zeile 59:
 **Beispiel einer Konfiguration:** **Beispiel einer Konfiguration:**
  
 +<file html>
 +    <minasa-widget
 +        minasa-url="https://www.minasa-system.ch"
 +        api-key="jjfufuzrue7647czhd74656"
 +        query-mode="next"
 +        filter-organizer-grup-ids="33,157"
 +        min-date="2026-01-06"
 +        max-date="2026-02-16"
 +        with-tag-filter
 +    ></minasa-widget>
 +</file>
 +
 +==== Styling ====
 +
 +Das Widget ist als WebComponent implementiert und kann in geringem Masse mit CSS angepasst werden. Folgende CSS-Variablen stehen zur Verfügung. Sie müssen nur die Variablen definieren, welche Sie überschreiben wollen. Die hier gezeigten Werte sind die Vorgabewerte.
 +
 +<file css>
 +minasa-widget {
 +    /* Die primäre Farbe für Links, Rahmen etc: */
 +    --mw-primary-color: #e3004f;
 +    /* Hintergrundfarbe des gesamten Widgets:*/
 +    --mw-background-color: transparent;
 +    /* verwendete Textfarbe: */
 +    --mw-text-color: black;
 +    /* Kontrastfarbe für Text auf der Primärfarbe */
 +    --mw-contrast-color: white;
 +    /* verwendete Schriftart (Inter wird automatisch geladen / Gesetzt) */
 +    --mw-font-family: Inter, sans-serif;
 +    /* verwendete Schriftgrösse */
 +    --mw-font-size: 12pt;
 +    /* verwendete Standard-Zeilenhöhe für Lauftext */
 +    --mw-line-height: 1.375rem;
 +    /* Rahmenfarbe der Ergebnis-Kacheln */
 +    --mw-border-color: #cfcfcf;
 +    /* leicht abgeschwächter Text: */
 +    --mw-faded-text-color: #8c8c8c;
 +    /* Hintergrundfarbe der Ergebnis-Kacheln */
 +    --mw-panel-background-color: #ffffff;
 +    /* Hintergrundfarbe des Loading-Overlay */
 +    --mw-loading-overlay-background-color: #8c8c8c;
 +}
 +</file>
  
  • minasa-cms/widget.txt
  • Zuletzt geändert: 19.05.2026 11:55
  • von alex