feat: Add 'Read More' - PART 2 #11682
Open
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
…e and package.json; update package-lock.json to include lit dependencies.
- Introduced a new web component, OLReadMore, that supports height-based and line-based truncation. - Updated index.js to import the new component for registration as a custom element.
- Included the new OL components script in the footer for enhanced functionality. - Replaced the existing book description implementation with the OLReadMore component for better user experience with expandable/collapsible content.
- Changed 'Read more' and 'Read less' to 'Read More' and 'Read Less' for uniformity in capitalization. - Removed unnecessary margin-left style from the chevron icon.
- Changed 'Read more' and 'Read less' to 'Read More' and 'Read Less' for uniformity in capitalization in the book description section.
for more information, see https://pre-commit.ci
…oved accessibility and functionality - Replaced button elements with <details> and <summary> for better semantic structure. - Updated styles for toggle behavior and chevron icon. - Simplified the logic for handling content expansion and truncation. - Enhanced user experience by managing scroll behavior when collapsing content.
…library into feat/web-component-read-more
- Changed the Vite configuration file reference in the Makefile and package.json from `lit-vite.config.js` to `vite-lit.config.mjs`. - Removed the obsolete `lit-vite.config.js` file. - Updated the new Vite configuration file to include a comment indicating its purpose for Vue components.
…ling - Replaced <details> and <summary> elements with button elements for improved control over expansion and collapse. - Updated CSS class names for clarity and consistency. - Simplified event handling for toggling content visibility. - Enhanced button styles and added hover effects for better user interaction.
…ttribute to chevron icon - Updated the chevron SVG icon in the OLReadMore component to include the aria-hidden attribute for improved screen reader compatibility.
…experience - Updated the Table of Contents section to use the ol-read-more component for better expansion and collapse functionality. - Adjusted CSS styles for toc entries, including font size and padding for enhanced readability. - Improved the visual appearance of the toc__dots with a more defined border color.
… component - Replaced the previous work description structure with the ol-read-more component for improved readability and user interaction. - Adjusted the maximum lines displayed and updated the text for expanding and collapsing the description.
…mponent - Replaced the existing chapter display structure with the ol-read-more component for improved readability and user interaction. - Maintained functionality for displaying chapter links and pagination while enhancing the overall user experience.
- Deleted the ReadMore.html macro and its corresponding CSS styles from the project. - Updated LESS files to remove references to the read-more component, streamlining the codebase.
- Deleted the ReadMoreComponent and its related JavaScript and CSS files to streamline the codebase. - Updated the index.js file to remove conditional loading of read-more components. - Adjusted HTML templates to eliminate references to the read-more functionality, enhancing overall clarity and maintainability.
for more information, see https://pre-commit.ci
…of dots for improved visual consistency
…template - Deleted the ReadMore entry from bundlesize.config.json to streamline bundle size checks. - Updated the edition view template to remove the ReadMore class from excerpts, enhancing clarity and maintainability.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
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.
Continuation of the work done in #11666
This PR finishes replacing all instances of the Read More feature with the new web component. It also removes the code related to the old component.
Technical
Extends usage to additional locations:
Removes old Read More implementation:
Testing
Screenshot
Stakeholders
@RayBB @mekarpeles @cdrini @jimchamp