javivelasco / javivelasco/react-css-themr
how to override styling in default css for a themed component
- Dominant language
- JavaScript
- Stars
- 589
- Forks
- 65
- PR merge metrics
- No merged PRs in 30d
Description
quotation from README, "There are three possible sources for your component. Sorted by priority: context, configuration and props" hints to me that theme in context has lowest priority, then configuration(local theme or default theme) with higher priority, right?
Given that I decorated my Button react component (@themr("MyButton", defaultTheme)) with default.css
`.button {
background-color: blue;
color: white
}`
and then I've got a customer.css to customize that button:
`.button {
background-color: #003366;
color: red
}`
the customer.css was imported and sent in as context theme to Button component.
I am wondering how I could override the default theme with the theme in context? It seems impossible at all because context them has lower priority than localTheme (default.css)
The other issue is that if { composeTheme: 'deeply' } is being used, both context theme and local theme(default.css) has _background-color_, the final visual background result of button is dependent/undetermined for it depends on the order of who comes after whom in bundled resource
Should context theme have higher priority then local theme so that it is easier to override the default one with context theme?
Thanks in advance!
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with the README's stated priority order and trace how the decorated Button receives context, configuration, and props themes. Reproduce the default.css and customer.css example, including composeTheme: 'deeply', and determine whether the issue should clarify or change precedence so the context theme can override the default theme.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, javascript, react
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100