Change gutter background with custom diff color in Light theme
Everyone can contribute. Help move this issue forward while earning points, leveling up and collecting rewards.
If you remove the custom diff color, it resets back to the default. But as seen in the screenshots below, the gutter background color doesn't change when picking a custom color in the “Light” theme.
| Empty | Default color |
|---|---|
 |
 |
This was a compromise in the implementation in Add user preferences to customize Diffs colors (!78281 - merged), as explained by @wwwjon in !78281 (comment 887225586):
As you wrote, only the "Light" theme uses a different color for the "Gutter background" (and the "Gutter border"). Since the general solution has to work for all themes, I guess we have to compromise here. So if you use the "Light" theme and set a custom diff color to override the default, the "Gutter" will have to same color as the "Lines background" (analogous to the rest of the themes).
To solve that slight color difference when picking the default colors, I suggested in !78281 (comment 878440107):
For the default theme colors, a possible solution is to match the HEX values in the color picker with the default colors of the currently selected theme. If the HEX value matches the default, we would ignore the color picker and use the theme's CSS. That mapping would be:
HEX to RGB mapping for each theme
| Theme | Default color type | New lines | Old lines | |-------|--------------------|-----------|-----------| | Light | HEX | `#ecfdf0` | `#fbe9eb` | | Dark | RGB/RGBA | `#33ff33` (converted from RGB) `rgb(51, 255, 51)` | `#ff3333` (converted from RGB) `rgb(255, 51, 51)` | | Solarized light | RGB/RGBA | `#859900` (converted from RGB) `rgb(133, 153, 0)` | `#dc322f` (converted from RGB) `rgb(220, 50, 47)` | | Solarized dark | RGB/RGBA | `#859900` (converted from RGB) `rgb(133, 153, 0)` | `#dc322f` (converted from RGB) `rgb(220, 50, 47)` | | Monokai | RGB/RGBA | `#a6e22e` (converted from RGB) `rgb(166, 226, 46)` | `#fe938c` (converted from RGB) `rgb(254, 147, 140)` | | None | HEX | `#f0f0f0` | `#f0f0f0` |Only the “Light” and “None” themes use HEX values, so there's a direct mapping with those themes.