chore: add aura styles

[javier-godoy]

Summary by CodeRabbit

• Style

  • Enhanced CSS fallback chains for color, border, padding, and gap properties in day-of-week selector and context menu components to improve theme variable handling.

• New Features

  • Added dynamic theme configuration support for improved theming flexibility.

[coderabbitai]

Walkthrough

This PR enhances CSS variable fallback chains across styling files for the days-of-week selector and context menu components, ensuring robustness when intermediate theme variables are unavailable. Additionally, it adds DynamicTheme-based page configuration to the test AppShellConfigurator.

Changes

Cohort / File(s)	Summary
CSS Fallback Improvements src/main/resources/META-INF/frontend/styles/fc-days-of-week-selector-styles.css, src/main/resources/META-INF/frontend/styles/fc-days-of-week-selector.css, src/main/resources/META-INF/frontend/styles/vaadin-context-menu-list-box.css	Updated CSS variable fallback chains to cascade through Vaadin-specific variables when primary theme tokens are unavailable, improving robustness for disabled/readOnly states and spacing properties.
TypeScript Styling src/main/resources/META-INF/resources/frontend/src/fc-days-of-week-selector.ts	Extended CSS variable fallback chains for gap and margin-left properties to include intermediate Vaadin variables before final fallback values.
Test Configuration src/test/java/com/flowingcode/vaadin/addons/AppShellConfiguratorImpl.java	Added DynamicTheme-based page configuration with configurePage() method, replacing static @Theme annotation with dynamic theme initialization.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related PRs

• Fix overflow buttons styling in Vaadin 25 #20: Modifies the same days-of-week selector styling files and test configuration, directly related through shared component changes.
• refactor: add theme attribute to context menu to allow to scope styles #19: Updates context-menu-related files with earlier theming and scoping changes that this PR's CSS fallback adjustments build upon.
• Add overflow button when component is too narrow #14: Touches the same fc-days-of-week-selector component, with this PR adjusting CSS variable fallbacks while the related PR handles overflow behavior.

Suggested reviewers

• paodb

🚥 Pre-merge checks | ✅ 1 | ❌ 2

❌ Failed checks (1 warning, 1 inconclusive)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.
Title check	❓ Inconclusive	The title 'chore: add aura styles' is vague and does not clearly describe the actual changes made. The PR modifies CSS fallbacks across multiple style files and updates a configurator class, but the title does not convey these specifics or the scope of changes.	Consider a more descriptive title that clarifies the actual changes, such as 'chore: improve CSS fallback chains for theme variables' or 'chore: enhance Aura theme compatibility with CSS fallbacks'.

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

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

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch aura

---

No actionable comments were generated in the recent review. 🎉

🧹 Recent nitpick comments

src/main/resources/META-INF/frontend/styles/vaadin-context-menu-list-box.css (1)

22-24: Padding fallback chain lacks a hardcoded terminal value.

Line 22's padding will resolve to nothing if both --lumo-space-xs and --vaadin-padding-xs are undefined. Compare with the gap fallback in fc-days-of-week-selector.ts (line 67) which terminates with a hardcoded 0.5rem. Consider adding a terminal fallback here too for robustness in non-Lumo/non-Aura environments:

-	padding: 0 var(--lumo-space-xs, var(--vaadin-padding-xs));
+	padding: 0 var(--lumo-space-xs, var(--vaadin-padding-xs, 0.25rem));

Similarly, the gap on line 24 has no hardcoded terminal fallback after --vaadin-padding-m.

---

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 and usage tips.}

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud