Fresh attempt at Report Summary detail page #66
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
- Created report_summary content type with all required fields - Added Report topics vocabulary - Created field storages: emphasized_title_text, report_pdf, report_topics - Added field instances: address (state only), authors, published_date, representative_image, sections, report_pdf, report_topics, emphasized_title_text - Configured Layout Builder display with banner layout including sidebar region - Updated banner layout to include sidebar region for metadata display - Updated ilr_section_navigation to support report_summary bundle - Added layout_builder__layout field for Layout Builder functionality
- Created custom CSS for report_summary banner with 50/50 split layout - Added dark overlay on left side with content, image on right side - Styled title with FuturaBT ExtraBlack font at 50px - Added pill-style topic tags with different mobile/desktop treatments - Created sidebar card with metadata fields and download button - Positioned sidebar absolutely on desktop (overlapping image), stacked on mobile - Added report_summary library to il
- Changed published_date field formatter from datetime_default to datetime_custom with format 'D, m/d/Y' - Added field preprocess hook to override PDF link text to 'Read the Report' for report_summary bundle - Removed unnecessary last-child margin-bottom CSS rule from banner sidebar
… pages - Created custom section navigation CSS for report_summary bundle with gray background and horizontal padding - Implemented mobile select dropdown (shown below 1000px) with custom styling and down arrow icon - Added desktop horizontal navigation list (shown at 1000px+) with uppercase links and down arrow icons - Created JavaScript behavior to handle mobile select dropdown navigation - Updated item_list preprocess to pass current
- Removed ::before pseudo-element that displayed "REPORT" label above title - Label was only shown on mobile (max-width: 999px) with Replica Std font - Cleaned up comment for down arrow styling
…mmary pages - Removed dark overlay (::before pseudo-element) on mobile - Changed banner to flex column layout on mobile with auto min-height - Moved content background color to content wrapper (#222222) with reduced padding - Stacked media below content on mobile using flexbox order property - Set media to relative positioning with 400px height on mobile - Adjusted sidebar positioning: centered horizontally and positioned at 28rem from
Contributor
|
Thanks, @GregWarren14. This is the result of my first Summary Report node. Do you see similar issues? 
Specifically:
|
jeffam
force-pushed
the
feature/report-detail-page-v2
branch
from
c5ce3ce to
7e05af2
Compare
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.
Implements Report Summary detail page design with custom banner layout and responsive section navigation.
Reworked how we were structuring this to use layout builder instead of dedicated template. I was having issues getting the jump nav swap to work correctly with just pure css, so this was the solution I opted for. This should include all of the necessary config.
web/modules/custom/ilr/css/report-summary.css
web/modules/custom/ilr/ilr.module
web/modules/custom/ilr/ilr.libraries.yml
web/modules/custom/ilr/js/section-navigation.js
web/themes/custom/union_marketing/templates/content/item-list--section-navigation.html.twig