/* module/InfoTafel/assets/css/infotafel.css Styles der Kiosk-Ansicht. Bewusst schlank gehalten; das Grundlayout kommt aus Tailwind (CDN), hier stehen nur Ergaenzungen. */ /* WICHTIG: Diese Regel darf NICHT auf 'body' global stehen. Das Backend-Layout (seitenlayout.php -> ladeProjektAssets('css')) bindet ALLE CSS unter public/assets/module rekursiv in JEDE Seite ein. Ein globaler body-Selektor deaktiviert dann portalweit Textmarkierung/Kopieren. Daher an die Kiosk-Ansicht scopen: in tablet_infotafel.php setzen. */ body.infotafel-kiosk { overscroll-behavior-y: contain; -webkit-user-select: none; user-select: none; } .infotafel-tab-aktiv { background-color: #334155; border-left: 4px solid #38bdf8; padding-left: calc(1.25rem - 4px); } /* Typografie der vom Vermieter gepflegten HTML-Inhalte. Ohne diese Regeln wuerden h2/ul/p durch Tailwinds Preflight-Reset flach dargestellt. */ .infotafel-inhalt h2 { font-size: 1.5rem; font-weight: 700; margin: 1.5rem 0 .75rem; color: #1e293b; } .infotafel-inhalt h3 { font-size: 1.25rem; font-weight: 600; margin: 1.25rem 0 .5rem; color: #1e293b; } .infotafel-inhalt p { margin: .75rem 0; line-height: 1.7; font-size: 1.05rem; color: #334155; } .infotafel-inhalt ul { list-style: disc; margin: .75rem 0 .75rem 1.5rem; line-height: 1.7; } .infotafel-inhalt ol { list-style: decimal; margin: .75rem 0 .75rem 1.5rem; line-height: 1.7; } .infotafel-inhalt li { margin: .35rem 0; } .infotafel-inhalt a { color: #0284c7; text-decoration: underline; } .infotafel-inhalt img { max-width: 100%; height: auto; border-radius: .5rem; margin: 1rem 0; } .infotafel-inhalt table { width: 100%; border-collapse: collapse; margin: 1rem 0; } .infotafel-inhalt th, .infotafel-inhalt td { border: 1px solid #e2e8f0; padding: .6rem .75rem; text-align: left; } .infotafel-inhalt th { background: #f1f5f9; font-weight: 600; } .infotafel-inhalt strong { font-weight: 700; } .infotafel-inhalt em { font-style: italic; } /* Die Navigation faehrt als Overlay ueber den Inhalt (siehe tablet_infotafel.php). Sie darf daher auf schmalen Geraeten NICHT schrumpfen - sie belegt im geschlossenen Zustand ohnehin keinen Platz. Auf sehr kleinen Displays bekommt sie stattdessen etwas weniger Breite. */ @media (max-width: 420px) { #infotafel-nav { width: 16rem; } } /* Kein Wischen des Hintergrunds, solange das Menue offen ist. */ #infotafel-backdrop { touch-action: none; } /* Fully Kiosk und aehnliche Browser blenden bisweilen eigene Leisten ein; der Burger bleibt dank z-index darueber sichtbar. */ #infotafel-burger { -webkit-tap-highlight-color: transparent; }