tweak(ui): some improvements on tabs

[kobenguyent]

• selected tab is now more noticeable.

[netlify]

✅ Deploy Preview for chimerical-kitsune-a0bfa0 ready!

Name	Link
🔨 Latest commit	675bfb0
🔍 Latest deploy log	https://app.netlify.com/sites/chimerical-kitsune-a0bfa0/deploys/66436e89c40e1f00083de238
😎 Deploy Preview	https://deploy-preview-148--chimerical-kitsune-a0bfa0.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[flawiddsouza]

Heyo, not sure about this change. The selected tab now draws a lot of attention from our eyes compared to the rest of the application. Maybe a lighter color could work? Not 100% sure though.

[kobenguyent]

I did apply some light color, would be noticeable, I think. But yeah, open to any suggestion.

Current

Changes

[flawiddsouza]

This looks a bit better. Can you show me how it will look for the dark mode, with a darker color than before?

[kobenguyent]

Dark mode
Before

After

[flawiddsouza]

You can push a commit. I'll check how it looks in the deploy preview.

[kobenguyent]

oh, it's already there.

[flawiddsouza]

Can you switch to var(--sidebar-item-active-color) instead of the new var(--background-color-lighter)? It's a bit lighter than the new colors. I'll merge it after that. You can remove those css variables as well.

[flawiddsouza]

Also, just saw this unrelated change:

What's the change?

Update:
Just checked and let's revert this. It's a personal preference of mine to not have too much empty space. Compact layouts are preferable.

Before:

After:

[flawiddsouza]

What do you think of this design?

I really want to keep that seamless tab look:

It's there everywhere. On github:

In chrome:

Don't want to lose that look.

[kobenguyent]

updated as proposal.