') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ', 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + ', 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ', 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); })(); fix(web-shared): align colors with Geist by mitul-s · Pull Request #3300 · vercel/workflow · GitHub
Skip to content

fix(web-shared): align colors with Geist - #3300

Merged
TooTallNate merged 3 commits into
mainfrom
c+ms/align-vercel-colors-937d
Aug 4, 2026
Merged

fix(web-shared): align colors with Geist#3300
TooTallNate merged 3 commits into
mainfrom
c+ms/align-vercel-colors-937d

Conversation

@mitul-s

@mitul-smitul-s commented Aug 3, 2026•
edited by cursor Bot
Loading

Copy link
Copy Markdown
Contributor

Description

Align @workflow/web-shared's default light and dark color tokens with Vercel's Geist stylesheet. The shared fallback theme now uses the same OKLCH values and defines every mapped color step.

The earlier docs-only edit has been fully reverted.

How did you test your changes?

  • Exact token comparison against docs/app/styles/geistdocs.css: 94/94 light tokens and 92/92 dark tokens match, with no missing, extra, or mismatched values.
  • Confirmed docs/app/styles/geistdocs.css has no net branch diff.
  • pnpm dlx @changesets/cli@2.29.8 status --since=main
  • git diff --check

PR Checklist - Required to merge

  • 📦 Added a patch changeset for @workflow/web-shared
  • 🔒 DCO sign-off passes
  • 📝 Ping @vercel/workflow in a comment once the PR is ready, and the above checklist is complete
Open in WebOpen in Cursor

@cursoragent@mitul-s
fix(docs): align Geist colors with Vercel
d4fc806
Co-authored-by: Mitul Shah <mitulxshah@gmail.com>
@changeset-bot

changeset-botBot commented Aug 3, 2026•
edited
Loading

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: d10ce2a

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

This PR includes changesets to release 16 packages
NameType
@workflow/web-sharedPatch
@workflow/webPatch
@workflow/cliPatch
@workflow/nitroPatch
workflowPatch
@workflow/world-testingPatch
@workflow/nuxtPatch
@workflow/corePatch
@workflow/buildersPatch
@workflow/nextPatch
@workflow/vitestPatch
@workflow/astroPatch
@workflow/nestPatch
@workflow/rollupPatch
@workflow/sveltekitPatch
@workflow/vitePatch

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

@vercel

vercelBot commented Aug 3, 2026•
edited
Loading

Copy link
Copy Markdown
Contributor

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

ProjectDeploymentActionsUpdated (UTC)
example-nextjs-workflow-turbopackReadyReadyPreviewAug 3, 2026 7:14pm
example-nextjs-workflow-webpackReadyReadyPreviewAug 3, 2026 7:14pm
example-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-astro-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-express-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-fastify-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-hono-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-nestjs-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-nitro-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-nuxt-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-sveltekit-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-tanstack-start-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workbench-vite-workflowReadyReadyPreviewAug 3, 2026 7:14pm
workflow-docsReadyReadyPreview, v0Aug 3, 2026 7:14pm
workflow-swc-playgroundReadyReadyPreviewAug 3, 2026 7:14pm
workflow-tarballsReadyReadyPreviewAug 3, 2026 7:14pm
workflow-webReadyReadyPreviewAug 3, 2026 7:14pm

@cursoragent@mitul-s
chore: add docs color changeset
c4a4cc2
Signed-off-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: Mitul Shah <mitulxshah@gmail.com>
@cursoragent@mitul-s
fix(web-shared): align colors with Geist
d10ce2a
Signed-off-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: Mitul Shah <mitulxshah@gmail.com>
@cursorcursorBot changed the title fix(docs): align Geist colors with Vercelfix(web-shared): align colors with GeistAug 3, 2026
@mitul-s
mitul-s marked this pull request as ready for review August 3, 2026 19:13
@mitul-s
mitul-s requested review from a team and ijjk as code ownersAugust 3, 2026 19:13
@TooTallNate
TooTallNate merged commit 73da40c into mainAug 4, 2026
57 checks passed
@TooTallNate
TooTallNate deleted the c+ms/align-vercel-colors-937d branch August 4, 2026 16:55
@github-actions

github-actionsBot commented Aug 4, 2026

Copy link
Copy Markdown
Contributor

No backport to stable for 73da40c (AI decision).

Although packages/web-shared/src/styles.css does exist on stable, this commit is a visual/design alignment rather than a stability fix: it rewrites every existing light and dark color token from HSL to new OKLCH values and adds many previously undefined token steps (e.g. --ds-black, --ds-white, --ds-*-800, --ds-*-1000, full gray-alpha and teal/pink scales). That is a change of existing defaults plus new token surface area — feature/polish work that would visibly alter the UI for users who stayed on the maintenance line, with no correctness, crash, data-loss, or security defect being fixed.

To override, re-run the Backport to stable workflow manually via workflow_dispatch and paste this commit SHA into the ref input:

73da40cbb7cf17d8d20d8930466da217ba2a5ec1

This was referenced Aug 4, 2026
Merged
Open
Closed
Open
Closed
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@VaguelySeriousVaguelySeriousVaguelySerious approved these changes
@ijjkijjkAwaiting requested review from ijjk

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

4 participants

@mitul-s@VaguelySerious@TooTallNate@cursoragent