Merge pull request #43 from selemondev/demo

chore: add demo
selemondev · Jul 8, 2023 · e81c039 · e81c039
2 parents 17aa107 + 44092ef
commit e81c039
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/README.md b/README.md
@@ -60,7 +60,7 @@ const clickTab = (name: string) => {
     <div>
       <main class="mt-6 space-y-10">
         <section>
-          <TabGroupOutline>
+          <TabGroupOutline TabOutlineCenter>
             <TabsWrapperOutline TabOutlineStart>
               <TabOutline title="Vue" :isActive="activeTab === 'vue'" @onClick="clickTab('vue')">
                 <template #icon>
@@ -135,7 +135,7 @@ const clickTab = (name: string) => {
 
         <section>
           <TabFloatGroup>
-            <TabsFloatWrapper>
+            <TabsFloatWrapper TabFloatCenter>
               <TabFloat floatTitle="Vue" :floatIsActive="activeTab === 'vue'" @onClick="clickTab('vue')">
                 <template #icon>
                   <Icon icon="logos:vue" :class="{ 'text-green-500': activeTab === 'vue' }"
@@ -290,7 +290,7 @@ const clickTab = (name: string) => {
         <ClientOnly>
           <section>
             <TabGroupOutline>
-              <TabsWrapperOutline>
+              <TabsWrapperOutline TabOutlineCenter>
                 <TabOutline activeTitleColor="text-green-500" barColor="border-green-500" title="Vue"
                   :isActive="activeTab === 'vue'" @onClick="clickTab('vue')">
                   <template #icon>
@@ -377,7 +377,7 @@ const clickTab = (name: string) => {
 
           <section>
             <TabFloatGroup>
-              <TabsFloatWrapper>
+              <TabsFloatWrapper TabFloatCenter>
                 <TabFloat floatActiveTitleColor="text-green-500" floatTitle="Vue" :floatIsActive="activeTab === 'vue'"
                   @onClick="clickTab('vue')">
                   <template #icon>

diff --git a/src/App.vue b/src/App.vue
@@ -14,7 +14,7 @@ const clickTab = (name: string) => {
       <main class="mt-6 space-y-10">
         <section>
           <TabGroupOutline>
-            <TabsWrapperOutline TabOutlineStart>
+            <TabsWrapperOutline TabOutlineCenter>
               <TabOutline title="Vue" :isActive="activeTab === 'vue'" @onClick="clickTab('vue')">
                 <template #icon>
                   <Icon icon="logos:vue" :class="{ 'text-green-500': activeTab === 'vue' }"
@@ -88,7 +88,7 @@ const clickTab = (name: string) => {
 
         <section>
           <TabFloatGroup>
-            <TabsFloatWrapper>
+            <TabsFloatWrapper TabFloatCenter>
               <TabFloat floatTitle="Vue" :floatIsActive="activeTab === 'vue'" @onClick="clickTab('vue')">
                 <template #icon>
                   <Icon icon="logos:vue" :class="{ 'text-green-500': activeTab === 'vue' }"