Skip to content

feat!: switch sizes default to responsive-first - #977

Merged
danielroe merged 4 commits into
mainfrom
feat/responsive-defaults
Sep 13, 2023
Merged

feat!: switch sizes default to responsive-first#977
danielroe merged 4 commits into
mainfrom
feat/responsive-defaults

Conversation

@danielroe

@danielroe danielroe commented Sep 11, 2023

Copy link
Copy Markdown
Member

resolves #645

This aims to enable responsive sizing by default. It has two breaking changes:

  1. sizes without an explicit screen width (e.g. sizes="100vw") are interpreted as a responsive minimum size, e.g. 1px:100vw.
  2. Sizes are output from that screen-size up rather than that screen-size down, so sizes="md:100px lg:200px" means that the image is displayed at 100px by default. And at lg and above, at 200px. (Previously, this meant that it was displayed at 100px only up to md, and then displayed at 200px for all sizes above that.)

As these are both significant changes from previous behaviour, special care is requested in evaluating the API and DX.

@danielroe danielroe added the enhancement New feature or request label Sep 11, 2023
@danielroe
danielroe requested a review from pi0 September 11, 2023 15:45
@danielroe danielroe self-assigned this Sep 11, 2023
@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Sep 12, 2023

Copy link
Copy Markdown

Deploying with  Cloudflare Pages  Cloudflare Pages

Latest commit: 56087cf
Status: ✅  Deploy successful!
Preview URL: https://075ac7a8.nuxt-image.pages.dev
Branch Preview URL: https://feat-responsive-defaults.nuxt-image.pages.dev

View logs

@codecov-commenter

codecov-commenter commented Sep 12, 2023

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 89.22%. Comparing base (bd00755) to head (56087cf).
⚠️ Report is 834 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main     #977      +/-   ##
==========================================
+ Coverage   89.15%   89.22%   +0.06%     
==========================================
  Files          44       44              
  Lines        2914     2913       -1     
  Branches      323      325       +2     
==========================================
+ Hits         2598     2599       +1     
+ Misses        315      313       -2     
  Partials        1        1              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@atinux

atinux commented Sep 12, 2023

Copy link
Copy Markdown
Member

It looks good to me.

What changes are required in the docs?

@danielroe

Copy link
Copy Markdown
Member Author

Will update 👍

@ghost

ghost commented Sep 13, 2023

Copy link
Copy Markdown

Live Preview ready!

Name Edit Preview Latest Commit
Image Edit on Studio ↗︎ View Live Preview 56087cf

@pi0 pi0 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

overall looks a good idea to base on smaller sizes 👍🏼

@danielroe danielroe changed the title feat!: switch default to responsive-first sizes feat!: switch sizes default to responsive-first Sep 13, 2023
@danielroe
danielroe merged commit fadb6ee into main Sep 13, 2023
@danielroe
danielroe deleted the feat/responsive-defaults branch September 13, 2023 15:32
@danielroe danielroe mentioned this pull request Sep 13, 2023
riddla pushed a commit to tricks-gmbh/nuxt-image that referenced this pull request Mar 1, 2024
@github-actions github-actions Bot mentioned this pull request Jul 30, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Allow setting simple view-width based "sizes" values

4 participants