branch: externals/modus-operandi-theme
commit af3a327b02b1b02b287f0d0e9bef2aff8df99a4b
Author: Protesilaos Stavrou <[email protected]>
Commit: Protesilaos Stavrou <[email protected]>
Tweak `bg-paren-match' value and implementation
This concerns the colour that is applied as a background to the matching
delimiter with `show-paren-mode'.
Scenaria
--------
There are four scenaria of text-editing that need to be considered:
1. Paren match combined with the foreground of the delimiter. The
contrast ratio for this should always be >= 7:1.
2. The foreground of the paren match needs to be 7:1 with the cursor
(while the cursor is the same as the main foreground). This is because
Emacs will use the paren-match background as the character's foreground
when the cursor is placed over a highlighted delimiter. Ergo, the
foreground value for scenario 1 needs to be the same as the main
foreground (pure black/white).
3. Paren match surrounded by the main background. The minimum contrast
between two adjacent backgrounds can be as low as 1.25:1 (based on my
testing, which I am nevertheless willing to reconsider). A slightly
higher value is preferable, while too high a value becomes annoying by
calling too much attention to itself.
4. Paren match within an active region. Again the 1.25:1 applies. Here
the ratio can approximate or meet the threshold because of the
interactive nature of marking a region.
Based on the above, we derive two constants to guide our process:
- fg-paren-match == fg-main
- bg-paren-match / bg-region == 1.25
The value for scenario 3 is the one left once the others are satisfied.
Contrast ratios
---------------
The table below shows the colour contrast of the old value of
`bg-paren-match' in the first row and the new values in the second one.
The idea is to have a more balanced result in all contexts where the
matching delimiter is highlighted. Note that two themes do not have the
same contrast ratios, with the dark themes being lower, because the
human eye can spot more subtle differences on a dark background.
Modus Operandi:
| | #000000 | #ffffff | #bcbcbc | |
| bg-paren | (fg-main) | (bg-main) | (region) | Comment |
|----------+-----------+-----------+----------+-----------------------|
| #deb8af | 11.5 | 1.81 | 1.04 | Bad for region |
| #efcabf | 13.8 | 1.51 | 1.25 | Best for all contexts |
Modus Vivendi:
| | #ffffff | #000000 | #3c3c3c | |
| bg-paren | (bg-main) | (fg-main) | (region) | Comment |
|----------+-----------+-----------+----------+-----------------------|
| #754a5d | 7.25 | 2.89 | 1.52 | Fairly good |
| #6e3a50 | 8.80 | 2.38 | 1.25 | Best for all contexts |
Finally, the bg-paren values are slightly accented towards a direction
that is not common for other foreground values that are applied to
syntax highlighting. This is to keep things clear, whereas e.g. an
intense magenta could be conflated with the name of a keyword: not what
you want from some transient feedback.
This commit relates to the tweaks that followed the report in issue 29:
https://gitlab.com/protesilaos/modus-themes/-/issues/29
---
modus-operandi-theme.el | 12 ++++++------
modus-vivendi-theme.el | 12 ++++++------
2 files changed, 12 insertions(+), 12 deletions(-)
diff --git a/modus-operandi-theme.el b/modus-operandi-theme.el
index 8dae02f..c8b3d97 100644
--- a/modus-operandi-theme.el
+++ b/modus-operandi-theme.el
@@ -454,9 +454,9 @@ between foreground and background is >= 7:1)."
;; can be combined with any of the "active" values, plus the
;; "special" and base foreground colours
;;
- ;; `bg-region' and `bg-tab-active' must be combined with
- ;; `fg-main', while `bg-tab-inactive' should be combined with
- ;; `fg-dim'
+ ;; `bg-paren-match', `bg-region' and `bg-tab-active' must be
+ ;; combined with `fg-main', while `bg-tab-inactive' should be
+ ;; combined with `fg-dim'
;;
;; `fg-tab-active' is meant to be combined with `bg-tab-active',
;; though only for styling special elements, such as underlining
@@ -466,6 +466,7 @@ between foreground and background is >= 7:1)."
;;
;; all other pairs are combinable with themselves
(bg-hl-line "#f1f2f6")
+ (bg-paren-match "#efcabf")
(bg-region "#bcbcbc")
(bg-tab-active "#ababab")
(bg-tab-inactive "#dadada")
@@ -474,7 +475,6 @@ between foreground and background is >= 7:1)."
(fg-window-divider-outer "#585858")
(fg-header "#2a2a2a") (bg-header "#e5e5e5")
(fg-whitespace "#645060") (bg-whitespace "#fff8fc")
- (fg-paren-match "#222222") (bg-paren-match "#deb8af")
(fg-diff-heading "#043355") (bg-diff-heading "#b7c2dd")
(fg-diff-added "#004500") (bg-diff-added "#d4fad4")
(fg-diff-changed "#524200") (bg-diff-changed "#fcefcf")
@@ -2385,7 +2385,7 @@ between foreground and background is >= 7:1)."
`(sh-heredoc ((,class (:foreground ,blue-alt))))
`(sh-quoted-exec ((,class (:foreground ,magenta-alt :weight
,modus-theme-bold))))
;;;; show-paren-mode
- `(show-paren-match ((,class (:background ,bg-paren-match :foreground
,fg-paren-match))))
+ `(show-paren-match ((,class (:background ,bg-paren-match :foreground
,fg-main))))
`(show-paren-match-expression ((,class (:inherit
modus-theme-special-calm))))
`(show-paren-mismatch ((,class (:inherit modus-theme-intense-red))))
;;;; side-notes
@@ -2421,7 +2421,7 @@ between foreground and background is >= 7:1)."
;;;; smartparens
`(sp-pair-overlay-face ((,class (:inherit modus-theme-special-warm))))
`(sp-show-pair-enclosing ((,class (:inherit modus-theme-special-mild))))
- `(sp-show-pair-match-face ((,class (:background ,bg-paren-match :foreground
,fg-paren-match))))
+ `(sp-show-pair-match-face ((,class (:background ,bg-paren-match :foreground
,fg-main))))
`(sp-show-pair-mismatch-face ((,class (:inherit modus-theme-intense-red))))
`(sp-wrap-overlay-closing-pair ((,class (:inherit sp-pair-overlay-face))))
`(sp-wrap-overlay-face ((,class (:inherit sp-pair-overlay-face))))
diff --git a/modus-vivendi-theme.el b/modus-vivendi-theme.el
index 2f663ef..8097dd4 100644
--- a/modus-vivendi-theme.el
+++ b/modus-vivendi-theme.el
@@ -454,9 +454,9 @@ between foreground and background is >= 7:1)."
;; can be combined with any of the "active" values, plus the
;; "special" and base foreground colours
;;
- ;; `bg-region' and `bg-tab-active' must be combined with
- ;; `fg-main', while `bg-tab-inactive' should be combined with
- ;; `fg-dim'
+ ;; `bg-paren-match', `bg-region' and `bg-tab-active' must be
+ ;; combined with `fg-main', while `bg-tab-inactive' should be
+ ;; combined with `fg-dim'
;;
;; `fg-tab-active' is meant to be combined with `bg-tab-active',
;; though only for styling special elements, such as underlining
@@ -466,6 +466,7 @@ between foreground and background is >= 7:1)."
;;
;; all other pairs are combinable with themselves
(bg-hl-line "#151823")
+ (bg-paren-match "#6e3a50")
(bg-region "#3c3c3c")
(bg-tab-active "#484848")
(bg-tab-inactive "#2f2f2f")
@@ -474,7 +475,6 @@ between foreground and background is >= 7:1)."
(fg-window-divider-outer "#969696")
(fg-header "#dddddd") (bg-header "#2a2a2a")
(fg-whitespace "#a4959f") (bg-whitespace "#170016")
- (fg-paren-match "#fcfcfc") (bg-paren-match "#754a5d")
(fg-diff-heading "#dadffe") (bg-diff-heading "#304466")
(fg-diff-added "#94ba94") (bg-diff-added "#0a280a")
(fg-diff-changed "#b0ba9f") (bg-diff-changed "#2a2000")
@@ -2385,7 +2385,7 @@ between foreground and background is >= 7:1)."
`(sh-heredoc ((,class (:foreground ,blue-alt))))
`(sh-quoted-exec ((,class (:foreground ,magenta-alt :weight
,modus-theme-bold))))
;;;; show-paren-mode
- `(show-paren-match ((,class (:background ,bg-paren-match :foreground
,fg-paren-match))))
+ `(show-paren-match ((,class (:background ,bg-paren-match :foreground
,fg-main))))
`(show-paren-match-expression ((,class (:inherit
modus-theme-special-calm))))
`(show-paren-mismatch ((,class (:inherit modus-theme-intense-red))))
;;;; skewer-mode
@@ -2421,7 +2421,7 @@ between foreground and background is >= 7:1)."
;;;; smartparens
`(sp-pair-overlay-face ((,class (:inherit modus-theme-special-warm))))
`(sp-show-pair-enclosing ((,class (:inherit modus-theme-special-mild))))
- `(sp-show-pair-match-face ((,class (:background ,bg-paren-match :foreground
,fg-paren-match))))
+ `(sp-show-pair-match-face ((,class (:background ,bg-paren-match :foreground
,fg-main))))
`(sp-show-pair-mismatch-face ((,class (:inherit modus-theme-intense-red))))
`(sp-wrap-overlay-closing-pair ((,class (:inherit sp-pair-overlay-face))))
`(sp-wrap-overlay-face ((,class (:inherit sp-pair-overlay-face))))
