Update to Bootstrap v5: initial work

[deining]

With official release bootstrap 5 coming soon, I just had a look at #470 to overcome the compatibility issues mentioned there.
It turned out to be quite easy, there was only one thing I had to fix as mentioned in the migration guide:

color-yiq() function and related variables are renamed to color-contrast()

With this PR applied, hugo runs with bootstrap 5. You may have a look at the netlify deploy associated with this PR.

I thought I share this already, though we should wait with the merge until bootstrap 5 is officially released. Maybe it is of help for others that want to play around with bootstrap 5 beta version already.

Preview: https://deploy-preview-517--docsydocs.netlify.app/

Contributes to:

• Upgrade to Bootstrap 5.2 #470

[LisaFC]

Oh, that's good that it's a simple fix! I'll try making the change to a site running on Netlify with the latest Bootstrap and Hugo versions and see what happens.

[deining]

I'll try making the change to a site running on Netlify with the latest Bootstrap and Hugo versions and see what happens.

Even easier: have a look at the netlify deploy associated with this PR. Overall it looks pretty good, but a few quirks need to be fixed:

• The font for the text Welcome to Docsy on the start screen looks quite different.
• The top heading is not perfectly aligned
• For all documentation pages, the left margin of the main text area in the middle was reduced to zero.

[LisaFC]

Ah yes, of course! And ooh yes, it seems like it's doing something very odd to some of our fonts and alignment. I'll play around with it and see what's happening in the generated HTML etc. Definitely won't move to v5 until we can come up with something that works with it and doesn't break formatting with v4.

[deining]

Definitely won't move to v5 until we can come up with something that works with it and doesn't break formatting with v4.

I fully understand and agree with this decision.
Bootstrap has accordion control implemented which look nice to me and could be useful in various places. Implementing shortcodes for accordions should be quite easy since their markup is quite similar to the tabbed panes we already have. I'm willing to contribute a PR once bootstrap 5 is out and integrated into docsy theme.

I'll play around with it and see what's happening in the generated HTML etc.

Looking forward to your findings! Good luck!

[LisaFC]

@geriom can you figure out how/if you fixed this in Tekton?

[chalin]

@deining et all: Shall we use this as a base to move forward with the upgrade or create a new PR entirely? A lot has changed since this was originally submitted.

/cc @glasnt

[chalin]

I've rebased and upgraded BS to v5.2.0. I'll then progressively work my way through the migration document and commit sectional changes as I go.

[deining]

I've rebased and upgraded BS to v5.2.0. I'll then progressively work my way through the migration document and commit sectional changes as I go.

Great.

I just bumped BS to latest version v5.2.3 and Font-Awesome to version 6.2.1.

[chalin]

As agreed out-of-band, I'll be merging this initial work.