fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112) - #310

Merged
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112
Jul 8, 2026
Merged

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112)#310
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112

Conversation

@Jose-Gael-Cruz-Lopez

Copy link
Copy Markdown
Member

What & why

Clears the last residuals on two frontend-audit issues that were mostly already resolved on main (by #102's glass removal, the token migration, and prior polish). Verified each acceptance box, then fixed only what genuinely remained.

Closes#106
Closes#112

#106 — landing hero glass cards + neon-blue accents

ACState on mainThis PR
No big-number stat tiles in the hero✅ already done (#102 removed them; the two floating cards are now a color legend + action chips, no numbers, opaque --bg-panel)
No #3B82F6 neon-blue on hero surfaces❌ residual: the intro-orbit blue node + hero-canvas graph palettefixed
  • globals.css: .landing-intro-orbit-node--bluebackground: var(--info) (both the base rule and the .landing-page-scoped duplicate).
  • (public)/page.tsx: the hero-canvas palette, CLUSTER_COLORS, and OB_STEP_COLORS blue entries → #3e6f8a (the concrete --info value — these are JS canvas / inline sinks where var() doesn't resolve). This is exactly the shift the issue's Fix note requested ("toward the warmer --info #3e6f8a").

#112 — polish (side-stripes / white panels / easing / Inter)

ACState on mainThis PR
No border-left/right > 1px colored accent stripes❌ one left: the gradebook category listfixed
Panels/inputs tinted off pure white✅ done (--bg-panel/--bg-input = #fdfcf9 warm paper)
--ease used instead of overshoot easing✅ cited CSS overshoot removed → var(--ease)
Inter removed; --font-inter → DM Sans✅ done (Inter dropped from layout.tsx; --font-inter--font-sans)
  • Gradebook/AssignmentList.tsx: the category <ul> used borderLeft: 2px solid ${color} as its only category-color indicator. Moved the color to a leading dot in the category header (the treatment the issue recommends, matching the existing AchievementUnlockToast dot) and made the list border a 1px neutral --border divider. No information lost.

Not in scope (flagged, deliberate)

Test plan

  • Frontend CI (npm ci + build/lint) is the gate; changes are color-value swaps + one standard JSX dot span (mirrors AchievementUnlockToast).
  • No functional/layout change beyond the intended visuals; --info and #3e6f8a are the same color, so the orbit node + canvas stay in sync.

🤖 Generated with Claude Code

…, #112)
#106 — replace the #3B82F6 neon-blue on landing/hero surfaces with the warmer
--info (#3e6f8a), per the issue's fix note:
- globals.css: the intro-orbit blue node -> var(--info) (base + .landing-page rule)
- (public)/page.tsx: hero-canvas graph palette + CLUSTER_COLORS + OB_STEP_COLORS
blue entries -> #3e6f8a (concrete hex; JS canvas / inline sinks where var()
doesn't resolve)
The hero stat tiles / glass cards were already removed by #102, so #106's AC1
was already met on main; this clears AC2.
#112 — the assignment-category list used `2px solid ${color}` as its ONLY
category-color indicator, which fails the "no >1px colored side-stripe" bar.
Move the category color to a leading dot in the header (the issue's recommended
treatment) and make the list border a 1px neutral --border divider — no info
lost. #112's other three items (off-white panels, --ease easing, Inter->DM Sans)
were already done on main.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@coderabbitai

coderabbitaiBot commented Jul 3, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@AndresL230, you've reached your PR review limit, so we couldn't start this review.

Next review available in:9 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: cb08ac53-82c4-47e6-85ef-9173a70d4e64

📥 Commits

Reviewing files that changed from the base of the PR and between 6243563 and 236c3d8.

📒 Files selected for processing (3)
  • frontend/src/app/(public)/page.tsx
  • frontend/src/app/globals.css
  • frontend/src/components/Gradebook/AssignmentList.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/frontend-audit-residuals-106-112

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@cloudflare-workers-and-pages

cloudflare-workers-and-pagesBot commented Jul 3, 2026

Copy link
Copy Markdown

Deploying with Cloudflare Workers Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

StatusNameLatest CommitPreview URLUpdated (UTC)
✅ Deployment successful!
View logs
frontend-staging236c3d8Commit Preview URL

Branch Preview URL
Jul 08 2026, 06:41 AM

AndresL230and others added 2 commits July 8, 2026 02:04
The hero-canvas orb palettes hardcode #3e6f8a because canvas fillStyle
can't resolve CSS var(); the CSS orbit node uses var(--info). Comment
records that provenance so the two stay intentionally in sync.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@AndresL230
AndresL230 merged commit 8b3c9f3 into mainJul 8, 2026
6 checks passed
@AndresL230
AndresL230 deleted the fix/frontend-audit-residuals-106-112 branch August 2, 2026 18:30
Sign up for freeto 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.

[P2] Polish: side-stripe borders, white panels, overshoot easing, Inter font [P1] Replace landing hero-metric glass cards + neon-blue accents

2 participants

@Jose-Gael-Cruz-Lopez@AndresL230
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112) - #310

Merged
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112
Jul 8, 2026
Merged

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112)#310
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112

Conversation

@Jose-Gael-Cruz-Lopez

Copy link
Copy Markdown
Member

What & why

Clears the last residuals on two frontend-audit issues that were mostly already resolved on main (by #102's glass removal, the token migration, and prior polish). Verified each acceptance box, then fixed only what genuinely remained.

Closes#106
Closes#112

#106 — landing hero glass cards + neon-blue accents

ACState on mainThis PR
No big-number stat tiles in the hero✅ already done (#102 removed them; the two floating cards are now a color legend + action chips, no numbers, opaque --bg-panel)
No #3B82F6 neon-blue on hero surfaces❌ residual: the intro-orbit blue node + hero-canvas graph palettefixed
  • globals.css: .landing-intro-orbit-node--bluebackground: var(--info) (both the base rule and the .landing-page-scoped duplicate).
  • (public)/page.tsx: the hero-canvas palette, CLUSTER_COLORS, and OB_STEP_COLORS blue entries → #3e6f8a (the concrete --info value — these are JS canvas / inline sinks where var() doesn't resolve). This is exactly the shift the issue's Fix note requested ("toward the warmer --info #3e6f8a").

#112 — polish (side-stripes / white panels / easing / Inter)

ACState on mainThis PR
No border-left/right > 1px colored accent stripes❌ one left: the gradebook category listfixed
Panels/inputs tinted off pure white✅ done (--bg-panel/--bg-input = #fdfcf9 warm paper)
--ease used instead of overshoot easing✅ cited CSS overshoot removed → var(--ease)
Inter removed; --font-inter → DM Sans✅ done (Inter dropped from layout.tsx; --font-inter--font-sans)
  • Gradebook/AssignmentList.tsx: the category <ul> used borderLeft: 2px solid ${color} as its only category-color indicator. Moved the color to a leading dot in the category header (the treatment the issue recommends, matching the existing AchievementUnlockToast dot) and made the list border a 1px neutral --border divider. No information lost.

Not in scope (flagged, deliberate)

Test plan

  • Frontend CI (npm ci + build/lint) is the gate; changes are color-value swaps + one standard JSX dot span (mirrors AchievementUnlockToast).
  • No functional/layout change beyond the intended visuals; --info and #3e6f8a are the same color, so the orbit node + canvas stay in sync.

🤖 Generated with Claude Code

…, #112)
#106 — replace the #3B82F6 neon-blue on landing/hero surfaces with the warmer
--info (#3e6f8a), per the issue's fix note:
- globals.css: the intro-orbit blue node -> var(--info) (base + .landing-page rule)
- (public)/page.tsx: hero-canvas graph palette + CLUSTER_COLORS + OB_STEP_COLORS
blue entries -> #3e6f8a (concrete hex; JS canvas / inline sinks where var()
doesn't resolve)
The hero stat tiles / glass cards were already removed by #102, so #106's AC1
was already met on main; this clears AC2.
#112 — the assignment-category list used `2px solid ${color}` as its ONLY
category-color indicator, which fails the "no >1px colored side-stripe" bar.
Move the category color to a leading dot in the header (the issue's recommended
treatment) and make the list border a 1px neutral --border divider — no info
lost. #112's other three items (off-white panels, --ease easing, Inter->DM Sans)
were already done on main.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@coderabbitai

coderabbitaiBot commented Jul 3, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@AndresL230, you've reached your PR review limit, so we couldn't start this review.

Next review available in:9 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: cb08ac53-82c4-47e6-85ef-9173a70d4e64

📥 Commits

Reviewing files that changed from the base of the PR and between 6243563 and 236c3d8.

📒 Files selected for processing (3)
  • frontend/src/app/(public)/page.tsx
  • frontend/src/app/globals.css
  • frontend/src/components/Gradebook/AssignmentList.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/frontend-audit-residuals-106-112

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@cloudflare-workers-and-pages

cloudflare-workers-and-pagesBot commented Jul 3, 2026

Copy link
Copy Markdown

Deploying with Cloudflare Workers Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

StatusNameLatest CommitPreview URLUpdated (UTC)
✅ Deployment successful!
View logs
frontend-staging236c3d8Commit Preview URL

Branch Preview URL
Jul 08 2026, 06:41 AM

AndresL230and others added 2 commits July 8, 2026 02:04
The hero-canvas orb palettes hardcode #3e6f8a because canvas fillStyle
can't resolve CSS var(); the CSS orbit node uses var(--info). Comment
records that provenance so the two stay intentionally in sync.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@AndresL230
AndresL230 merged commit 8b3c9f3 into mainJul 8, 2026
6 checks passed
@AndresL230
AndresL230 deleted the fix/frontend-audit-residuals-106-112 branch August 2, 2026 18:30
Sign up for freeto 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.

[P2] Polish: side-stripe borders, white panels, overshoot easing, Inter font [P1] Replace landing hero-metric glass cards + neon-blue accents

2 participants

@Jose-Gael-Cruz-Lopez@AndresL230
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112) - #310

Merged
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112
Jul 8, 2026
Merged

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112)#310
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112

Conversation

@Jose-Gael-Cruz-Lopez

Copy link
Copy Markdown
Member

What & why

Clears the last residuals on two frontend-audit issues that were mostly already resolved on main (by #102's glass removal, the token migration, and prior polish). Verified each acceptance box, then fixed only what genuinely remained.

Closes#106
Closes#112

#106 — landing hero glass cards + neon-blue accents

ACState on mainThis PR
No big-number stat tiles in the hero✅ already done (#102 removed them; the two floating cards are now a color legend + action chips, no numbers, opaque --bg-panel)
No #3B82F6 neon-blue on hero surfaces❌ residual: the intro-orbit blue node + hero-canvas graph palettefixed
  • globals.css: .landing-intro-orbit-node--bluebackground: var(--info) (both the base rule and the .landing-page-scoped duplicate).
  • (public)/page.tsx: the hero-canvas palette, CLUSTER_COLORS, and OB_STEP_COLORS blue entries → #3e6f8a (the concrete --info value — these are JS canvas / inline sinks where var() doesn't resolve). This is exactly the shift the issue's Fix note requested ("toward the warmer --info #3e6f8a").

#112 — polish (side-stripes / white panels / easing / Inter)

ACState on mainThis PR
No border-left/right > 1px colored accent stripes❌ one left: the gradebook category listfixed
Panels/inputs tinted off pure white✅ done (--bg-panel/--bg-input = #fdfcf9 warm paper)
--ease used instead of overshoot easing✅ cited CSS overshoot removed → var(--ease)
Inter removed; --font-inter → DM Sans✅ done (Inter dropped from layout.tsx; --font-inter--font-sans)
  • Gradebook/AssignmentList.tsx: the category <ul> used borderLeft: 2px solid ${color} as its only category-color indicator. Moved the color to a leading dot in the category header (the treatment the issue recommends, matching the existing AchievementUnlockToast dot) and made the list border a 1px neutral --border divider. No information lost.

Not in scope (flagged, deliberate)

Test plan

  • Frontend CI (npm ci + build/lint) is the gate; changes are color-value swaps + one standard JSX dot span (mirrors AchievementUnlockToast).
  • No functional/layout change beyond the intended visuals; --info and #3e6f8a are the same color, so the orbit node + canvas stay in sync.

🤖 Generated with Claude Code

…, #112)
#106 — replace the #3B82F6 neon-blue on landing/hero surfaces with the warmer
--info (#3e6f8a), per the issue's fix note:
- globals.css: the intro-orbit blue node -> var(--info) (base + .landing-page rule)
- (public)/page.tsx: hero-canvas graph palette + CLUSTER_COLORS + OB_STEP_COLORS
blue entries -> #3e6f8a (concrete hex; JS canvas / inline sinks where var()
doesn't resolve)
The hero stat tiles / glass cards were already removed by #102, so #106's AC1
was already met on main; this clears AC2.
#112 — the assignment-category list used `2px solid ${color}` as its ONLY
category-color indicator, which fails the "no >1px colored side-stripe" bar.
Move the category color to a leading dot in the header (the issue's recommended
treatment) and make the list border a 1px neutral --border divider — no info
lost. #112's other three items (off-white panels, --ease easing, Inter->DM Sans)
were already done on main.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@coderabbitai

coderabbitaiBot commented Jul 3, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@AndresL230, you've reached your PR review limit, so we couldn't start this review.

Next review available in:9 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: cb08ac53-82c4-47e6-85ef-9173a70d4e64

📥 Commits

Reviewing files that changed from the base of the PR and between 6243563 and 236c3d8.

📒 Files selected for processing (3)
  • frontend/src/app/(public)/page.tsx
  • frontend/src/app/globals.css
  • frontend/src/components/Gradebook/AssignmentList.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/frontend-audit-residuals-106-112

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@cloudflare-workers-and-pages

cloudflare-workers-and-pagesBot commented Jul 3, 2026

Copy link
Copy Markdown

Deploying with Cloudflare Workers Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

StatusNameLatest CommitPreview URLUpdated (UTC)
✅ Deployment successful!
View logs
frontend-staging236c3d8Commit Preview URL

Branch Preview URL
Jul 08 2026, 06:41 AM

AndresL230and others added 2 commits July 8, 2026 02:04
The hero-canvas orb palettes hardcode #3e6f8a because canvas fillStyle
can't resolve CSS var(); the CSS orbit node uses var(--info). Comment
records that provenance so the two stay intentionally in sync.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@AndresL230
AndresL230 merged commit 8b3c9f3 into mainJul 8, 2026
6 checks passed
@AndresL230
AndresL230 deleted the fix/frontend-audit-residuals-106-112 branch August 2, 2026 18:30
Sign up for freeto 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.

[P2] Polish: side-stripe borders, white panels, overshoot easing, Inter font [P1] Replace landing hero-metric glass cards + neon-blue accents

2 participants

@Jose-Gael-Cruz-Lopez@AndresL230
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112) - #310

Merged
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112
Jul 8, 2026
Merged

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112)#310
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112

Conversation

@Jose-Gael-Cruz-Lopez

Copy link
Copy Markdown
Member

What & why

Clears the last residuals on two frontend-audit issues that were mostly already resolved on main (by #102's glass removal, the token migration, and prior polish). Verified each acceptance box, then fixed only what genuinely remained.

Closes#106
Closes#112

#106 — landing hero glass cards + neon-blue accents

ACState on mainThis PR
No big-number stat tiles in the hero✅ already done (#102 removed them; the two floating cards are now a color legend + action chips, no numbers, opaque --bg-panel)
No #3B82F6 neon-blue on hero surfaces❌ residual: the intro-orbit blue node + hero-canvas graph palettefixed
  • globals.css: .landing-intro-orbit-node--bluebackground: var(--info) (both the base rule and the .landing-page-scoped duplicate).
  • (public)/page.tsx: the hero-canvas palette, CLUSTER_COLORS, and OB_STEP_COLORS blue entries → #3e6f8a (the concrete --info value — these are JS canvas / inline sinks where var() doesn't resolve). This is exactly the shift the issue's Fix note requested ("toward the warmer --info #3e6f8a").

#112 — polish (side-stripes / white panels / easing / Inter)

ACState on mainThis PR
No border-left/right > 1px colored accent stripes❌ one left: the gradebook category listfixed
Panels/inputs tinted off pure white✅ done (--bg-panel/--bg-input = #fdfcf9 warm paper)
--ease used instead of overshoot easing✅ cited CSS overshoot removed → var(--ease)
Inter removed; --font-inter → DM Sans✅ done (Inter dropped from layout.tsx; --font-inter--font-sans)
  • Gradebook/AssignmentList.tsx: the category <ul> used borderLeft: 2px solid ${color} as its only category-color indicator. Moved the color to a leading dot in the category header (the treatment the issue recommends, matching the existing AchievementUnlockToast dot) and made the list border a 1px neutral --border divider. No information lost.

Not in scope (flagged, deliberate)

Test plan

  • Frontend CI (npm ci + build/lint) is the gate; changes are color-value swaps + one standard JSX dot span (mirrors AchievementUnlockToast).
  • No functional/layout change beyond the intended visuals; --info and #3e6f8a are the same color, so the orbit node + canvas stay in sync.

🤖 Generated with Claude Code

…, #112)
#106 — replace the #3B82F6 neon-blue on landing/hero surfaces with the warmer
--info (#3e6f8a), per the issue's fix note:
- globals.css: the intro-orbit blue node -> var(--info) (base + .landing-page rule)
- (public)/page.tsx: hero-canvas graph palette + CLUSTER_COLORS + OB_STEP_COLORS
blue entries -> #3e6f8a (concrete hex; JS canvas / inline sinks where var()
doesn't resolve)
The hero stat tiles / glass cards were already removed by #102, so #106's AC1
was already met on main; this clears AC2.
#112 — the assignment-category list used `2px solid ${color}` as its ONLY
category-color indicator, which fails the "no >1px colored side-stripe" bar.
Move the category color to a leading dot in the header (the issue's recommended
treatment) and make the list border a 1px neutral --border divider — no info
lost. #112's other three items (off-white panels, --ease easing, Inter->DM Sans)
were already done on main.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@coderabbitai

coderabbitaiBot commented Jul 3, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@AndresL230, you've reached your PR review limit, so we couldn't start this review.

Next review available in:9 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: cb08ac53-82c4-47e6-85ef-9173a70d4e64

📥 Commits

Reviewing files that changed from the base of the PR and between 6243563 and 236c3d8.

📒 Files selected for processing (3)
  • frontend/src/app/(public)/page.tsx
  • frontend/src/app/globals.css
  • frontend/src/components/Gradebook/AssignmentList.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/frontend-audit-residuals-106-112

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@cloudflare-workers-and-pages

cloudflare-workers-and-pagesBot commented Jul 3, 2026

Copy link
Copy Markdown

Deploying with Cloudflare Workers Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

StatusNameLatest CommitPreview URLUpdated (UTC)
✅ Deployment successful!
View logs
frontend-staging236c3d8Commit Preview URL

Branch Preview URL
Jul 08 2026, 06:41 AM

AndresL230and others added 2 commits July 8, 2026 02:04
The hero-canvas orb palettes hardcode #3e6f8a because canvas fillStyle
can't resolve CSS var(); the CSS orbit node uses var(--info). Comment
records that provenance so the two stay intentionally in sync.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@AndresL230
AndresL230 merged commit 8b3c9f3 into mainJul 8, 2026
6 checks passed
@AndresL230
AndresL230 deleted the fix/frontend-audit-residuals-106-112 branch August 2, 2026 18:30
Sign up for freeto 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.

[P2] Polish: side-stripe borders, white panels, overshoot easing, Inter font [P1] Replace landing hero-metric glass cards + neon-blue accents

2 participants

@Jose-Gael-Cruz-Lopez@AndresL230
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112) - #310

Merged
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112
Jul 8, 2026
Merged

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112)#310
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112

Conversation

@Jose-Gael-Cruz-Lopez

Copy link
Copy Markdown
Member

What & why

Clears the last residuals on two frontend-audit issues that were mostly already resolved on main (by #102's glass removal, the token migration, and prior polish). Verified each acceptance box, then fixed only what genuinely remained.

Closes#106
Closes#112

#106 — landing hero glass cards + neon-blue accents

ACState on mainThis PR
No big-number stat tiles in the hero✅ already done (#102 removed them; the two floating cards are now a color legend + action chips, no numbers, opaque --bg-panel)
No #3B82F6 neon-blue on hero surfaces❌ residual: the intro-orbit blue node + hero-canvas graph palettefixed
  • globals.css: .landing-intro-orbit-node--bluebackground: var(--info) (both the base rule and the .landing-page-scoped duplicate).
  • (public)/page.tsx: the hero-canvas palette, CLUSTER_COLORS, and OB_STEP_COLORS blue entries → #3e6f8a (the concrete --info value — these are JS canvas / inline sinks where var() doesn't resolve). This is exactly the shift the issue's Fix note requested ("toward the warmer --info #3e6f8a").

#112 — polish (side-stripes / white panels / easing / Inter)

ACState on mainThis PR
No border-left/right > 1px colored accent stripes❌ one left: the gradebook category listfixed
Panels/inputs tinted off pure white✅ done (--bg-panel/--bg-input = #fdfcf9 warm paper)
--ease used instead of overshoot easing✅ cited CSS overshoot removed → var(--ease)
Inter removed; --font-inter → DM Sans✅ done (Inter dropped from layout.tsx; --font-inter--font-sans)
  • Gradebook/AssignmentList.tsx: the category <ul> used borderLeft: 2px solid ${color} as its only category-color indicator. Moved the color to a leading dot in the category header (the treatment the issue recommends, matching the existing AchievementUnlockToast dot) and made the list border a 1px neutral --border divider. No information lost.

Not in scope (flagged, deliberate)

Test plan

  • Frontend CI (npm ci + build/lint) is the gate; changes are color-value swaps + one standard JSX dot span (mirrors AchievementUnlockToast).
  • No functional/layout change beyond the intended visuals; --info and #3e6f8a are the same color, so the orbit node + canvas stay in sync.

🤖 Generated with Claude Code

…, #112)
#106 — replace the #3B82F6 neon-blue on landing/hero surfaces with the warmer
--info (#3e6f8a), per the issue's fix note:
- globals.css: the intro-orbit blue node -> var(--info) (base + .landing-page rule)
- (public)/page.tsx: hero-canvas graph palette + CLUSTER_COLORS + OB_STEP_COLORS
blue entries -> #3e6f8a (concrete hex; JS canvas / inline sinks where var()
doesn't resolve)
The hero stat tiles / glass cards were already removed by #102, so #106's AC1
was already met on main; this clears AC2.
#112 — the assignment-category list used `2px solid ${color}` as its ONLY
category-color indicator, which fails the "no >1px colored side-stripe" bar.
Move the category color to a leading dot in the header (the issue's recommended
treatment) and make the list border a 1px neutral --border divider — no info
lost. #112's other three items (off-white panels, --ease easing, Inter->DM Sans)
were already done on main.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@coderabbitai

coderabbitaiBot commented Jul 3, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@AndresL230, you've reached your PR review limit, so we couldn't start this review.

Next review available in:9 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: cb08ac53-82c4-47e6-85ef-9173a70d4e64

📥 Commits

Reviewing files that changed from the base of the PR and between 6243563 and 236c3d8.

📒 Files selected for processing (3)
  • frontend/src/app/(public)/page.tsx
  • frontend/src/app/globals.css
  • frontend/src/components/Gradebook/AssignmentList.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/frontend-audit-residuals-106-112

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@cloudflare-workers-and-pages

cloudflare-workers-and-pagesBot commented Jul 3, 2026

Copy link
Copy Markdown

Deploying with Cloudflare Workers Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

StatusNameLatest CommitPreview URLUpdated (UTC)
✅ Deployment successful!
View logs
frontend-staging236c3d8Commit Preview URL

Branch Preview URL
Jul 08 2026, 06:41 AM

AndresL230and others added 2 commits July 8, 2026 02:04
The hero-canvas orb palettes hardcode #3e6f8a because canvas fillStyle
can't resolve CSS var(); the CSS orbit node uses var(--info). Comment
records that provenance so the two stay intentionally in sync.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@AndresL230
AndresL230 merged commit 8b3c9f3 into mainJul 8, 2026
6 checks passed
@AndresL230
AndresL230 deleted the fix/frontend-audit-residuals-106-112 branch August 2, 2026 18:30
Sign up for freeto 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.

[P2] Polish: side-stripe borders, white panels, overshoot easing, Inter font [P1] Replace landing hero-metric glass cards + neon-blue accents

2 participants

@Jose-Gael-Cruz-Lopez@AndresL230
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112) - #310

Merged
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112
Jul 8, 2026
Merged

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112)#310
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112

Conversation

@Jose-Gael-Cruz-Lopez

Copy link
Copy Markdown
Member

What & why

Clears the last residuals on two frontend-audit issues that were mostly already resolved on main (by #102's glass removal, the token migration, and prior polish). Verified each acceptance box, then fixed only what genuinely remained.

Closes#106
Closes#112

#106 — landing hero glass cards + neon-blue accents

ACState on mainThis PR
No big-number stat tiles in the hero✅ already done (#102 removed them; the two floating cards are now a color legend + action chips, no numbers, opaque --bg-panel)
No #3B82F6 neon-blue on hero surfaces❌ residual: the intro-orbit blue node + hero-canvas graph palettefixed
  • globals.css: .landing-intro-orbit-node--bluebackground: var(--info) (both the base rule and the .landing-page-scoped duplicate).
  • (public)/page.tsx: the hero-canvas palette, CLUSTER_COLORS, and OB_STEP_COLORS blue entries → #3e6f8a (the concrete --info value — these are JS canvas / inline sinks where var() doesn't resolve). This is exactly the shift the issue's Fix note requested ("toward the warmer --info #3e6f8a").

#112 — polish (side-stripes / white panels / easing / Inter)

ACState on mainThis PR
No border-left/right > 1px colored accent stripes❌ one left: the gradebook category listfixed
Panels/inputs tinted off pure white✅ done (--bg-panel/--bg-input = #fdfcf9 warm paper)
--ease used instead of overshoot easing✅ cited CSS overshoot removed → var(--ease)
Inter removed; --font-inter → DM Sans✅ done (Inter dropped from layout.tsx; --font-inter--font-sans)
  • Gradebook/AssignmentList.tsx: the category <ul> used borderLeft: 2px solid ${color} as its only category-color indicator. Moved the color to a leading dot in the category header (the treatment the issue recommends, matching the existing AchievementUnlockToast dot) and made the list border a 1px neutral --border divider. No information lost.

Not in scope (flagged, deliberate)

Test plan

  • Frontend CI (npm ci + build/lint) is the gate; changes are color-value swaps + one standard JSX dot span (mirrors AchievementUnlockToast).
  • No functional/layout change beyond the intended visuals; --info and #3e6f8a are the same color, so the orbit node + canvas stay in sync.

🤖 Generated with Claude Code

…, #112)
#106 — replace the #3B82F6 neon-blue on landing/hero surfaces with the warmer
--info (#3e6f8a), per the issue's fix note:
- globals.css: the intro-orbit blue node -> var(--info) (base + .landing-page rule)
- (public)/page.tsx: hero-canvas graph palette + CLUSTER_COLORS + OB_STEP_COLORS
blue entries -> #3e6f8a (concrete hex; JS canvas / inline sinks where var()
doesn't resolve)
The hero stat tiles / glass cards were already removed by #102, so #106's AC1
was already met on main; this clears AC2.
#112 — the assignment-category list used `2px solid ${color}` as its ONLY
category-color indicator, which fails the "no >1px colored side-stripe" bar.
Move the category color to a leading dot in the header (the issue's recommended
treatment) and make the list border a 1px neutral --border divider — no info
lost. #112's other three items (off-white panels, --ease easing, Inter->DM Sans)
were already done on main.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@coderabbitai

coderabbitaiBot commented Jul 3, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@AndresL230, you've reached your PR review limit, so we couldn't start this review.

Next review available in:9 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: cb08ac53-82c4-47e6-85ef-9173a70d4e64

📥 Commits

Reviewing files that changed from the base of the PR and between 6243563 and 236c3d8.

📒 Files selected for processing (3)
  • frontend/src/app/(public)/page.tsx
  • frontend/src/app/globals.css
  • frontend/src/components/Gradebook/AssignmentList.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/frontend-audit-residuals-106-112

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@cloudflare-workers-and-pages

cloudflare-workers-and-pagesBot commented Jul 3, 2026

Copy link
Copy Markdown

Deploying with Cloudflare Workers Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

StatusNameLatest CommitPreview URLUpdated (UTC)
✅ Deployment successful!
View logs
frontend-staging236c3d8Commit Preview URL

Branch Preview URL
Jul 08 2026, 06:41 AM

AndresL230and others added 2 commits July 8, 2026 02:04
The hero-canvas orb palettes hardcode #3e6f8a because canvas fillStyle
can't resolve CSS var(); the CSS orbit node uses var(--info). Comment
records that provenance so the two stay intentionally in sync.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@AndresL230
AndresL230 merged commit 8b3c9f3 into mainJul 8, 2026
6 checks passed
@AndresL230
AndresL230 deleted the fix/frontend-audit-residuals-106-112 branch August 2, 2026 18:30
Sign up for freeto 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.

[P2] Polish: side-stripe borders, white panels, overshoot easing, Inter font [P1] Replace landing hero-metric glass cards + neon-blue accents

2 participants

@Jose-Gael-Cruz-Lopez@AndresL230
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112) - #310

Merged
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112
Jul 8, 2026
Merged

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112)#310
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112

Conversation

@Jose-Gael-Cruz-Lopez

Copy link
Copy Markdown
Member

What & why

Clears the last residuals on two frontend-audit issues that were mostly already resolved on main (by #102's glass removal, the token migration, and prior polish). Verified each acceptance box, then fixed only what genuinely remained.

Closes#106
Closes#112

#106 — landing hero glass cards + neon-blue accents

ACState on mainThis PR
No big-number stat tiles in the hero✅ already done (#102 removed them; the two floating cards are now a color legend + action chips, no numbers, opaque --bg-panel)
No #3B82F6 neon-blue on hero surfaces❌ residual: the intro-orbit blue node + hero-canvas graph palettefixed
  • globals.css: .landing-intro-orbit-node--bluebackground: var(--info) (both the base rule and the .landing-page-scoped duplicate).
  • (public)/page.tsx: the hero-canvas palette, CLUSTER_COLORS, and OB_STEP_COLORS blue entries → #3e6f8a (the concrete --info value — these are JS canvas / inline sinks where var() doesn't resolve). This is exactly the shift the issue's Fix note requested ("toward the warmer --info #3e6f8a").

#112 — polish (side-stripes / white panels / easing / Inter)

ACState on mainThis PR
No border-left/right > 1px colored accent stripes❌ one left: the gradebook category listfixed
Panels/inputs tinted off pure white✅ done (--bg-panel/--bg-input = #fdfcf9 warm paper)
--ease used instead of overshoot easing✅ cited CSS overshoot removed → var(--ease)
Inter removed; --font-inter → DM Sans✅ done (Inter dropped from layout.tsx; --font-inter--font-sans)
  • Gradebook/AssignmentList.tsx: the category <ul> used borderLeft: 2px solid ${color} as its only category-color indicator. Moved the color to a leading dot in the category header (the treatment the issue recommends, matching the existing AchievementUnlockToast dot) and made the list border a 1px neutral --border divider. No information lost.

Not in scope (flagged, deliberate)

Test plan

  • Frontend CI (npm ci + build/lint) is the gate; changes are color-value swaps + one standard JSX dot span (mirrors AchievementUnlockToast).
  • No functional/layout change beyond the intended visuals; --info and #3e6f8a are the same color, so the orbit node + canvas stay in sync.

🤖 Generated with Claude Code

…, #112)
#106 — replace the #3B82F6 neon-blue on landing/hero surfaces with the warmer
--info (#3e6f8a), per the issue's fix note:
- globals.css: the intro-orbit blue node -> var(--info) (base + .landing-page rule)
- (public)/page.tsx: hero-canvas graph palette + CLUSTER_COLORS + OB_STEP_COLORS
blue entries -> #3e6f8a (concrete hex; JS canvas / inline sinks where var()
doesn't resolve)
The hero stat tiles / glass cards were already removed by #102, so #106's AC1
was already met on main; this clears AC2.
#112 — the assignment-category list used `2px solid ${color}` as its ONLY
category-color indicator, which fails the "no >1px colored side-stripe" bar.
Move the category color to a leading dot in the header (the issue's recommended
treatment) and make the list border a 1px neutral --border divider — no info
lost. #112's other three items (off-white panels, --ease easing, Inter->DM Sans)
were already done on main.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@coderabbitai

coderabbitaiBot commented Jul 3, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@AndresL230, you've reached your PR review limit, so we couldn't start this review.

Next review available in:9 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: cb08ac53-82c4-47e6-85ef-9173a70d4e64

📥 Commits

Reviewing files that changed from the base of the PR and between 6243563 and 236c3d8.

📒 Files selected for processing (3)
  • frontend/src/app/(public)/page.tsx
  • frontend/src/app/globals.css
  • frontend/src/components/Gradebook/AssignmentList.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/frontend-audit-residuals-106-112

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@cloudflare-workers-and-pages

cloudflare-workers-and-pagesBot commented Jul 3, 2026

Copy link
Copy Markdown

Deploying with Cloudflare Workers Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

StatusNameLatest CommitPreview URLUpdated (UTC)
✅ Deployment successful!
View logs
frontend-staging236c3d8Commit Preview URL

Branch Preview URL
Jul 08 2026, 06:41 AM

AndresL230and others added 2 commits July 8, 2026 02:04
The hero-canvas orb palettes hardcode #3e6f8a because canvas fillStyle
can't resolve CSS var(); the CSS orbit node uses var(--info). Comment
records that provenance so the two stay intentionally in sync.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@AndresL230
AndresL230 merged commit 8b3c9f3 into mainJul 8, 2026
6 checks passed
@AndresL230
AndresL230 deleted the fix/frontend-audit-residuals-106-112 branch August 2, 2026 18:30
Sign up for freeto 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.

[P2] Polish: side-stripe borders, white panels, overshoot easing, Inter font [P1] Replace landing hero-metric glass cards + neon-blue accents

2 participants

@Jose-Gael-Cruz-Lopez@AndresL230
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112) - #310

Merged
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112
Jul 8, 2026
Merged

fix(ui): clear landing neon-blue + gradebook category stripe (closes #106, #112)#310
AndresL230 merged 3 commits into
mainfrom
fix/frontend-audit-residuals-106-112

Conversation

@Jose-Gael-Cruz-Lopez

Copy link
Copy Markdown
Member

What & why

Clears the last residuals on two frontend-audit issues that were mostly already resolved on main (by #102's glass removal, the token migration, and prior polish). Verified each acceptance box, then fixed only what genuinely remained.

Closes#106
Closes#112

#106 — landing hero glass cards + neon-blue accents

ACState on mainThis PR
No big-number stat tiles in the hero✅ already done (#102 removed them; the two floating cards are now a color legend + action chips, no numbers, opaque --bg-panel)
No #3B82F6 neon-blue on hero surfaces❌ residual: the intro-orbit blue node + hero-canvas graph palettefixed
  • globals.css: .landing-intro-orbit-node--bluebackground: var(--info) (both the base rule and the .landing-page-scoped duplicate).
  • (public)/page.tsx: the hero-canvas palette, CLUSTER_COLORS, and OB_STEP_COLORS blue entries → #3e6f8a (the concrete --info value — these are JS canvas / inline sinks where var() doesn't resolve). This is exactly the shift the issue's Fix note requested ("toward the warmer --info #3e6f8a").

#112 — polish (side-stripes / white panels / easing / Inter)

ACState on mainThis PR
No border-left/right > 1px colored accent stripes❌ one left: the gradebook category listfixed
Panels/inputs tinted off pure white✅ done (--bg-panel/--bg-input = #fdfcf9 warm paper)
--ease used instead of overshoot easing✅ cited CSS overshoot removed → var(--ease)
Inter removed; --font-inter → DM Sans✅ done (Inter dropped from layout.tsx; --font-inter--font-sans)
  • Gradebook/AssignmentList.tsx: the category <ul> used borderLeft: 2px solid ${color} as its only category-color indicator. Moved the color to a leading dot in the category header (the treatment the issue recommends, matching the existing AchievementUnlockToast dot) and made the list border a 1px neutral --border divider. No information lost.

Not in scope (flagged, deliberate)

Test plan

  • Frontend CI (npm ci + build/lint) is the gate; changes are color-value swaps + one standard JSX dot span (mirrors AchievementUnlockToast).
  • No functional/layout change beyond the intended visuals; --info and #3e6f8a are the same color, so the orbit node + canvas stay in sync.

🤖 Generated with Claude Code

…, #112)
#106 — replace the #3B82F6 neon-blue on landing/hero surfaces with the warmer
--info (#3e6f8a), per the issue's fix note:
- globals.css: the intro-orbit blue node -> var(--info) (base + .landing-page rule)
- (public)/page.tsx: hero-canvas graph palette + CLUSTER_COLORS + OB_STEP_COLORS
blue entries -> #3e6f8a (concrete hex; JS canvas / inline sinks where var()
doesn't resolve)
The hero stat tiles / glass cards were already removed by #102, so #106's AC1
was already met on main; this clears AC2.
#112 — the assignment-category list used `2px solid ${color}` as its ONLY
category-color indicator, which fails the "no >1px colored side-stripe" bar.
Move the category color to a leading dot in the header (the issue's recommended
treatment) and make the list border a 1px neutral --border divider — no info
lost. #112's other three items (off-white panels, --ease easing, Inter->DM Sans)
were already done on main.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@coderabbitai

coderabbitaiBot commented Jul 3, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@AndresL230, you've reached your PR review limit, so we couldn't start this review.

Next review available in:9 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: cb08ac53-82c4-47e6-85ef-9173a70d4e64

📥 Commits

Reviewing files that changed from the base of the PR and between 6243563 and 236c3d8.

📒 Files selected for processing (3)
  • frontend/src/app/(public)/page.tsx
  • frontend/src/app/globals.css
  • frontend/src/components/Gradebook/AssignmentList.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/frontend-audit-residuals-106-112

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@cloudflare-workers-and-pages

cloudflare-workers-and-pagesBot commented Jul 3, 2026

Copy link
Copy Markdown

Deploying with Cloudflare Workers Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

StatusNameLatest CommitPreview URLUpdated (UTC)
✅ Deployment successful!
View logs
frontend-staging236c3d8Commit Preview URL

Branch Preview URL
Jul 08 2026, 06:41 AM

AndresL230and others added 2 commits July 8, 2026 02:04
The hero-canvas orb palettes hardcode #3e6f8a because canvas fillStyle
can't resolve CSS var(); the CSS orbit node uses var(--info). Comment
records that provenance so the two stay intentionally in sync.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@AndresL230
AndresL230 merged commit 8b3c9f3 into mainJul 8, 2026
6 checks passed
@AndresL230
AndresL230 deleted the fix/frontend-audit-residuals-106-112 branch August 2, 2026 18:30
Sign up for freeto 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.

[P2] Polish: side-stripe borders, white panels, overshoot easing, Inter font [P1] Replace landing hero-metric glass cards + neon-blue accents

2 participants

@Jose-Gael-Cruz-Lopez@AndresL230