Breakpoints

Es sind vier Breakpoints angelegt, um die Darstellung auf verschiedenen Geräten/Bildschirmgrößen anzupassen.

@phone: screen and (max-width: 767px)
Dieser Breakpoint kann genutzt werden, um spezielle Anpassungen für kleine Bildschirmgrössen vorzunehmen.

@tablet: screen and (min-width: 768px)
Der Breakpoint ist für Browserfenster, die grösser als 767px sind.

@desktop: screen and (min-width: 1024px)
Der Breakpoint ist für Browserfenster, die grösser als 1023px sind. Darunter fallen auch die meisten Tablets im Querformat.

@desktop-lg: screen and (min-width: 1280px)
Für hohe Auflösungen wird der letzte Breakpoint genutzt.