#1745 WIP: CSS: update bootstrap, improve figure classes, change row/column display

Open
max.mehl wants to merge 14 commits from css/overhaul-figures into master
Owner

This PR is a beast as a result of playing around with CSS. Sorry in advance.

The goal was to make this news item use standard classes. So this is the reference document for my changes.

Changes:

  • Upgrade Bootstrap to the latest 3.x version. Mainly done because things like .make-col-xs-offset() did not work in our version. Should have no breaking changes for us.
  • Improve some figure subclasses, especially float-*
  • Use flexbox for all rows and columns, and make them equal height. Shouldn't have a negative effect on existing code, but makes centering stuff so much easier.
  • Automatically create classes for max-width in steps of 5 (e.g. .max-width-85). Only applies for figures in screens >= md. Makes it easier for figures to change their size flexibly.
  • Update the with-image-* classes, and move them to separate file.

To exclude look/bootstrap from your diff, run on git basedir: git diff master.. -- ":(exclude)look/bootstrap"

This PR is a beast as a result of playing around with CSS. Sorry in advance. The goal was to make [this news item](https://fsfe.org/news/2020/news-20201211-01.html) use standard classes. So this is the reference document for my changes. Changes: * Upgrade Bootstrap to the latest 3.x version. Mainly done because things like `.make-col-xs-offset()` did not work in our version. Should have no breaking changes for us. * Improve some figure subclasses, especially `float-*` * Use flexbox for all rows and columns, and make them equal height. Shouldn't have a negative effect on existing code, but makes centering stuff so much easier. * Automatically create classes for max-width in steps of 5 (e.g. `.max-width-85`). Only applies for figures in screens >= md. Makes it easier for figures to change their size flexibly. * Update the `with-image-*` classes, and move them to separate file. To exclude `look/bootstrap` from your diff, run on git basedir: `git diff master.. -- ":(exclude)look/bootstrap"`
max.mehl changed title from WIP: Extending CSS possibilities for images to Extending CSS possibilities for images 4 months ago
max.mehl changed title from Extending CSS possibilities for images to CSS: update bootstrap, improve figure classes, change row/column display 4 months ago
Poster
Owner

I tested the changes against a few other pages, and there seem to be conflicts with display:flex and some strange custom classes that we use, e.g. on /about, /press, and also /activities. Will have to look into whether this can be fixed easily...

I tested the changes against a few other pages, and there seem to be conflicts with display:flex and some strange custom classes that we use, e.g. on /about, /press, and also /activities. Will have to look into whether this can be fixed easily...
max.mehl changed title from CSS: update bootstrap, improve figure classes, change row/column display to WIP: CSS: update bootstrap, improve figure classes, change row/column display 4 months ago
All checks were successful
continuous-integration/drone/pr Build is passing
continuous-integration/drone/push Build is passing
This pull request has changes conflicting with the target branch.
look/style.less
Sign in to join this conversation.
No reviewers
No Milestone
No Assignees
1 Participants
Notifications
Due Date

No due date set.

Dependencies

This pull request currently doesn't have any dependencies.

Loading…
There is no content yet.