Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add overflow-visible prop #87

Merged
merged 2 commits into from
Aug 31, 2022
Merged

Add overflow-visible prop #87

merged 2 commits into from
Aug 31, 2022

Conversation

weotch
Copy link
Member

@weotch weotch commented Aug 31, 2022

Closes #83.

@netlify
Copy link

netlify bot commented Aug 31, 2022

Deploy Preview for vue-ssr-carousel ready!

Name Link
🔨 Latest commit 30465a6
🔍 Latest deploy log https://app.netlify.com/sites/vue-ssr-carousel/deploys/630eb2b5c182990009aacfec
😎 Deploy Preview https://deploy-preview-87--vue-ssr-carousel.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 settings.

Comment on lines +38 to +39
# Disable the overflow:hidden on the mask
overflowVisible: Boolean
Copy link
Member Author

Choose a reason for hiding this comment

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

@brokenhd this is the new prop I'm adding for handling the stuff we looked at today without having to override internal CSS.

Copy link
Member Author

Choose a reason for hiding this comment

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

@brokenhd what do you think of the name? I also considered no-mask...

Copy link
Member Author

Choose a reason for hiding this comment

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

Eh, gonna stick with overflow-visible

Comment on lines +167 to +169
## Supply your own overflow:hidden

Add the `overflow-visible` prop to supply your own `overflow: hidden`, for cases where you want to prevent the width of the carousel from expanding but do want the carousel to extend to the edges of the page. It makes the most sense with a big `peek-right` that hints at other slides.
Copy link
Member Author

Choose a reason for hiding this comment

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

@brokenhd I added a demo of the approach we came up with today here: https://deploy-preview-87--vue-ssr-carousel.netlify.app/peeking, because I bet we'll be applying this on other projects as well.

@weotch weotch merged commit 407c42d into main Aug 31, 2022
@weotch weotch deleted the overflow-visible branch August 31, 2022 22:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add overflow-visible prop to disable the overflow rule on the mask
1 participant