refact: components fixes 2 #254
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…ctor at line 1904
…upport - Convert .fl-form-field to dual-class .c-form-field, .fl-form-field - Maintain 100% backward compatibility - Part of systematic FL Builder CSS migration
…upport - Convert input.fl-form-error to dual-class with c-form-error - Extends c-form-field coverage to input error states - Maintains 100% backward compatibility
- Convert .fl-widget to dual-class .c-widget, .fl-widget - Enable modern widget component styling - Maintains 100% backward compatibility
…pport - Convert .fl-animation to dual-class .c-animation, .fl-animation - Enable modern animation component styling - Maintains 100% backward compatibility
…port - Convert complex animation selectors to include dual-class patterns - Add c-animated class for modern animation states - Maintains 100% backward compatibility
…s support - Convert standalone .fl-animated to dual-class pattern - Complete animation-fill-mode properties dual-class support - Maintains 100% backward compatibility
…lass pattern - Add c-slideshow selector alongside fl-slideshow - Include universal child selectors (c-slideshow *, fl-slideshow *) - Maintains box-sizing: content-box for slideshow components - Zero visual impact - maintains backward compatibility
…e selector - Add c-slideshow .c-slideshow-image img alongside fl-slideshow .fl-slideshow-image img - Maintains max-width: none !important for slideshow images - Preserves nested selector functionality for both class prefixes - Zero visual impact - maintains backward compatibility
… dual-class pattern - Add c-slideshow-social selector alongside fl-slideshow-social - Maintains line-height: 0 !important for social elements - Preserves important styling for social media integration - Zero visual impact - maintains backward compatibility
…versal selector - Add c-slideshow-social * alongside fl-slideshow-social * - Maintains margin: 0 !important for all child elements - Completes slideshow social element styling migration - Zero visual impact - maintains backward compatibility
…ts to dual-class - Add c-col:before, c-col:after alongside fl-col:before, fl-col:after - Maintains clearfix functionality for grid layout system - Preserves display: table and content properties for pseudo-elements - High-frequency class (47 occurrences) - critical grid structure
…er conversion - Add c-col:after alongside fl-col:after in clearfix rule - Maintains clear: both functionality for grid column structure - Completes dual-class support for fl-col clearfix system - Essential for grid layout float clearing mechanism
…ts to dual-class - Add c-row:before, c-row:after alongside fl-row:before, fl-row:after - Maintains clearfix functionality for row layout system - Preserves display: table and content properties for pseudo-elements - High-frequency class (31 occurrences) - critical grid structure
…er conversion - Add c-row:after alongside fl-row:after in clearfix rule - Maintains clear: both functionality for grid row structure - Completes dual-class support for fl-row clearfix system - Essential for grid layout float clearing mechanism
- Added .c-rich-text dual-class support to primary .fl-rich-text selector - Maintains backward compatibility with FL-Builder content - Typography system applies to both class variants - Tier 1 CSS migration Phase 2 micro-change 1/5
- Added .c-content-text dual-class support to FL-Builder content block compatibility - Maintains @extend .c-content-block__text functionality - Enables modern .c-content-text usage alongside existing .fl-rich-text - CSS Migration Phase 2 micro-change 2/N
…tance - Added .c-content-text dual-class to font-weight inherit pattern - Applies to *:not(b, strong) elements for consistent font weights - Extends functionality that appears in 150+ places - CSS Migration Phase 2 micro-change 3/N
…nu integration - Added .c-menu alongside .fl-menu in navigation component - Ultra-conservative ≤3 line change - Tests passing: 39 runs, 57 assertions, 0 failures
…on items - Added .c-menu-item alongside .fl-menu-item - Ultra-conservative ≤3 line change - Tests passing: 39 runs, 57 assertions, 0 failures
…uilder integration - Created comprehensive pagination component with dual-class support - Integrated .fl-builder-pagination with .c-pagination dual-class system - Includes semantic component structure: item, link, current states - Tests passing: 39 runs, 57 assertions, 0 failures
- Add u-text-center, u-text-left, u-text-right to test-cta.html - Apply alignment utilities to test-hero.html button wraps - Replace inline text-align styles with utility classes - ✅ All tests pass with bin/rake test:critical - Ultra-conservative approach: only test templates modified - No production CSS or FL-Builder components touched 🎯 Progress: Safely validating utility class effectiveness ⚡ Impact: Demonstrating duplication reduction without risk
- Add u-text-center to category paragraph for consistent text alignment - Add u-text-center to main heading for improved visual hierarchy - Maintains FL-Builder class compatibility using additive approach - All tests pass (39 runs, 57 assertions, 0 failures)
- Replace style="margin-top: 3rem" with u-margin-top-xl utility class - Eliminates inline CSS in favor of consistent utility system - Maintains identical visual spacing with reusable approach - All tests pass (39 runs, 57 assertions, 0 failures)
- Apply u-text-center to heading, subheading, and description elements - Creates consistent visual hierarchy with proper text alignment - Maintains existing class compatibility using additive approach - All tests pass (39 runs, 57 assertions, 0 failures)
- Add u-text-center to testimonial blockquote for consistent quote styling - Add u-text-center to CTA title, description, and action elements - Improves visual consistency across different page contexts - Maintains existing CSS functionality with additive approach - All tests pass (39 runs, 57 assertions, 0 failures)
Contributor
|
Caution Review failedThe pull request is closed. WalkthroughAdds FAQ front matter to several blog posts; updates Services description; introduces a comprehensive Technical Debt report doc; broad CSS/SCSS updates for utilities, accessibility, dual-class (.c-/ .fl-) compatibility, and pagination; switches many Hugo templates to cached CSS partials and tweaks base layout (removes inline CSS, adds Mermaid SRI); removes single-title block; adds extensive template/tests. Changes
Sequence Diagram(s)sequenceDiagram
autonumber
actor User
participant Hugo as Hugo Renderer
participant T as Template (e.g., home.html)
participant P as assets/css-processor.html (cached)
User->>Hugo: Request page
Hugo->>T: Render template
T->>P: partialCached(dict{resources,bundleName}, cacheKey)
alt Cache hit
P-->>T: Return cached CSS bundle markup
else Cache miss
P->>P: Process resources & build bundle
P-->>T: Return generated CSS bundle markup
end
T-->>Hugo: Final HTML
Hugo-->>User: Response
sequenceDiagram
autonumber
participant Base as baseof.html
participant CDN as CDN (Mermaid)
Note over Base: Load Mermaid with SRI + crossorigin
Base->>CDN: <script src ... integrity ... crossorigin>
CDN-->>Base: Script delivered (SRI verified by browser)
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes Possibly related PRs
Suggested reviewers
Poem
✨ Finishing touches
🧪 Generate unit tests
📜 Recent review detailsConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro 📒 Files selected for processing (37)
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. Comment |
This was referenced Sep 26, 2025
Closed
This was referenced Oct 9, 2025
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary by CodeRabbit
New Features
Accessibility
Performance
Style
Documentation
Tests