Skip to content

Commit

Permalink
bug #4184 Use "var(--body-bg)" variable for body bg color in Bootstra…
Browse files Browse the repository at this point in the history
…p (bocharsky-bw)

This PR was merged into the 3.0.x-dev branch.

Discussion
----------

Use "var(--body-bg)" variable for body bg color in Bootstrap

Do you change this file manually or you have a special tool for this? I see this Bootstrap content is not the exact one from the Bootstrap source - it was sligtly modified. Basically, I made this change manually in this PR (the diff on GitHub isn't perfect):
```diff
-body{..., background-color:#e3e7ed}
+body{..., background-color:var(--body-bg)}
```

The problem is that when you override the `--body-bg` variable in your CSS - you change bg for everything except the body tag :) I suppose it should reuse the `--body-bg` var for body tag as well. This PR should help to override the body bg everywhere by overriding the only `--body-bg` CSS var

In other words, when I add this code to my CSS:
```css
:root {
    --body-bg: #dddd44;
}
```

It looks like this:
<img width="1440" alt="Screenshot 2021-02-04 at 12 34 37" src="https://user-images.githubusercontent.com/3317635/106880737-6603c880-66e5-11eb-8f8e-a553ae66ec20.png">

So to complete the bg change I have to add one more rule:
```css
:root {
    --body-bg: #dddd44;
}
body {
    background-color: #dddd44;
}
```

That fixes the problem:
<img width="1425" alt="Screenshot 2021-02-04 at 12 38 32" src="https://user-images.githubusercontent.com/3317635/106881222-eaeee200-66e5-11eb-9389-967ac56d10a1.png">

But I suppose `--body-bg` change should look like the 2nd screenshot

Commits
-------

7d95a63 Use "var(--body-bg)" variable for body bg color in Bootstrap
  • Loading branch information
javiereguiluz committed Feb 5, 2021
2 parents 2ecd710 + 7d95a63 commit f4be6be
Show file tree
Hide file tree
Showing 2 changed files with 2 additions and 1 deletion.
1 change: 1 addition & 0 deletions assets/css/easyadmin-theme/base.scss
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
}

body {
background-color: var(--body-bg);
text-rendering: optimizeLegibility;
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: unset;
Expand Down
2 changes: 1 addition & 1 deletion src/Resources/public/app.css

Large diffs are not rendered by default.

0 comments on commit f4be6be

Please sign in to comment.