OSC / ondemand

Supercomputing. Seamlessly. Open, Interactive HPC Via the Web
https://openondemand.org/
MIT License
263 stars 99 forks source link

3461 bootstrap 5 upgrade #3541

Closed HazelGrant closed 1 month ago

HazelGrant commented 2 months ago

Fixes #3461

Bootstrap 5 Upgrade

Builds & tests should all pass. Each screen in this branch should look the same as its counterpart in ondemand-test.

HazelGrant commented 1 month ago

@johrstrom @Oglopf Can you pull this down when you have a moment and check if the action buttons on the Files Browser page have outlines? I cannot for the life of me figure out why some .btn-outline-* variants seem to be not working.

johrstrom commented 1 month ago

@johrstrom @Oglopf Can you pull this down when you have a moment and check if the action buttons on the Files Browser page have outlines? I cannot for the life of me figure out why some .btn-outline-* variants seem to be not working.

Sure, it's due to the $theme-colors SASS variable that we've apparently defined here which has no dark color.

https://github.com/OSC/ondemand/blob/75ea435fdae1ca11e3bd2cdfed939880046f3d6b/apps/dashboard/app/assets/stylesheets/_variables.scss#L13-L18

When we SASS compile - bootstrap will make a btn-outline-$color class for each of the colors

https://github.com/twbs/bootstrap/blob/72d3b6efc4b92e83a4abca6f5bc0cd7e6fd25931/scss/_buttons.scss#L157-L161

And again, we don't have dark color there.

I don't know why we've set that variable. I'd have to look into the git history, and even then it may not be mentioned why we did so, but it seems that after we redefine some colors, we should likely just add the defaults to that list.

https://getbootstrap.com/docs/5.0/customize/color/#theme-colors

johrstrom commented 1 month ago

This looks fine and works well. I just found 2 typos that we may as well fix now because they may be overlooked if we defer it.