apitable/apitable

feat: Introduce a Light Theme Option in Space Station Management

Open

#1273 opened on Sep 4, 2023

View on GitHub
 (3 comments) (0 reactions) (0 assignees)TypeScript (10,747 stars) (870 forks)batch import
enhancementgood first issue

Description

I have an idea for this project.

Why?

Why we need this feature？ While the Help Center offers a convenient theme toggle feature, the Space Station Management at http://localhost/management/overview currently only provides a default dark theme. Introducing a similar theme toggle feature in the Space Station Management would provide a consistent user experience across different parts of the platform.

What is the user story for this feature? As a user of both the Help Center and the Space Station Management interface, I want a consistent theme toggle experience so that I can easily switch between light and dark modes based on my preference and environment.

What?

Can you describe this feature in detail? Introduce a theme toggle feature in the Space Station Management interface, similar to the one in the Help Center. This would allow users to switch between the default dark theme and a light theme. The toggle can be a simple button or switch in the settings or navigation bar.

Who can benefit from it? All users of the Space Station Management interface can benefit, especially those who are also familiar with the Help Center and expect a consistent theme toggle experience.

How?

Do you have any plans for implementing this feature? While I don't have a specific implementation plan, a potential approach could involve:

  1. Replicating the theme toggle feature from the Help Center.
  2. Integrating it into the Space Station Management UI.
  3. Ensuring the user's theme preference is consistent across both platforms.

In how many steps can you implement this feature? Three main steps: Replication, Integration, and User Preference Consistency.

Can you please provide a TODO list?

  1. Study the theme toggle feature in the Help Center.
  2. Integrate a similar theme toggle button or switch in the Space Station Management UI.
  3. Ensure theme preferences are consistent across both platforms.

Contributor guide

Tech stack
typescriptreactcss
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
fresh
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
mostly clear
Prerequisites
Understanding of the existing theme toggle implementationFamiliarity with React and CSS themingKnowledge of the space station management UI codebase
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
45
Research direction
Start by examining the theme toggle feature in the Help Center, likely implemented in the same repository. Look for related components, styles, and state management (e.g., React context, CSS variables). Then explore the Space Station Management UI at /management/overview to identify where to add the toggle. Check any existing theming utilities or hooks to ensure consistency across platforms. The issue has three comments; review them for any maintainer feedback or additional context.