This repository has been archived by the owner on Dec 28, 2022. It is now read-only.
Theming in Zeal #4
Locked
yash-deepsource
started this conversation in
RFC
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
How does it work?
Zeal will make use of a combination of CSS variables and
data-*
attributes to implement themes.Themes will be stored at the global level with values of variables specified, such as:
The
<html>
tag itself will be used to determine the set theme of the page, like:Colors in the tailwind configuration will be done on basis of the same logic where:
This should allow us to build in support for easily configuring colors into our tailwind config files. A component will be built in such a way that it makes use of these generic tailwind properties. For example:
Thus, whenever we update the value of
data-theme
for the<html/>
tag; the components will automatically reflect the new color theme.Credits
Feedback
Please do raise any concerns you might have about this approach or suggestions you have for this here or in an issue referring to this discussion, if required.
Beta Was this translation helpful? Give feedback.
All reactions