1. Home
  2. Dokumente
  3. Agy
  4. Design-Einstellungen

Design-Einstellungen

Auf der dritten Registerkarte der Einstellungen dreht sich alles um das Erscheinungsbild des Age Gate. Hier definierst du Farben, Hintergründe, Übergänge und mehr.

Design-Einstellungen 1

Hintergrund

Hier kannst du eine Hintergrundfarbe für das Overlay definieren (auch in RGBA für Transparenz) oder ein Hintergrundbild für das bildschirmfüllende Overlay einstellen. Die Eigenschaft z-index gibt die Stapelreihenfolge eines Elements an. Es ist ganz einfach: Wenn du das Overlay nicht siehst, erhöhe den Wert, bis du es siehst.

Inhalts-Box

Agy wird mit einer Spalteneinstellung geliefert. Wählen eine Spalte für die Standardeinstellung und zwei Spalten, wenn du ein zusätzliches Bild hinzufügen und den Text aus der Slogan-Einstellung unter „Texte“ anzeigen möchtest. Du kannst auch eine maximale Breite für das Age Gate festlegen und den z-Index modifizieren. Stelle sicher, dass der z-Index aus der Inhaltsbox immer höher ist als der z-Index aus dem Overlay.

Design-Einstellungen 2

Texte

Das ist ziemlich selbsterklärend: Ändere die Hintergrund- und Schriftfarben für jeden Text, der im Age Gate erscheint.

Unschärfe-Effekt

Du kannst den gesamten Hintergrund deiner Website verschwimmen lassen, bevor der Benutzer sein Alter verifiziert. Dies ist eine etwas modernere und elegantere Art, den Inhalt auszublenden, aber nicht ein ganzes Bild in den Hintergrund zu setzen.

Der Unschärfe-Effekt-Container muss ein übergeordneter Container der Website sein, der sich über dem Overlay-Container befindet. Hier ist ein kleiner Screenshot, der dir zeigt, wie du ihn finden kannst:

Design-Einstellungen 3

Bei der letzten Einstellung geht es um die Intensität des Unschärfe-Effekts. Wählen einen Wert von 0 bis 2 und passe ihn deinen Bedürfnissen entsprechend an.