Skip to content

fix: properly override header values - #1673

Merged
Eli Bosley (elibosley) merged 4 commits into
mainfrom
fix/color-overrides
Sep 8, 2025
Merged

fix: properly override header values#1673
Eli Bosley (elibosley) merged 4 commits into
mainfrom
fix/color-overrides

Conversation

@elibosley

@elibosleyEli Bosley (elibosley) commented Sep 8, 2025

Copy link
Copy Markdown
Member

Summary by CodeRabbit

  • New Features
    • Header colors now support theme overrides with safe fallbacks (text primary/secondary and background).
  • Style
    • Scoped base styles and Tailwind preflight to the .unapi namespace for better isolation and fewer global side effects.
    • Refined element resets (buttons, dialogs, typography) and focus-visible states within .unapi.
    • Utilities remain globally available; recommend using .unapi-prefixed HTML for consistent styling.
    • Improved consistency of UI components under the scoped styling approach.

- Updated main.css to use scoped selectors, preventing conflicts with Tailwind's global styles.
- Neutralized global resets for non-.unapi elements and re-applied necessary resets within .unapi.
- Improved overall styling consistency for components within the Unraid interface.
…orts
- Modified header color variables in unraid-theme.css to allow theme overrides.
- Enhanced main.css by defining custom layers for Tailwind imports, improving specificity and scoping of styles within the Unraid WebGUI.
@coderabbitai

coderabbitaiBot commented Sep 8, 2025

Copy link
Copy Markdown
Contributor

Caution

Review failed

The pull request is closed.

Walkthrough

CSS updates replace hard-coded header colors with theme variables and restructure Tailwind usage: introducing layered imports, scoping preflight and base resets to the .unapi namespace, and refining component/resets within that scope. Global Tailwind utilities remain available. Other imports remain, with broadened class scanning paths.

Changes

Cohort / File(s)Summary
Theme variables
@tailwind-shared/unraid-theme.css
Converted header color constants to CSS custom property references with fallbacks: --color-header-text-primary, --color-header-text-secondary, --color-header-background.
Scoped Tailwind base and layers
web/src/assets/main.css
Replaced root Tailwind import with layered approach: @layer theme, unapi-base, components, utilities. Scoped Tailwind preflight and base resets inside .unapi. Consolidated/rewrote element resets and component tweaks under .unapi. Kept global utilities and existing external imports, expanded class scanning.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Poem

A rabbit twitches whiskers, neat and keen,
Threads of theme now weave a subtle sheen.
Preflight burrows under .unapi’s dome,
Utilities hop freely, room to roam.
Colors nibble vars with fallback grace—
Tailwind paths align, a tidier place. 🐇✨


📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 785f1f5 and cf5ca0b.

📒 Files selected for processing (2)
  • @tailwind-shared/unraid-theme.css (1 hunks)
  • web/src/assets/main.css (2 hunks)
✨ Finishing Touches
🧪 Generate unit tests
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch fix/color-overrides

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

@claude

claudeBot commented Sep 8, 2025

Copy link
Copy Markdown

Claude finished Eli Bosley (@elibosley)'s task —— View job


PR Review: Color Override Fix

Analyzing the changes for critical issues in the diff...

Todo List:

  • Read modified files to understand the specific changes
  • Analyze only the changed lines for critical issues (bugs, security, breaking changes, data loss)
  • Post review findings

Analysis of Changed Lines:

@tailwind-shared/unraid-theme.css (Lines 87-90):

  • Changed hardcoded header color values to use CSS custom properties with fallbacks
  • --color-header-text-primary: var(--header-text-primary, #1c1c1c)
  • --color-header-text-secondary: var(--header-text-secondary, #999999)
  • --color-header-background: var(--header-background-color, #f2f2f2)

web/src/assets/main.css (Lines 6-11, 21-29):

  • Replaced @import "tailwindcss"; with layer-specific imports
  • Changed from @layer base to @layer unapi-base
  • Simplified Tailwind preflight scoping approach

No critical issues found in changes

The modifications are focused on CSS variable improvements and Tailwind import optimization. All fallback values are preserved, ensuring backwards compatibility.

@elibosley
Eli Bosley (elibosley) merged commit aecf70f into mainSep 8, 2025
8 of 9 checks passed
@elibosley
Eli Bosley (elibosley) deleted the fix/color-overrides branch September 8, 2025 16:55
@github-actionsgithub-actionsBot mentioned this pull request Sep 8, 2025
@codecov

codecovBot commented Sep 8, 2025

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 58.53%. Comparing base (193be3d) to head (cf5ca0b).
⚠️ Report is 2 commits behind head on main.

Additional details and impacted files
@@ Coverage Diff @@## main #1673 +/- ##
=======================================
Coverage 58.53% 58.53% =======================================
Files 624 624 Lines 30732 30732 Branches 3617 3617 =======================================
Hits 17989 17989 Misses 12706 12706 Partials 37 37 

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@github-actions

Copy link
Copy Markdown
Contributor

This plugin has been deployed to Cloudflare R2 and is available for testing.
Download it at this URL:

https://preview.dl.unraid.net/unraid-api/tag/PR1673/dynamix.unraid.net.plg

Eli Bosley (elibosley) pushed a commit that referenced this pull request Sep 8, 2025
🤖 I have created a release *beep* *boop*
---
## [4.20.0](v4.19.1...v4.20.0)
(2025-09-08)
### Features
* **disks:** add isSpinning field to Disk type
([#1527](#1527))
([193be3d](193be3d))
### Bug Fixes
* better component loading to prevent per-page strange behavior
([095c222](095c222))
* **deps:** pin dependencies
([#1669](#1669))
([413db4b](413db4b))
* **plugin:** add fallback for unraid-api stop in deprecation cleanup
([#1668](#1668))
([797bf50](797bf50))
* prepend 'v' to API version in workflow dispatch inputs
([f0cffbd](f0cffbd))
* progress frame background color fix
([#1672](#1672))
([785f1f5](785f1f5))
* properly override header values
([#1673](#1673))
([aecf70f](aecf70f))
---
This PR was generated with [Release
Please](https://github.com/googleapis/release-please). See
[documentation](https://github.com/googleapis/release-please#release-please).
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
@github-actionsgithub-actionsBot mentioned this pull request Oct 27, 2025
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.

1 participant

@elibosley