Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Colour step "tabs" based on their state and required action #989

Closed
edan-bainglass opened this issue Dec 17, 2024 · 1 comment · Fixed by #1038
Closed

Colour step "tabs" based on their state and required action #989

edan-bainglass opened this issue Dec 17, 2024 · 1 comment · Fixed by #1038
Assignees
@edan-bainglass

Comments

@edan-bainglass
Copy link
Member

E.g. at the beginning, the Step 1 should be in a color saying "You need to work here" (see color options below), and the rest are gray as now meaning "inactive".
Then, once step 1 is confirmed, its header becomes a color saying "Done", and Step two becomes the color "You need to work here".

Possible choices:

  • green/blue, or (recommended) yellow (for "work here")/green (for "done")
@edan-bainglass edan-bainglass self-assigned this Dec 17, 2024
@edan-bainglass
Copy link
Member Author

edan-bainglass commented Dec 22, 2024 •
edited
Loading

Tough to do without JS. ipywidgets.Accordion does not expose the accordion item's header, so no direct styling via the Python API. CSS would likely be the solution via dynamic CSS class application, but that would require JS, which is problematic to synchronize with the Python layer. Need to think more on this.

@edan-bainglass edan-bainglass mentioned this issue Dec 27, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@edan-bainglass edan-bainglass

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Implement state-dependent accordion background colors edan-bainglass/aiidalab-qe
1 participant
@edan-bainglass