This is Fix For #4106.
The current color-picker does not show a preview so it is hard to guess the color contrast. I added a preview (screenshot added below) which shows your selected colors.
Also, Added a <input type="color"> which makes it is easy to select the color.
Since there are other pages that depend on 'color-picker' class I did not change anything in colorPicker.js or any of the styles of current color-picker. I created a new file colorPreview.js and some new classes in html.
Mobile & Desktop Screenshots/Recordings (if there are UI changes)
Mobile
Desktop
Recording
Added to documentation?
[ ] docs.dev.to
[ ] readme
[x] no documentation needed
[optional] What gif best describes this PR or how it makes you feel?
My first PR To DEV!
I was not very sure if I could do this or not since DEV's codebase is probably the largest codebase I've ever worked on but now I'm super proud of myself to complete this 🌻
Sent a PR to DEV 🕺🕺
What type of PR is this? (check all applicable)
Description
This is Fix For #4106. The current color-picker does not show a preview so it is hard to guess the color contrast. I added a preview (screenshot added below) which shows your selected colors.
Also, Added a
<input type="color">which makes it is easy to select the color.Since there are other pages that depend on 'color-picker' class I did not change anything in
colorPicker.jsor any of the styles of current color-picker. I created a new filecolorPreview.jsand some new classes in html.Mobile & Desktop Screenshots/Recordings (if there are UI changes)
Mobile
Desktop
Recording
Added to documentation?
[optional] What gif best describes this PR or how it makes you feel?
My first PR To DEV! I was not very sure if I could do this or not since DEV's codebase is probably the largest codebase I've ever worked on but now I'm super proud of myself to complete this🌻
Me showing this code to everyone :