Fixed dark mode rendering for filter by course button #52

Merged

dsoral merged 5 commits from dsoral_ui_change into ui_change 2026-10-04 19:35:46 +00:00

Conversation 4 Commits 5 Files changed 3 +110 -4

dsoral commented 2026-10-03 02:46:42 +00:00

Member

Copy link

Description

The text and background for the filter by course button did not switch from light mode style when changing to dark mode. Fixed by adding a dark mode style to the css for the border, text, and background. The background and border use css variables defined in /styles/components, whereas the text inherits its color.
Also adding unit testing for the FilterBar rendering and handler calling.

Related Issue

#31
Closes #31

Type of change

Bug fix and unit tests coverage

Testing

• I added/updated tests.
• I tested my changes locally.
  • I tested my changes with a laptop-size screen.
  • I tested my changes with a phone-size screen.
  • I tested my changes with a tablet-size screen.
• I tested on the dev app (dev.cmustudy.com)

Screenshots/Recordings

Checklist

• My code follows the project's existing style.
• I have reviewed my changes.
• Only the necessary files and lines have been changed.
• This PR is ready for review.

## Description The text and background for the filter by course button did not switch from light mode style when changing to dark mode. Fixed by adding a dark mode style to the css for the border, text, and background. The background and border use css variables defined in /styles/components, whereas the text inherits its color. Also adding unit testing for the FilterBar rendering and handler calling. ## Related Issue https://git.cmu.dev/ScottyLabs/study/issues/31 Closes #31 ## Type of change Bug fix and unit tests coverage ## Testing - [x] I added/updated tests. - [x] I tested my changes locally. - [x] I tested my changes with a laptop-size screen. - [x] I tested my changes with a phone-size screen. - [x] I tested my changes with a tablet-size screen. - [ ] I tested on the dev app (dev.cmustudy.com) ## Screenshots/Recordings ## Checklist - [x] My code follows the project's existing style. - [x] I have reviewed my changes. - [x] Only the necessary files and lines have been changed. - [x] This PR is ready for review.

Screenshot 2026-10-02 at 10.43.56 PM.png

30 KiB

Screenshot 2026-10-02 at 10.43.45 PM.png

31 KiB

Screenshot 2026-10-02 at 10.44.11 PM.png

44 KiB

Screenshot 2026-10-02 at 10.44.23 PM.png

39 KiB

annadavi was assigned by dsoral 2026-10-03 02:46:42 +00:00

cseluzhy was assigned by dsoral 2026-10-03 02:46:42 +00:00

mishag was assigned by dsoral 2026-10-03 02:46:42 +00:00

dsoral added 3 commits 2026-10-03 02:46:42 +00:00

add courses text and background fixed for dark mode bfd9b2b13a

implemented unit tests for FilterBar 075c1bb3d3

remove unrelated package lock changes 07932ccfb7

mishag commented 2026-10-03 20:22:41 +00:00

Member

Copy link

Is it possible to make the vertical line and the down arrow on the course filter button the same gray as the rest of the outline instead of the brighter white color?

Is it possible to make the vertical line and the down arrow on the course filter button the same gray as the rest of the outline instead of the brighter white color?

dsoral added 1 commit 2026-10-03 20:52:35 +00:00

updated dropdown chevron and seperator to match style 49f258cbe5

dsoral commented 2026-10-03 20:56:29 +00:00

Author

Member

Copy link

Done! It uses the same color as the border.

Done! It uses the same color as the border.

Screenshot 2026-10-03 at 4.56.07 PM.png

11 KiB

Screenshot 2026-10-03 at 4.56.17 PM.png

11 KiB

annadavi removed their assignment 2026-10-04 02:39:59 +00:00

mishag was unassigned by annadavi 2026-10-04 02:39:59 +00:00

cseluzhy was unassigned by annadavi 2026-10-04 02:39:59 +00:00

annadavi requested reviews from annadavi, cseluzhy, mishag 2026-10-04 02:40:20 +00:00

annadavi commented 2026-10-04 02:42:13 +00:00

Member

Copy link

For future reference, add us in the reviewers section (top right), not assignees (technically, the assignee is you). I moved it already for you, but check that in the future so we don't miss the PR.

For future reference, add us in the reviewers section (top right), not assignees (technically, the assignee is you). I moved it already for you, but check that in the future so we don't miss the PR.

annadavi approved these changes 2026-10-04 02:43:15 +00:00

annadavi left a comment

Copy link

Be sure to update this branch with rebase or merge (you can use the dropdown on the right below) before making the merge commit into ui_change.

Be sure to update this branch with rebase or merge (you can use the dropdown on the right below) before making the merge commit into ui_change.

dsoral added 1 commit 2026-10-04 19:33:50 +00:00

Merge branch 'ui_change' into dsoral_ui_change 403b814014

dsoral merged commit 576a5ce620 into ui_change 2026-10-04 19:35:46 +00:00

dsoral referenced this pull request from a commit 2026-10-04 19:35:47 +00:00

Merge pull request 'Fixed dark mode rendering for filter by course button' (#52) from dsoral_ui_change into ui_change

dsoral deleted branch dsoral_ui_change 2026-10-04 19:36:10 +00:00

Sign in to join this conversation.

Reviewers

No reviewers

cseluzhy

mishag

annadavi

Labels

Clear labels   

first-task

  

needs/docs

Must have documentation written

  

needs/research

Discuss the ideal implementation with the tech lead

  

needs/upstream

Needs a contribution to an upstream project

  

type/bug

Something not working as intended

  

type/external

Lives outside of code

  

type/feature

New functionality

  

type/refactor

Improving existing code

  

urgency

high

This is currently causing issues

  

urgency

immediate

This is making a project or feature unusable

  

urgency

low

This can happen whenever

  

urgency

medium

This is expected to cause issues soon

No labels

first-task

needs/docs

needs/research

needs/upstream

type/bug

type/external

type/feature

type/refactor

urgency

high

urgency

immediate

urgency

low

urgency

medium

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

3 participants

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference

ScottyLabs/study!52

No description provided.