Skip to content

feat: polish colors and indents#1042

Open
alexdln wants to merge 3 commits intonpmx-dev:mainfrom
alexdln:feat/polish-colors-and-indents
Open

feat: polish colors and indents#1042
alexdln wants to merge 3 commits intonpmx-dev:mainfrom
alexdln:feat/polish-colors-and-indents

Conversation

@alexdln
Copy link
Contributor

@alexdln alexdln commented Feb 5, 2026

Changes (in same order as in changes):

  • Made both the background and text a bit lighter. Previously, too much of it was blending in, and I got a few complaints about it. I tried to maintain the feel of the website as much as possible; it felt like the screen brightness had simply been increased by 10%.
  • Changed the colors in background shades to make them softer and more different
  • Added a tint to the text colors. Sorry about the name, but the shade order is wrong. I'll fix the names everywhere in the new issue (there will be a lot of changes, but it is better to do this now)
  • Made the header's background transparent using a backing so that I could use backdrop-blur on nested elements (the browser restriction is that you can't use backdrop-blur inside an element with backdrop-blur)
  • Added effects and a clickable area for the chips, since it was 20px and the text was blending in
  • Added effects for fields
  • Changed accountMenu styling - it looked too dirty in the light theme. I softened the tones, added transparency and blur
  • Effects for fields / clickable zone, a bit more space in connector warning between texts
  • Increased clickable zone in modal and changed background to lighter one - the backdrop background should contrast with the modal background, but in our case it blended in a bit in the dark theme
  • Кemoved the extra border under the table view, as there were two borders in a row
  • Fixed text-decoration color on hover in readme
  • Added effects for the active tagradiobutton (and fixed focus to be the same as everywhere else)
  • For versions-selecter and package-docs same as with header and user-menu - was dirty in light, updated colors and added blur
  • Reduced the spacing of the readme header and fixed its position
  • Tired to describe it, thanks for reading and reviewing ❤️

Closes #974

@vercel
Copy link

vercel bot commented Feb 5, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
npmx.dev Ready Ready Preview, Comment Feb 5, 2026 10:21pm
2 Skipped Deployments
Project Deployment Actions Updated (UTC)
docs.npmx.dev Ignored Ignored Preview Feb 5, 2026 10:21pm
npmx-lunaria Ignored Ignored Feb 5, 2026 10:21pm

Request Review

@codecov
Copy link

codecov bot commented Feb 5, 2026

Codecov Report

❌ Patch coverage is 90.90909% with 1 line in your changes missing coverage. Please review.
✅ All tests successful. No failed tests found.

Files with missing lines Patch % Lines
app/pages/package/[...package].vue 50.00% 1 Missing ⚠️

📢 Thoughts on this report? Let us know!

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Feb 5, 2026

📝 Walkthrough

Walkthrough

This PR updates theme tokens and palettes (app/assets/main.css and uno.config.ts), adding a new muted-light token and changing many OkLCH-derived background and foreground variables across dark and light modes. Several headers, dropdowns and modal backdrops are refactored to use separate overlay elements for blur/translucency, and numerous components receive spacing, focus-outline and hover/pressed class adjustments. No runtime logic, emitted events or public component APIs were changed.

Possibly related PRs

  • feat: polish ui #971: Overlapping component styling changes touching AppHeader, AccountMenu and Tag/Button.vue — directly affects the same header and header-related components.
  • fix: connector modal legibility #863: UI/styling changes in Header/ConnectorModal.vue — modifies the same ConnectorModal component and related spacing/hover styles.
  • fix: light theme text visibility #861: Modal styling adjustments — touches Modal.client.vue and interacts with the same palette/backdrop token changes.

Suggested reviewers

  • danielroe
  • 43081j
  • trueberryless
🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Description check ✅ Passed The pull request description relates directly to the changeset, detailing color adjustments, spacing modifications, visual effects, and styling updates across multiple components.
Linked Issues check ✅ Passed The PR addresses all primary objectives from issue #974: reducing high-contrast areas, lightening backgrounds and text colours, adjusting shades, and applying targeted styling fixes throughout the codebase.
Out of Scope Changes check ✅ Passed All changes are within scope as styling and visual refinements directly addressing contrast reduction and polish. The UnoCSS configuration change (quoted keys and muted-light addition) supports the new colour variables required by the styling updates.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

Comment @coderabbitai help to get the list of available commands and usage tips.

@alexdln
Copy link
Contributor Author

alexdln commented Feb 5, 2026

I love these CIs, 0.96, there was a very weak spot somewhere, I'll check it now

(although it's a shame, since I went through all the pages with Lighthouse)

UPD: it's funny, it failed because it couldn't load a package readme. But anyway it's good, that needs fixing as well

image

UPD: Weird...
image

UPD2: Okay, he got away with the underline. Very weird

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: soften areas with too much contrast

1 participant