first commit
This commit is contained in:
Yusron alamsyah
@@ -0,0 +1,37 @@
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import UiParentCard from '@/components/shared/UiParentCard.vue';
|
||||
import UiChildCard from '@/components/shared/UiChildCard.vue';
|
||||
|
||||
import Basic from '@/components/ui-components/alert/Basic.vue';
|
||||
import Filled from '@/components/ui-components/alert/Filled.vue';
|
||||
import Closable from '@/components/ui-components/alert/Closable.vue';
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-row>
|
||||
<!-- Basic -->
|
||||
<v-col cols="12">
|
||||
<UiChildCard title="Alert Basic">
|
||||
<Basic />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
<!-- Filled -->
|
||||
<v-col cols="12">
|
||||
<UiChildCard title="Alert Filled">
|
||||
<Filled />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
<!-- Closable -->
|
||||
<v-col cols="12">
|
||||
<UiChildCard title="Alert Closable">
|
||||
<Closable />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<SharedUiChildCard title="Avatar">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Basic Avatar">
|
||||
<ui-components-avatar-basic-avatar />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Icon Avatar">
|
||||
<ui-components-avatar-icon-avatar />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Image Avatar">
|
||||
<ui-components-avatar-image-avatar />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Letter Avatar">
|
||||
<ui-components-avatar-letter-avatar />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Size Avatar">
|
||||
<ui-components-avatar-size-avatar />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Variant Avatar">
|
||||
<ui-components-avatar-variant-avatar />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,64 @@
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
/*import tabler icons*/
|
||||
import { TrashIcon, SendIcon, BellIcon } from 'vue-tabler-icons';
|
||||
import UiChildCard from '@/components/shared/UiChildCard.vue';
|
||||
// icons
|
||||
import { AccessPointIcon } from 'vue-tabler-icons';
|
||||
import BaseButtons from '@/components/ui-components/button/BaseButtons.vue';
|
||||
import ColorsButtons from '@/components/ui-components/button/ColorsButtons.vue';
|
||||
import OutlinedButtons from '@/components/ui-components/button/OutlinedButtons.vue';
|
||||
import SizeButtons from '@/components/ui-components/button/SizeButtons.vue';
|
||||
import TextButtons from '@/components/ui-components/button/TextButtons.vue';
|
||||
import IconColorSizes from '@/components/ui-components/button/IconColorSizes.vue';
|
||||
// buttons color data
|
||||
const btnsColor = ref(['primary', 'secondary', 'success', 'error', 'warning']);
|
||||
|
||||
</script>
|
||||
|
||||
// ===============================|| Ui Buttons ||=============================== //
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
|
||||
<v-row>
|
||||
<!-- Base Buttons -->
|
||||
<v-col cols="12" sm="12">
|
||||
<UiChildCard title="Default">
|
||||
<BaseButtons />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
<!-- Color Buttons -->
|
||||
<v-col cols="12" lg="6">
|
||||
<UiChildCard title="Colors">
|
||||
<ColorsButtons />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
<!-- Outlined Buttons -->
|
||||
<v-col cols="12" lg="6">
|
||||
<UiChildCard title="Outlined">
|
||||
<OutlinedButtons />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
<!-- Sizes -->
|
||||
<v-col cols="12" lg="12">
|
||||
<UiChildCard title="Size">
|
||||
<SizeButtons />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
<!-- Text Buttons -->
|
||||
<v-col cols="12" lg="6">
|
||||
<UiChildCard title="Text Color">
|
||||
<TextButtons />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
<!-- Icon Color Sizes -->
|
||||
<v-col cols="12" lg="6">
|
||||
<UiChildCard title="Icon Size">
|
||||
<IconColorSizes />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,50 @@
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
import UiChildCard from '@/components/shared/UiChildCard.vue';
|
||||
|
||||
import CardsProps from "@/components/ui-components/cards/CardsProps.vue";
|
||||
import CardsSlots from "@/components/ui-components/cards/CardsSlots.vue";
|
||||
import CardsContentWrap from "@/components/ui-components/cards/CardsContentWrap.vue";
|
||||
import CardsMedia from "@/components/ui-components/cards/CardsMedia.vue";
|
||||
import CardsWeather from "@/components/ui-components/cards/CardsWeather.vue";
|
||||
import CardsTwitter from "@/components/ui-components/cards/CardsTwitter.vue";
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12" sm="12" lg="6">
|
||||
<UiChildCard title="With Props">
|
||||
<CardsProps />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="12" lg="6">
|
||||
<UiChildCard title="With Slots">
|
||||
<CardsSlots />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="12" lg="6" class="d-flex align-items-stretch">
|
||||
<UiChildCard title="Content Wrap">
|
||||
<CardsContentWrap />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
|
||||
<v-col cols="12" sm="12" lg="6" class="d-flex align-items-stretch">
|
||||
<UiChildCard title="Card Media">
|
||||
<CardsMedia />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
|
||||
<v-col cols="12" sm="12" lg="6" class="d-flex align-items-stretch">
|
||||
<UiChildCard title="Weather Card">
|
||||
<CardsWeather />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
|
||||
<v-col cols="12" sm="12" lg="6">
|
||||
<UiChildCard title="Twitter Card">
|
||||
<CardsTwitter />
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<SharedUiChildCard title="Chip">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Filled Color">
|
||||
<ui-components-chip-filled-color />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Outlined">
|
||||
<ui-components-chip-outlined />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Closable">
|
||||
<ui-components-chip-closable />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Disabled">
|
||||
<ui-components-chip-disabled />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Sizes">
|
||||
<ui-components-chip-sizes />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Custom Icon">
|
||||
<ui-components-chip-custom-icon />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Custom Icon Outlined">
|
||||
<ui-components-chip-custom-icon-outlined />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Label Chip">
|
||||
<ui-components-chip-label-chip />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,69 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import DialogsModel from '@/components/ui-components/dialogs/DialogsModel.vue';
|
||||
import DialogsActivator from '@/components/ui-components/dialogs/DialogsActivator.vue';
|
||||
import DialogsForm from '@/components/ui-components/dialogs/DialogsForm.vue';
|
||||
import DialogsFullscreen from '@/components/ui-components/dialogs/DialogsFullscreen.vue';
|
||||
import DialogsNested from '@/components/ui-components/dialogs/DialogsNested.vue';
|
||||
import DialogsPersistent from '@/components/ui-components/dialogs/DialogsPersistent.vue';
|
||||
import DialogsScrollable from '@/components/ui-components/dialogs/DialogsScrollable.vue';
|
||||
import DialogsTransitions from '@/components/ui-components/dialogs/DialogsTransitions.vue';
|
||||
import DialogConfirmModal from '@/components/ui-components/dialogs/DialogConfirmModal.vue';
|
||||
</script>
|
||||
|
||||
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<SharedUiChildCard title="Dialogs">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Dialog Model">
|
||||
<DialogsModel />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Dialog Activator">
|
||||
<DialogsActivator />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Dialog Form">
|
||||
<DialogsForm />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Dialog Fullscreen">
|
||||
<DialogsFullscreen />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Dialog Nested">
|
||||
<DialogsNested />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Dialog Persistent">
|
||||
<DialogsPersistent />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Dialog Scrollable">
|
||||
<DialogsScrollable />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Dialog Transitions">
|
||||
<DialogsTransitions />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Dialog Confirm Modal">
|
||||
<DialogConfirmModal />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<SharedUiChildCard title="Expansion Panel">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Basic">
|
||||
<ui-components-expansionpanel-basic />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Advance">
|
||||
<ui-components-expansionpanel-advance />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Customized Icon">
|
||||
<ui-components-expansionpanel-customized-icon />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Default Expand">
|
||||
<ui-components-expansionpanel-default-expand />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Inset">
|
||||
<ui-components-expansionpanel-inset />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Popout">
|
||||
<ui-components-expansionpanel-popout />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<SharedUiChildCard title="List">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Simple List">
|
||||
<ui-components-list-simple-list />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Folder List">
|
||||
<ui-components-list-folder-list />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Nested List">
|
||||
<ui-components-list-nested-list />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Rounded List">
|
||||
<ui-components-list-rounded-list />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Disabled List">
|
||||
<ui-components-list-disabled-list />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Scrollable List">
|
||||
<ui-components-list-scrollable-list />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Custom Align List">
|
||||
<ui-components-list-custom-align-list />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Switch List">
|
||||
<ui-components-list-switch-list />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,37 @@
|
||||
<script setup lang="ts">
|
||||
import MenusPopover from '@/components/ui-components/menus/MenusPopover.vue';
|
||||
import MenusHover from '@/components/ui-components/menus/MenusHover.vue';
|
||||
import MenusAnchor from '@/components/ui-components/menus/MenusAnchor.vue';
|
||||
import MenusActivatorTooltip from '@/components/ui-components/menus/MenusActivatorTooltip.vue';
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<SharedUiChildCard title="Menus">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Menus Popover">
|
||||
<MenusPopover />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Menus Hover">
|
||||
<MenusHover />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Menus Anchor">
|
||||
<MenusAnchor />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Menus Activator Tooltip">
|
||||
<MenusActivatorTooltip />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<SharedUiChildCard title="Ratting">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Basic Ratting">
|
||||
<ui-components-ratting-basic-ratting />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Size Ratting">
|
||||
<ui-components-ratting-size-ratting />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Length Ratting">
|
||||
<ui-components-ratting-length-ratting />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Read Only Ratting">
|
||||
<ui-components-ratting-read-only-ratting />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Clearable Ratting">
|
||||
<ui-components-ratting-clearable-ratting />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Half Ratting">
|
||||
<ui-components-ratting-half-ratting />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Hover Ratting">
|
||||
<ui-components-ratting-hover-ratting />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Icons Ratting">
|
||||
<ui-components-ratting-icons-ratting />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Label Ratting">
|
||||
<ui-components-ratting-label-ratting />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,111 @@
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import UiChildCard from '@/components/shared/UiChildCard.vue';
|
||||
const desserts = ref([
|
||||
{
|
||||
name: "Frozen Yogurt",
|
||||
calories: 159,
|
||||
},
|
||||
{
|
||||
name: "Ice cream sandwich",
|
||||
calories: 237,
|
||||
},
|
||||
{
|
||||
name: "Eclair",
|
||||
calories: 262,
|
||||
},
|
||||
{
|
||||
name: "Cupcake",
|
||||
calories: 305,
|
||||
},
|
||||
{
|
||||
name: "Gingerbread",
|
||||
calories: 356,
|
||||
},
|
||||
{
|
||||
name: "Jelly bean",
|
||||
calories: 375,
|
||||
},
|
||||
{
|
||||
name: "Lollipop",
|
||||
calories: 392,
|
||||
},
|
||||
{
|
||||
name: "Honeycomb",
|
||||
calories: 408,
|
||||
},
|
||||
{
|
||||
name: "Donut",
|
||||
calories: 452,
|
||||
},
|
||||
{
|
||||
name: "KitKat",
|
||||
calories: 518,
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<v-row class="month-table">
|
||||
<v-col cols="12" sm="12" >
|
||||
<UiChildCard title="General Table">
|
||||
<v-table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-left">Name</th>
|
||||
<th class="text-left">Calories</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="item in desserts" :key="item.name">
|
||||
<td>{{ item.name }}</td>
|
||||
<td>{{ item.calories }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</v-table>
|
||||
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
|
||||
<v-col cols="12" sm="12">
|
||||
<UiChildCard title="Dark Table">
|
||||
<v-table theme="dark">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-left">Name</th>
|
||||
<th class="text-left">Calories</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="item in desserts" :key="item.name">
|
||||
<td>{{ item.name }}</td>
|
||||
<td>{{ item.calories }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</v-table>
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
|
||||
<v-col cols="12" sm="12">
|
||||
<UiChildCard title="Header Fixed Table">
|
||||
<v-table fixed-header height="300px">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-left">Name</th>
|
||||
<th class="text-left">Calories</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="item in desserts" :key="item.name">
|
||||
<td>{{ item.name }}</td>
|
||||
<td>{{ item.calories }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</v-table>
|
||||
</UiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
@@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<SharedUiChildCard title="Tabs">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Basic Tabs">
|
||||
<ui-components-tabs-basic-tabs />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Color Tabs">
|
||||
<ui-components-tabs-color-tabs />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Icon Tabs">
|
||||
<ui-components-tabs-icon-tabs />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Icons With Label Tabs">
|
||||
<ui-components-tabs-icons-with-label-tabs />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Center Tabs">
|
||||
<ui-components-tabs-center-tabs />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Align Center Tabs">
|
||||
<ui-components-tabs-align-center-tabs />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Align End Tabs">
|
||||
<ui-components-tabs-align-end-tabs />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Disable Tabs">
|
||||
<ui-components-tabs-disable-tabs />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Custom Icons">
|
||||
<ui-components-tabs-custom-icons />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<SharedUiChildCard title="Tooltip">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Simple Tooltip">
|
||||
<ui-components-tooltip-simple-tooltip />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Icon Tooltip">
|
||||
<ui-components-tooltip-icon-tooltip />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<SharedUiChildCard title="Toggle Tolltip">
|
||||
<ui-components-tooltip-toggle-tolltip />
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</SharedUiChildCard>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
Reference in New Issue
Block a user