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

[Bug Report][3.5.14] VProgressLinear overflows on Safari when scrollbar present in VDialog #19564

Open
Jokab opened this issue Apr 8, 2024 · 0 comments
Assignees
Labels
C: VProgressLinear platform specific The issue only occurs on a specific platform T: bug Functionality that does not work as intended/expected

Comments

@Jokab
Copy link

Jokab commented Apr 8, 2024

Environment

Vuetify Version: 3.5.14
Last working version: 3.1.1
Vue Version: 3.4.21
Browsers: Safari
OS: Mac OS 10.15

Steps to reproduce

See the reproduction link for a minimal reproduction.

  1. Create VDialog with height restriction
  2. Put one of the recommended containers inside VDialog (VCard, VSheet, VList) with some CSS to create a scrollbar, such as padding
  3. Put a VProgressLinear inside the container
<template>
  <v-dialog :model-value="true" height="5rem">
    <VSheet style="padding: 4rem">
      <v-progress-linear :indeterminate="true" />
    </VSheet>
  </v-dialog>
</template>

The important factor is for a scrollbar to appear. This can of course also be achieved by inserting enough content in the container, thus not requiring a height on the VDialog.

Expected Behavior

The VProgressLinear should be contained inside the padding (screenshot from 3.1.1)
image

Actual Behavior

The VProgressLinear overflows into the padding, creating a graphical error

image

Reproduction Link

https://play.vuetifyjs.com/#...

Other comments

Only happens on Safari, and maybe other Webkit-based browsers.
This seems to have broken in 3.1.2 when the absolute, top and bottom props were added to VProgressLinear, likely in PR #15883 #15883

@KaelWD KaelWD added T: bug Functionality that does not work as intended/expected platform specific The issue only occurs on a specific platform C: VProgressLinear labels Apr 8, 2024
@KaelWD KaelWD self-assigned this Apr 8, 2024
@github-actions github-actions bot removed the S: triage label Apr 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C: VProgressLinear platform specific The issue only occurs on a specific platform T: bug Functionality that does not work as intended/expected
Projects
None yet
Development

No branches or pull requests

2 participants