Marginaler och brytgräns

Komponenterna är definierade utifrån två fasta bredder. Dessa slår igenom automatiskt med skärmens upplösning. Storleken styr fontstorlekar, marginaler, padding och komponenters storlek. Marginaler för den minsta upplösningen är generellt 10 px på och ökar till 20 px på den större storleken. Samma avstånd för båda storlekarna är att innehållsdelen är 20 px från header och meny oavsett brytgräns. Headern växer alltid i bredd efter webbläsarens fönster medans vänstermeny och innehåll och komponenter har ovan nämnda fasta format att växa efter.

Liten storlek är bredd mellan 1366px och 1458px, stor storlek är bredd över 1458px. Minsta upplösning för som stödjs är 1366x768.

Som designer kan du utgå från följande avstånd när du designar:

• 20px mellan interaktiva element
• 10px (lilla läget) mellan element
• 6px mellan texter som staplas vertikalt eller mellan ikon och text som hänger ihop horisontellt
• 2px mellan etikett och element om de staplas vertikalt