Wrong background color for selected text

[dokurorz]

Issue Checklist

• I am using NexT version 8.0 or later.
• I have already read the Troubleshooting page of Hexo and Troubleshooting page of NexT.
• I have already searched for current issues, which does not help me.

Expected behavior

By modifying /source/css/_variables/base.styl, the blue color looks reasonable.

Actual behavior

The default selection-bg is blue-deep #262a30 , but it is indistinguishable in dark-theme code blocks.

Steps to reproduce the behavior

none

Node.js and NPM Information

v16.20.2
8.19.4

Package dependencies Information

├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

Hexo Configuration

syntax_highlighter: highlight.js
highlight:
  line_number: true
  auto_detect: false
  tab_replace: ''
  wrap: true
  hljs: false

NexT Configuration

codeblock:
  theme:
    light: a11y-dark
    dark: a11y-dark

Other Information

Changing the color of selection-bg is simple, but replacing the default color with a color of better contrast would be more user-friendly.

[welcome]

Thanks for opening this issue, maintainers will get back to you as soon as possible!

[shenbo]

Same.
In the source code ('\hexo-source\node_modules\hexo-theme-next\source\css_variables\base.styl'), the default $selection-bg is defined as $blue-deep, #262a30;

$blue-deep          = #262a30;
$selection-bg       = $blue-deep;

it's hard to indistinguish in dark-theme.

---

my solution: redefine the $selection-bg variable.

1. in the next theme config file: _config.next.yml, add:

custom_file_path:
  variable: variables.styl

2. creat variables.styl file in the blog root folder, add:

$selection-bg = #0066ff

3. hexo clean and hexo g

[sghuang19]

Seems like the problem is in no dark mode highlight color specified for text selection. An issue similar to #513