docs icon indicating copy to clipboard operation
docs copied to clipboard

Style: Responsive Images/Figures & SCSS/Content Cleanup

Open zihanKuang opened this issue 6 months ago • 1 comments

Description:

This PR solves #547.

  • SCSS (_styles_project.scss):

    • Both general image styles and figure elements within .td-content now use a responsive max-width of clamp(320px, 100%, 700px). This allows them to adapt fluidly to parent container widths, maintaining a 320px minimum and adhering to the specified maximum.
    • Image & Figure Refactoring: Established a new general style rule for images (img, .md__image img, img.md-image-responsive) within .td-content to centralize common image properties and provide consistent base styling.
    • Code Cleanup: Removed a duplicate clip-path declaration and several redundant CSS properties, as these are now correctly inherited from the new general rules.
  • Content:

    • performance/index.md: Minor text corrections.
    • comments/index.md: Removed inline width styles from <figure> tags, deferring to global SCSS.

zihanKuang avatar May 07 '25 18:05 zihanKuang

Deploy Preview for bejewelled-pegasus-b0ce81 ready!

Name Link
Latest commit f117d0fea9d3ec90537f5728b4e1a86b4e2b2b31
Latest deploy log https://app.netlify.com/sites/bejewelled-pegasus-b0ce81/deploys/6821df3c8c95ef00088f8d8c
Deploy Preview https://deploy-preview-551--bejewelled-pegasus-b0ce81.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] avatar May 07 '25 18:05 netlify[bot]

Awesome. Nice job.

leecalcote avatar May 12 '25 14:05 leecalcote