Orange-OpenSource / Orange-OpenSource/Orange-Boosted-Bootstrap

Having max-width of grid in rem

Open
#3,456 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

🧩 enhancement
Dominant language
CSS
Stars
219
Forks
61
Avg merge
2d 15h
Merged PRs (30d)
12

Description

Currently the max-width of the container of the grid is defined in px. So when the user wants a bigger font-size, the width of the website doesn't grow accordingly.

The idea here is to have the value set as a rem value to make it grow with the font-size. Since it is a max-width it will just use the unused space that could be present on the side of the screen but won't make any overflow.

This max-width could also be set with a max function to avoid shrinking the value when the font-size is set to a value smaller than 16px.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by locating the grid container styles that define its max-width in pixels and inspect the related responsive rules. The work is done when the max-width responds to the root font size, does not shrink undesirably below the intended minimum, and does not introduce overflow.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, sass, scss
Domain
frontend
Issue type
Feature
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.