Merge upstream/develop and fix form-builder CSS issue

[arifulhoque7]

• Merged upstream/develop (commits up to f8a9a6e)
• Fixed tailwind.config.js to prevent CSS purging of form styles
  • Restored critical content paths: includes/Admin, admin/form-builder/assets/js
  • Kept new subscription template paths from upstream
  • Re-added daisyui plugin for compatibility
• Rebuilt form-builder.css with correct configuration
  • Restored @tailwindcss/forms base styles (2,106 lines)
  • Fixed missing input, checkbox, radio, and select styles

The upstream commit f8a9a6e had a broken tailwind.config.js that removed critical content paths, causing Tailwind to purge essential form styles. This commit combines both old and new content paths to ensure all styles are included while maintaining new functionality.

Summary by CodeRabbit

• Style
  • Comprehensive refresh of form-builder interface styling with enhanced buttons, dropdowns, tabs, tables, and toggles
  • Improved responsive design support across all screen sizes and devices
  • Added light and dark theme compatibility with refined color system

[coderabbitai]

Walkthrough

Extensive CSS additions for form-builder UI system with comprehensive component styling (buttons, inputs, dropdowns, tables, modals, tooltips). Updates Tailwind configuration to integrate daisyui plugin and expand content paths for PHP and JavaScript templates.

Changes

Cohort / File(s)	Summary
Form Builder CSS Styling assets/css/admin/form-builder.css	Added extensive UI component styling including global form controls, button system with hover/active states, dropdowns, tabs, tables with sticky headers, toggles, tooltips, modals, and toast animations. Introduced utility classes with light/dark theme support, responsive breakpoint variants (sm:, md:, lg:, xl:), and RTL-aware rules. Updated button hover colors and removed collapse visibility rule.
Tailwind Configuration tailwind.config.js	Extended content array with new paths (./assets/**/*.{js,jsx,ts,tsx,vue,html}, ./includes/Admin/**/*.php, ./admin/form-builder/assets/js/**/*.php, ./templates/**/*.php, wpuf-functions.php) and removed ./assets/js/**/*.{js,vue}. Added daisyui plugin with empty themes configuration.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20–25 minutes

Significant volume of CSS additions following consistent theming and utility class patterns reduces cognitive complexity per rule. Tailwind config updates are straightforward. Review requires understanding design system integration, daisyui plugin usage, and content path coverage validation.

Possibly related PRs

• Prevent CSS leaks by restricting form-builder styles to WPUF pages only #1700: Directly related; both modify form-builder CSS and Tailwind config with overlapping scoping and component styling changes.
• Fix/css scope conflict 1693 #1699: Modifies same CSS file with scoping/global-rule restrictions on admin styles.
• Add new post form templates and SVG icons #1690: Overlapping table and data-grid styling additions in the same form-builder stylesheet.

Suggested labels

needs: dev review

Suggested reviewers

• sapayth

Poem

🐰 A form so fine with buttons bright,
Daisyui blooms in dark and light,
Tailwind paths now stretch so wide,
Styled components, theme-allied!
Admin forms hop with grace applied. 🎨✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check	✅ Passed	The pull request title "Merge upstream/develop and fix form-builder CSS issue" directly and accurately reflects the main objectives of this changeset. The title captures both primary actions taken: merging upstream/develop into the target branch and fixing a Tailwind CSS purge issue that had removed essential form-builder styles. It is concise, specific enough to convey meaningful information about the changeset without being verbose or vague, and avoids unnecessary noise like file listings or generic terms. A teammate scanning the project history would clearly understand that this PR addresses both an upstream merge and a CSS-related fix for the form-builder system.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

📜 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 f8a9a6e and f26bc5c.

📒 Files selected for processing (2)

• assets/css/admin/form-builder.css (46 hunks)
• tailwind.config.js (2 hunks)

🧰 Additional context used

🪛 Biome (2.1.2)

assets/css/admin/form-builder.css

[error] 641-641: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

outline is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

---

[error] 891-891: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

border-color is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

---

[error] 951-951: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

transition-timing-function is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

---

[error] 1358-1358: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

line-height is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

---

[error] 1406-1406: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

line-height is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

---

[error] 1710-1710: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

transition-timing-function is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

---

[error] 2144-2144: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

line-height is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

---

[error] 2152-2152: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

line-height is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

---

[error] 2248-2248: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

transition-property is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

---

[error] 2278-2278: Duplicate properties can lead to unexpected behavior and may override previous declarations unintentionally.

width is already defined here.

Remove or rename the duplicate property to ensure consistent styling.

(lint/suspicious/noDuplicateProperties)

🔇 Additional comments (4)

tailwind.config.js (3)

7-15: LGTM! Content paths restored successfully.

The content paths have been properly expanded to include all necessary template directories. The restoration of ./includes/Admin/**/*.php and ./admin/form-builder/assets/js/**/*.php should resolve the Tailwind purge issue mentioned in the PR objectives.

---

28-28: LGTM! DaisyUI plugin properly integrated.

The daisyui plugin has been correctly added to restore the component library as mentioned in the PR objectives.

---

30-32: Verify the empty themes array is intentional.

The themes: [] configuration disables all daisyUI themes. Based on learnings about daisyUI 4.12.2, an empty themes array means no theme CSS will be generated, which could affect components that rely on theme variables.

If you intend to use daisyUI components with theming, consider specifying at least one theme or removing the themes configuration to use defaults:

 daisyui: {
-    themes: [],
+    // themes: false, // to disable all themes
+    // themes: ["light", "dark"], // or specify themes you need
 }

Based on learnings: daisyUI v4 provides multiple built-in themes and CSS variables. An empty themes array may cause components to lack proper color variables.

assets/css/admin/form-builder.css (1)

1-6370: Generated CSS appears complete but contains duplicate properties.

This CSS file was automatically generated by Tailwind CSS v3.4.11 with the @tailwindcss/forms and daisyUI plugins. The static analysis tool has flagged 10 instances of duplicate properties (outline, border-color, transition-timing-function, line-height, transition-property, width) throughout the file.

These duplicates are typically intentional in generated CSS for progressive enhancement or browser compatibility, but it's worth verifying visually that components render correctly.

If you notice any visual issues with the form builder components, the duplicate properties at the following lines may need investigation:

• Lines 641, 891, 951, 1358, 1406, 1710, 2144, 2152, 2248, 2278

Otherwise, since this is auto-generated code rebuilt with the corrected configuration, it should be functioning as intended.

---

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.}