scale-color $lightness must use $secondary for dark themes#4
Conversation
|
bugbot run |
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 4 potential issues.
Bugbot Autofix is OFF. To automatically fix reported issues with Cloud Agents, enable Autofix in the Cursor dashboard.
| a { | ||
| font-weight: bold; | ||
| color: scale-color($primary, $lightness: 30%); | ||
| color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); |
There was a problem hiding this comment.
Light/dark theme values swapped in topic metadata link
Medium Severity
The .topic-meta-data h5 a color has its light and dark theme values swapped. The original light-theme value was $lightness: 30% (darker text), but dark-light-choose now passes $lightness: 70% for the light theme and 30% for the dark theme. This makes the link text much more faded/washed-out in light mode, which is the opposite of the intended fix. The first argument to dark-light-choose needs to keep the original 30%, and the second argument for dark themes needs 70%.
| .custom-message-length { | ||
| margin: -10px 0 10px 20px; | ||
| color: scale-color($primary, $lightness: 70%); | ||
| color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); |
There was a problem hiding this comment.
Mobile modal light/dark theme values swapped
Medium Severity
The .custom-message-length color has its light/dark values swapped on mobile. The original was $lightness: 70% (subtle, light text), but the light-theme argument to dark-light-choose is now 30% (much bolder). The desktop equivalent at desktop/modal.scss correctly uses 70% for light and 30% for dark. This makes the flag message character count unexpectedly prominent on mobile in light mode.
| margin-bottom: 4px; | ||
| margin-top: 0; | ||
| color: scale-color($primary, $lightness: 20%); | ||
| color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); |
There was a problem hiding this comment.
Mobile topic-map h3 lightness changed from 20% to 50%
Medium Severity
The .topic-map h3 heading color on mobile changed its light-theme lightness from 20% to 50%, making it significantly more washed-out. The desktop equivalent correctly preserves the original 20% for the light theme and uses 80% for dark. This inconsistency means mobile light-mode headings in the topic map lose contrast compared to desktop.
| display: inline-block; | ||
| margin-top: 5px; | ||
| color: scale-color($primary, $lightness: 30%); | ||
| color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); |
There was a problem hiding this comment.
Group member name lightness incorrectly changed for light theme
Low Severity
The .group-member-info .name color had its light-theme lightness changed from 30% to 50% in both desktop and mobile. The original 30% made the name visually distinct from .title (which was 50%). Now both .name and .title share the same 50%/50% value, removing the intentional contrast hierarchy. Following the PR's pattern, the light-theme value needs to stay at 30% with the dark value at 70%.
Additional Locations (1)
2 participants
Test 7
Summary by CodeRabbit
Release Notes
✏️ Tip: You can customize this high-level summary in your review settings.
Replicated from ai-code-review-evaluation/discourse-coderabbit#7
Note
Low Risk
Pure SCSS color-token changes with no logic or data flow impact; main risk is unintended visual regressions/contrast issues across many UI surfaces.
Overview
Improves dark theme contrast by replacing many
scale-color($primary, $lightness: …)uses withdark-light-choose(...)so the dark-theme variant derives from$secondaryinstead of$primary.This updates text, icon, border, and background colors across admin settings, topic lists/posts, headers/dropdowns, login/modals, badges/buttons, search/share, uploads, and embedded/mobile/desktop styles to render appropriately in both light and dark themes.
Written by Cursor Bugbot for commit d38c4d5. Configure here.