Skip to content
This repository has been archived by the owner on Feb 13, 2024. It is now read-only.

Bootstrap v5 upgrade notes #1

Open
chrismlusk opened this issue Dec 30, 2020 · 5 comments
Open

Bootstrap v5 upgrade notes #1

chrismlusk opened this issue Dec 30, 2020 · 5 comments

Comments

@chrismlusk
Copy link
Collaborator

Bootstrap v5 is in beta and will no longer include breaking changes, so it's a good time to prep for AccuTheme to upgrade.

I don't think there will be too many noticeable changes to how we use Bootstrap, but we should review the v5 updates and note any changes that will impact the AccuTheme starting templates and/or any "favorites" we typically use in projects — if for no other reason than to document key differences.

Bootstrap migration guide

@chrismlusk
Copy link
Collaborator Author

The first step will be to have @joshmiethe-accuraty, @jeremy-farrance, and myself to look through the release notes from v5.0.0-alpha1. That's the largest list of changes.

If anything jumps out to you, please flag it here for visibility.

@chrismlusk chrismlusk changed the title Boostratp v5 upgrade notes Bootstrap v5 upgrade notes Dec 31, 2020
@joshmiethe-accuraty
Copy link

I had no idea that " media-breakpoint-between()" was even a thing. There has been times when it would have come in handy. Do you have any insight on that?

I like that cards are now using the masonry grid. That's pretty awesome. (More of a statement than useful info, sorry!)

There's nothing the popped out to me as being problematic when I reviewed the release notes. That being said, I feel like I'm still learning all the time when it comes to bootstrap so perhaps something will catch my attention moving forward.

Thanks for all of your hard work on this beast! I've really liked working with the AccuTheme!

@chrismlusk
Copy link
Collaborator Author

@joshmiethe-accuraty I'm not sure if I've used it before, but I think it'll be really nice for those odd in-between sizes!

@chrismlusk
Copy link
Collaborator Author

Changes that caught my attention:

  1. They removed the hover and focus mixins you see all over our codebase (e.g., @hover-focus()) in favor for normal CSS rules. This is great, but we currently have a custom mixin for plain-visited() that I added to fix stupid DNN default styles. Shouldn't be a big problem, but just something to be aware of.

  2. The media-breakpoint-down() mixin works differently now. (It's much more intuitive, I think.) The mixin is now essentially saying "Breakpoints smaller than X" instead of "Breakpoints from X and smaller."

  3. Bye, jQuery! For AccuTheme, this won't be an issue. We'll need to be mindful of what this means for some of the 2sxc apps we've been using, though. I think many of them expect jQuery to be loaded?

  4. The color system just got a whole lot more complicated. We should take time to figure out how best to use their new system in a way that makes it convenient for us to add brand colors and whatnot.


Overall, most of the changes that impact us are to functions, organization, and cleaning up the core codebase. We get a nice new API to generate utility classes, and I think this upgrade will help dramatically simplify how we theme DNN sites: simple Accuraty-flavored Bootstrap components out of the box, and a lot of utility classes for the one-off elements.

@joshmiethe-accuraty
Copy link

No jQuery?! I knew this day would come but I'm still not ready for it. So sad.

https://www.youtube.com/watch?v=oK9gLkXe0xw

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants