midzer / tobii

An accessible, open-source lightbox with no dependencies
https://midzer.github.io/tobii/demo/
MIT License
196 stars 20 forks source link

Style issues #108

Closed viliusle closed 1 year ago

viliusle commented 1 year ago
  1. Close button width and height is defined in rem units - this is mistake. Rem depends on HTML tag font size. It should be em.
  2. There was multiple changes related to CSS and element sized. In result, all elements are smaller now. See example: https://user-images.githubusercontent.com/3708786/212549315-107813b6-773d-4d27-b011-7f99f93497c4.gif Fix could be updating --tobii-base-font-size value from 1rem to 1.125rem (18px was changed to 1 rem, but 1 rem is 16px, not 18px)
  3. Close button is not very big, and also it has opacity 0.5. This button is very important and should not be hard to notice, so I suggest to set opacity to 1.
midzer commented 1 year ago
  1. Yeah, let's change those values to em, too
  2. Can't we leave --tobii-base-font-size at 1rem and recalculate all em value by +12.5%?
  3. True, the close button is very important (if you don't have click on background enabled). What about trying a value of 0.75?