Added support for different colour themes #15
Conversation
There was a problem hiding this comment.
@kailash360 Please check. I have added some review comments.
Please refactor the code and put all the state variables together at the top of the component.
Also put all the useEffects together. Currently, the useEffect for checking screen size is hanging at the bottom.
| } | ||
|
|
||
| //State to change the themes | ||
| const [currentTheme, setCurrentTheme] = useState("cobalt") |
There was a problem hiding this comment.
I think we should use useLocalStorage here so that the theme persists with the user data
| onChange={(e)=>{setCurrentTheme(e.target.value)}} | ||
| style={{ display: visible ? 'block' : 'none' }} | ||
| > | ||
| <option value="cobalt" selected>Default</option> |
There was a problem hiding this comment.
| <option value="cobalt" selected>Default</option> | |
| <option value="cobalt" selected>Default Theme</option> |
Can we make it Default Theme so that the user know this selector would change themes?
|
@nafees87n, I have made the suggested changes. Please have a look. I have also moved the value of default theme to the |
There was a problem hiding this comment.
@kailash360
Have a look at the suggestion and understand the working of useLocalStorage which is a custom hook.
|
@nafees87n, I have made the required changes, please take a look |
|
Thank You @kailash360. Looks good to merge now. |
2 participants
@aaryak-shah, I have added different color themes for the editor and saved the Name-keyword pair in constants file. Although, we need to import each of the themes manually in the
index.jsofhomepagefolder. The theme is switched using a select element which updates thecurrentThemestate.Cobalt is set as the default theme
This is for Issue #7 .