search

youseedk / dna

CSS framework for yousee.dk
ISC License
6 stars 6 forks source link

Buttons for small mobile screens #268

Closed OVA-robin closed 3 years ago

OVA-robin commented 3 years ago

All our buttons need to change on screens that are smaller than 375 pix. The font size should be scaled from 20 down to 16 The margin of the pages should be changed from 48 pix to 24 The green background color of the button must be changed from # 1FAB2E to # 1A8924

(Our current button meets the accessibility requirements we follow. Font size 20 on our green button. But when the font is scaled down, the contrast needs to be increased. Hence a darker button so we still meet the requirements for accessibility.)

grandorf commented 3 years ago

Should we not say small buttons will be on screen sizes under 400px or maybe even use our media queries and say under 576px? The problem with buttons is also for sizes over 375 I would say.

"The margin of the pages should be changed from 48 pix to 24"

What does this mean?

Should the new color of the button only be applied for small screens when we also change the font-size?

OVA-robin commented 3 years ago

Oh sorry. I ment the margin of the BUTTON should be changed from 48 to 24 on small screens. So the long button text doesn't pop out.

OVA-robin commented 3 years ago

I have only seen problems with buttons on iPhone 5 and iPhone SE witch have 320 pix with. I don't think we shoud have these new dark buttons on iPhone 6 if it looks ok.