Skip to content

Commit

Permalink
Fix dark mode selection highlighting (#1150)
Browse files Browse the repository at this point in the history
- Fixed the selector specificity for selected text in the editor
- Toned down the match highlighting

### Before
![Screenshot 2024-12-05 at 14 31
10](https://github.com/user-attachments/assets/3a9fef84-8c1a-4884-a36e-9aae03fcf897)

### After
![Screenshot 2024-12-05 at 14 19
57](https://github.com/user-attachments/assets/c25aa412-8feb-4737-8295-05c7c2b6a8bd)
  • Loading branch information
loiswells97 authored Dec 9, 2024
1 parent 368db16 commit 79ef52d
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 2 deletions.
8 changes: 8 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,14 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),

## Unreleased

### Fixed

- Selected text background colour contrast in editor dark mode (#1150)

### Changed

- Toned down the match highlighting colour in editor dark mode (#1150)

## [0.28.11] - 2024-12-03

### Fixed
Expand Down
7 changes: 5 additions & 2 deletions src/assets/themes/editorDarkTheme.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,11 @@ export const editorDarkTheme = EditorView.theme(
"background-color": "inherit",
color: "inherit",
},
"&.cm-focused .cm-selectionBackground, ::selection": {
background: "#144866",
"&.cm-focused.ͼ3 .cm-selectionLayer .cm-selectionBackground": {
backgroundColor: "#144866",
},
".cm-selectionMatch": {
backgroundColor: "rgba(153, 255, 119, 0.2)",
},
"&.cm-focused .cm-cursor": {
borderLeftColor: "white",
Expand Down

0 comments on commit 79ef52d

Please sign in to comment.