feat: Restrict using Image Slider to landscape images #1743
Conversation
This file contains 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
RubenSibon
previously approved these changes
Nov 5, 2024
VincentSmedinga
changed the title
Co-authored-by: Vincent Smedinga <[email protected]>
github-actions
bot
temporarily deployed
to
demo-image-slider-aspect-ratios
github-actions
bot
temporarily deployed
to
demo-image-slider-aspect-ratios
VincentSmedinga
approved these changes
Nov 5, 2024
RubenSibon
approved these changes
Nov 7, 2024
alimpens
reviewed
Nov 8, 2024
| @@ -17,6 +17,8 @@ The images do not slide automatically. | |||
| - Use this for a series of images that belong together. | |||
| - Provide at least 2 images and at most 5. | |||
| - Feature the most essential image first. | |||
| - All images must have the same aspect ratio. | |||
There was a problem hiding this comment.
Do we want specify this as a guideline? This isn't currently the case, right? I kind of like that you can use different aspect ratio's in the same slider
| /** Specify the aspect ratio to use for the images. */ | ||
| aspectRatio: Ratio | ||
| export type ImageSliderImageProps = Omit<ImageProps, 'aspectRatio'> & { | ||
| /** The aspect ratio to use for the images. Options: `tall`, `square`, `wide`, and `x-wide`. */ |
There was a problem hiding this comment.
Do we need to specify the options in text here? The type will already show you the possible options, no?
| aspectRatio: Ratio | ||
| export type ImageSliderImageProps = Omit<ImageProps, 'aspectRatio'> & { | ||
| /** The aspect ratio to use for the images. Options: `tall`, `square`, `wide`, and `x-wide`. */ | ||
| aspectRatio: Pick<Ratio, 'tall' | 'square' | 'wide' | 'x-wide'> |
There was a problem hiding this comment.
I think you have to use Extract here:
Suggested change
| aspectRatio: Pick<Ratio, 'tall' | 'square' | 'wide' | 'x-wide'> | |
| aspectRatio: Extract<Ratio, 'tall' | 'square' | 'wide' | 'x-wide'> |
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.
Describe the pull request
The images in a image slider should only be able to use aspect-ratio 1:1, 4:3 and 16:9. landscape is nog an option.
What
The exclusion of type values
Why
To prevent the image slider from becomming to tall to scroll on small screens.
How
(How were these changes implemented? Provide a brief overview of the approach taken and any key considerations.)
Checklist
Before submitting your pull request, please ensure you have done the following. Check each checkmark if you have done so or if it wasn't necessary:
Additional notes