Responsive Image Styles should not depend on a theme for its breakpoints

For context, this arose from 📌 Implementation of the initial Media Management Proposal Active .

For now, we decided to enable Olivero and rely on its breakpoints. We could still do that as an official decision but it might not be viable for the long term.

I looked at core's Breakpoint module and it's ironclad in its insistence that only modules and themes can define breakpoint files.

So I think that, to do this, we'll need to be able to define custom breakpoints stored in configuration.

I can think of two ways to do it:

1. We could create a new module (or find one) that lets you define custom breakpoints and have the recipe depend on and use that.
2. Maybe we could do the same thing with ECA, if ECA supports defining breakpoints. Since breakpoint definitions do have an alter hook, this should work in theory as long as ECA is able to intercept that hook.

TLDR: yes, a glue module or recipe to provide common aspect ratios and breakpoint combinations with generated responsive image styles not connected to any theme would be good

Fuller info:
I tried to think of this holistically for many possible site use cases, so I asked a designer who understands a bit about performance with images to look at a spin up of Drupal CMS responsive images for feedback:

- They liked the list of aspect ratios but would include 21:9 as a target
- Based on naming, they'd expect an XL size as they target 1980px for HD displays when they reuse content on full screen news and events walls and they often spot check key graphics at 4-5 sizes (supports sizes not being tied to a theme)
- Asked if all images got generated for all these styles as that freaked their design side out

After mentioning you can place a focal point on an image to influence resizing they breathed easier, but had a good side question as to whether you can tag an image as to what aspect ratios it can be recut. Different issue for later...

Then I showed them the default (blank) page for Responsive Image Styles on a new core site. First question "where's the list of aspect ratios to choose from?"

I asked a bit more and their expectations were to see a list of aspect ratios to select as allowable, as many of the graphical brochure sites often have a very much reduced set of art production targets -- 3:2 for call out boxes, 16:9 or 21:9 for heroes, square in stories. And they would want no others allowed to reduce issues that editors could cause in their design. They'd prefer a 'use this set of aspect ratios' then generate just those, but having a full set and removing those you don't want used was fine if it meant they didn't have to go create any themselves.

References for breakpoints is compiled elsewhere for us at https://blog.logrocket.com/css-breakpoints-responsive-design/ but for this, having a choice between bootstrap/tailwind/whatever vs just a xs sm md lg xl xxl whatever set makes sense -- making it a chose your own system widths could be nice and in which case an ECA setup for choosing or defining a set to generate against could be nice, but for expediency a set and go seems prudent for now

Searched around more, and maybe gluing a list and https://www.drupal.org/project/easy_responsive_images → together might help reduce work