RocketCommunicationsInc / astro-components

Other
24 stars 8 forks source link

Astro 1556 scroll bar km #156

Closed micahjones13 closed 3 years ago

micahjones13 commented 3 years ago

Updates scroll bar styles to be inline with current abstract implementation and KM design changes.

Jira Ticket

Dark Theme changes:

  1. Changed --scrollBarThumbBackgroundColor: to rgb(43, 101, 155) from rgb(46, 103, 153)
  2. Changed scrollBarTrackCornerBackgroundColor to --scrollBarTrackBackgroundColor and changed color to rgb(27, 45, 62) from rgb(32, 50, 70)
  3. Created scrollBarVerticalBoxShadow and scrollBarHorizontalBoxShadow with values inset 3px 3px 3px 0px rgba(0, 0, 0, 0.5); and inset 1px 3px 3px 0px rgba(0, 0, 0, 0.5) respectively.

Light Theme changes:

  1. changed --scrollBarThumbBackgroundColor to var(--primary, rgb(0, 90, 143)) from var(--colorQuaternaryDarken1, #9ba0aa)
  2. Changed scrollBarTrackCornerBackgroundColor to --scrollBarTrackBackgroundColor and changed color to var(--colorWhite, rgb(255, 255, 255)); from transparent
  3. Created scrollBarVerticalBoxShadow and scrollBarHorizontalBoxShadow with values inset 3px 3px 3px 0px rgba(47, 72, 99, 0.5); and inset 1px 3px 3px 0px rgba(47, 72, 99, 0.5) respectively.

Some values are not using pre-existing colors (ie. rgb(43, 101, 155) and rgb(27, 45, 62)) and so I left them as is. We will most likely be auditing the color values and var names in the future, and these can be updated along with that audit.

micahjones13 commented 3 years ago

for some reason, it looks like this breaks the select form component styles. can you take a look? its hard for me to see what's going on in the diff history

Just reverted the select scss to match current implementation in master - I'm not sure how this ended up here. I must have forgot to swap branches when I worked on some changes for select :no_good: