nextra icon indicating copy to clipboard operation
nextra copied to clipboard

change(blog): improve tags styling

Open numToStr opened this issue 3 years ago • 6 comments

I tried to improve tags' styling; specially in dark-mode where the contrast was very low. Let me know what do you all think :)

Before

https://user-images.githubusercontent.com/24727447/183091115-7a188744-d1b4-42e3-a752-9e3563bbdc89.mp4

After

https://user-images.githubusercontent.com/24727447/183091149-dea48d27-2289-4cce-bf73-ec687907ce62.mp4


Supersedes #504

numToStr avatar Aug 05 '22 13:08 numToStr

🦋 Changeset detected

Latest commit: bb73a13d1da47cfd3949621a160f397723156181

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

changeset-bot[bot] avatar Aug 05 '22 13:08 changeset-bot[bot]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
nextra-theme-docs-dev ✅ Ready (Inspect) Visit Preview Aug 11, 2022 at 7:45AM (UTC)
1 Ignored Deployment
Name Status Preview Updated
nextra ⬜️ Ignored (Inspect) Aug 11, 2022 at 7:45AM (UTC)

vercel[bot] avatar Aug 05 '22 13:08 vercel[bot]

I guess @numToStr is right, it's better to change bg color rather than color. Just one notice in :hover state, color text should be a little bit adjusted

dimaMachina avatar Aug 07 '22 10:08 dimaMachina

@B2o5T I guess you are talking about talking about adjusting text color in light mode?

numToStr avatar Aug 07 '22 13:08 numToStr

yes

dimaMachina avatar Aug 09 '22 10:08 dimaMachina

@B2o5T I made some adjustment to text color and IMO it looks better.

https://user-images.githubusercontent.com/24727447/183667307-bc6f5d5f-49f2-4552-bff0-fc5d5e6ea99b.mp4

numToStr avatar Aug 09 '22 13:08 numToStr

@B2o5T friendly ping :)

numToStr avatar Aug 11 '22 05:08 numToStr

adjusted a little bit and added not-prose class to omit adding !important in classes

https://user-images.githubusercontent.com/7361780/184086865-f7837270-ab04-4084-8885-fe0e442fc4ac.mov

dimaMachina avatar Aug 11 '22 07:08 dimaMachina

adjusted a little bit and added not-prose class to omit adding !important in classes

LGTM

numToStr avatar Aug 11 '22 07:08 numToStr

Thank you @numToStr!

shuding avatar Aug 12 '22 13:08 shuding