10BC0 feat(VTabs): slots for prev/next by J-Sek · Pull Request #21976 · vuetifyjs/vuetify · GitHub
[go: up one dir, main page]
Skip to content

feat(VTabs): slots for prev/next #21976

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.

Sign up for GitHub

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

Jump to bottom
Merged
merged 1 commit into from
Oct 8, 2025
Merged

feat(VTabs): slots for prev/next #21976

merged 1 commit into from
Oct 8, 2025

Conversation

J-Sek
Copy link
Contributor
@J-Sek J-Sek commented Aug 28, 2025 •
edited
Loading

Description

resolves #21969

Markup:

<template>
  <v-app theme="dark">
    <v-container max-width="600">
      <v-card>
        <v-tabs
          bg-color="teal-darken-3"
          slider-color="teal-lighten-3"
          show-arrows
        >
          <v-tab
            v-for="i in 30"
            :key="i"
            :text="'Item ' + i"
            :value="'tab-' + i"
          />

          <template #prev>
            <v-btn icon="$prev" rounded="lg" size="small" v-tooltip:left="'Move left'" />
          </template>
          <template #next>
            <v-btn icon="$next" rounded="lg" size="small" v-tooltip:right="'Move right'" />
          </template>
        </v-tabs>
      </v-card>
    </v-container>

    <v-container max-width="300" class="mt-12">
      <v-card>
        <v-tabs
          bg-color="teal-darken-3"
          direction="vertical"
          slider-color="teal-lighten-3"
          style="max-height: 450px"
          show-arrows
        >
          <v-tab v-for="i in 30" :key="i" :text="'Item ' + i" :value="'tab-' + i"/>

          <template #prev>
            <v-icon-btn
              class="ma-2"
              icon="$prev"
              rotate="90"
              rounded="lg"
              size="small"
              v-tooltip:top="'Move up'"
            />
          </template>
          <template #next>
            <v-icon-btn
              class="ma-2"
              icon="$next"
              rotate="90"
              rounded="lg"
              size="small"
              v-tooltip:bottom="'Move down'"
            />
          </template>
        </v-tabs>
      </v-card>
    </v-container>
  </v-app>
</template>

@J-Sek J-Sek self-assigned this Aug 28, 2025
@J-Sek J-Sek added T: feature A new feature C: VTabs labels Aug 28, 2025
@J-Sek J-Sek changed the base branch from master to dev August 28, 2025 20:09
@J-Sek J-Sek changed the title Feat/vtabs slots feat(VTabs): slots for prev/next Aug 28, 2025
@KaelWD KaelWD force-pushed the dev branch 2 times, most recently from 6331ca7 to 564ccc8 Compare September 10, 2025 13:29
@J-Sek J-Sek force-pushed the feat/vtabs-slots branch from 91801a9 to 89280cb Compare October 8, 2025 13:58
@J-Sek J-Sek merged commit ff15dd0 into vuetifyjs:dev Oct 8, 2025
6 of 8 checks passed
@J-Sek J-Sek deleted the feat/vtabs-slots branch October 8, 2025 14:00
J-Sek added a commit that referenced this pull request Oct 8, 2025
@J-Sek
feat(VTabs): slots for prev/next (#21976)
d8f682e 
resolves #21969
J-Sek added a commit that referenced this pull request Oct 8, 2025
@J-Sek
feat(VTabs): slots for prev/next (#21976)
0854504 
resolves #21969
J-Sek added a commit that referenced this pull request Oct 8, 2025
@J-Sek
feat(VTabs): slots for prev/next (#21976)
bb15873 
resolves #21969
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees

@J-Sek J-Sek

Labels
C: VTabs T: feature A new feature
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[Feature Request] Support for custom next / prev slots in v-tabs
1 participant
@J-Sek
0