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

fix(VExpansionPanel): fix accordion variant border radius #19433

Merged

Conversation

SonTT19
Copy link
Contributor

@SonTT19 SonTT19 commented Mar 19, 2024

Description

fixes #19379

Markup:

<template>
  <v-container>
    <!-- works fine -->
    <div class="text-subtitle-2 mt-4 mb-2">Accordion with multiple items</div>
    <v-expansion-panels variant="accordion">
      <v-expansion-panel
        rounded="xl"
        v-for="i in 3"
        :key="i"
        text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
        title="Item"
      ></v-expansion-panel>
    </v-expansion-panels>

    <!-- should be rounded -->
    <div class="text-subtitle-2 mt-4 mb-2">Accordion with 1 item</div>
    <v-expansion-panels variant="accordion">
      <v-expansion-panel
        rounded="xl"
        v-for="i in 1"
        :key="i"
        text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
        title="Item"
      ></v-expansion-panel>
    </v-expansion-panels>

    <!-- works fine -->
    <div class="text-subtitle-2 mt-4 mb-2">Default with 1 item</div>
    <v-expansion-panels>
      <v-expansion-panel
        v-for="i in 1"
        :key="i"
        text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
        title="Item"
      ></v-expansion-panel>
    </v-expansion-panels>

    <div class="text-subtitle-2 mt-4 mb-2">Default with 3 item</div>
    <v-expansion-panels>
      <v-expansion-panel
        v-for="i in 3"
        :key="i"
        text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
        title="Item"
      ></v-expansion-panel>
    </v-expansion-panels>
  </v-container>
</template>

@MajesticPotatoe MajesticPotatoe added T: bug Functionality that does not work as intended/expected C: VExpansionPanels VExpansionPanels labels Mar 19, 2024
@johnleider johnleider added this to the v3.5.x milestone Mar 26, 2024
@johnleider johnleider force-pushed the fix/19379-v-expansion-panel-accordion-border-radius branch from 6c161e1 to c585a50 Compare March 26, 2024 13:59
@johnleider johnleider merged commit 955fc62 into master Mar 26, 2024
11 checks passed
@johnleider johnleider deleted the fix/19379-v-expansion-panel-accordion-border-radius branch March 26, 2024 13:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C: VExpansionPanels VExpansionPanels T: bug Functionality that does not work as intended/expected
Projects
None yet
3 participants