[JW-CH]

fixes #714

Summary by CodeRabbit

• Style
  • Updated stylesheet processing to unwrap eligible CSS layers, including nested layers, and omit empty layers. This changes how layered styles are prepared before they are applied. No new user-facing controls or features are included.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

• Configuration used: Repository: immichFrame/ImmichFrame/.coderabbit.yaml
• Review profile: CHILL
• Plan: Advanced
• Run ID: 37cace44-8e98-418b-be26-b4dcd0a14df9

📥 Commits

Reviewing files that changed from the base of the PR and between c1edb77 and 2846046.

📒 Files selected for processing: 2

• immichFrame.Web/postcss-unwrap-layers.js
• immichFrame.Web/postcss.config.js

Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 7 remain after this review.

📝 Walkthrough

The change adds a PostCSS plugin that unwraps leaf @layer rules and registers the plugin alongside Tailwind’s PostCSS plugin.

Changes: PostCSS layer handling

Layer / File(s)	Summary
Layer unwrapping and registration immichFrame.Web/postcss-unwrap-layers.js, immichFrame.Web/postcss.config.js	The new unwrapLayers plugin unwraps leaf @layer rules, removes empty ones, and repeats traversal to process nested layers. The PostCSS configuration loads it alongside Tailwind’s PostCSS plugin.

Priority: ➖ Normal

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Bug fix · Severity of issue fixed: Medium

Merge Risk: ⚪ Minimal · up to 28460

No actionable display regression is established in the inspected styles. The change is mergeable after normal build and visual checks.

Pre-merge checks: 5

Passed checks: 5 passed

Check name	Status	Explanation
Description Check		Check skipped - CodeRabbit’s high-level summary is enabled.
Title check		The title clearly and concisely describes the main change: unwrapping Tailwind layers to address compatibility with older Chrome versions.
Linked Issues check		Issue #714 reports a display regression on older WebOS Chromium. The new unwrapLayers PostCSS plugin removes generated @layer wrappers, including nested layers, and the PostCSS configuration appli…
Out of Scope Changes check		The reviewed changes are limited to the PostCSS pipeline and the layer-unwrapping plugin. Both changes support the display fix for issue #714. No unrelated behavior or files are identified in the supp…
Docstring Coverage		Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 2 files.

✨ Finishing Touches: 💡 1

🛠️ Fix failing CI checks: 💡

• Commit to this branch
• Create a new PR

📝 Generate docstrings

• Commit to this branch
• Create a new PR

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[JW-CH]

@nightstorm2 sorry, took me a bit longer. could you test the docker image ghcr.io/immichframe/immichframe:fix_css in a few minutes.

[nightstorm2]

The problem has been resolved with the adjustment shown in the image at ghcr.io/immichframe/immichframe:fix_css.

Thank you very much.

[3rob3]

I was seeing some minor display issues with an older iPad. These also seem to be resolved with this PR.