Issue: Unreadable text in some options of "Global settings" when using a light theme #162

Closed
opened 2026-10-05 02:30:43 +02:00 by adam · 1 comment
Owner

Issue
When using a light theme, such as Light+, the text under the "Modified date" and "Front Matter highlight" options becomes unreadable, and the checkboxes keep a dark color theme. This issue happens with every light theme I have installed.

To Reproduce
Steps to reproduce the behavior:

  1. Change to a light theme in VS Code.
  2. Open the Front Matter sidebar.
  3. Check the checkbox labels under "Modified date" and "Front Matter highlight".
  4. The aforementioned labels are unreadable, and the checkboxes use a dark color scheme.
  5. Also, the plus signs (+) in the Tags, Categories and Keywords fields use a dark color scheme too.

Expected behavior
The text and checkboxes should adapt to the light themes and be visible, regardless which theme is configured.

Screenshots

fm_01

fm_02

Desktop (please complete the following information):

  • OS: Windows 10 21H2
  • VS Code version: 1.62.3
**Issue** When using a light theme, such as Light+, the text under the "Modified date" and "Front Matter highlight" options becomes unreadable, and the checkboxes keep a dark color theme. This issue happens with every light theme I have installed. **To Reproduce** Steps to reproduce the behavior: 1. Change to a light theme in VS Code. 2. Open the Front Matter sidebar. 3. Check the checkbox labels under "Modified date" and "Front Matter highlight". 3. The aforementioned labels are unreadable, and the checkboxes use a dark color scheme. 4. Also, the plus signs (+) in the Tags, Categories and Keywords fields use a dark color scheme too. **Expected behavior** The text and checkboxes should adapt to the light themes and be visible, regardless which theme is configured. **Screenshots** ![fm_01](https://user-images.githubusercontent.com/80235529/144694890-7c65af2b-e56a-4b0c-a643-ef47cb5d9f63.jpg) ![fm_02](https://user-images.githubusercontent.com/80235529/144694902-8b227d0b-7ead-468a-b5cc-b5ecbf5a6a8b.jpg) **Desktop (please complete the following information):** - OS: Windows 10 21H2 - VS Code version: 1.62.3 <!-- github-sync-id:1071108002 -->
adam closed this issue 2026-10-05 02:30:43 +02:00
Author
Owner

Thanks, @cfnnmcg. The checkbox styling issue seems to be coming from the VS Code web components dependency. I implemented a change to fix it.

The buttons are not using a dark color scheme, but they are just disabled. VS Code sets the brightness to 40% when disabled. Which means that this is the default behavior. Once you start typing, you'll notice the buttons should get the lighter green color from your theme.

Thanks, @cfnnmcg. The checkbox styling issue seems to be coming from the VS Code web components dependency. I implemented a change to fix it. The buttons are not using a dark color scheme, but they are just disabled. VS Code sets the brightness to `40%` when disabled. Which means that this is the default behavior. Once you start typing, you'll notice the buttons should get the lighter green color from your theme. <!-- github-comment-id:985990211 -->
Sign in to join this conversation.
No labels
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: adam/vscode-front-matter#162