Skip to content

Add dark mode support to community page and event empty states #669

@SinhSinhAn

Description

@SinhSinhAn

Overview

A few spots in the app are missing dark mode styling, so the text can be hard to read when dark mode is toggled on. Would be great to bring these in line with the rest of the app.

Community page

  • src/app/community/page.tsx (line 39): The heading uses text-black-500 with no dark variant. Should follow the pattern the rest of the app uses, something like text-slate-800 dark:text-slate-200.

  • src/app/community/communityEvents.tsx (lines 19, 64, 84): The "no events" and "no clubs" empty state text uses text-slate-500 without a dark: variant. Adding dark:text-slate-400 would keep it readable.

Events empty state

  • src/app/events/EventsNone.tsx (line 25): Same situation, text-slate-500 without a dark: counterpart.

How to fix

Add the appropriate dark: text color classes alongside the existing ones. Look at nearby components for reference on which dark mode colors we use.

Good to know

You'll see how we use Tailwind's dark: prefix throughout the app.

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions