feat: refactor playground component shapes

shuriken-ui · Dec 21, 2023 · 8ee1d7f · 8ee1d7f
1 parent b698244
commit 8ee1d7f
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 10 deletions.
diff --git a/.playground/pages/tests/authority/prose.vue b/.playground/pages/tests/authority/prose.vue
@@ -10,7 +10,7 @@ definePageMeta({
 <template>
   <div>
     <div class="max-w-3xl mx-auto py-20">
-      <BaseProse shape="rounded" class="prose-md">
+      <BaseProse rounded="sm" class="prose-md">
         <h1>Typography plugin</h1>
         <p class="lead">
           Until now, trying to style an article, document, or blog post with

diff --git a/.playground/pages/tests/base/placeholder.vue b/.playground/pages/tests/base/placeholder.vue
@@ -23,7 +23,7 @@ definePageMeta({
           </template>
 
           <div class="mt-2 flex justify-center gap-2">
-            <BaseButton color="primary" shape="curved" class="h-11 w-40">
+            <BaseButton color="primary" rounded="md" class="h-11 w-40">
               Take some action
             </BaseButton>
           </div>

diff --git a/.playground/pages/tests/base/placeload.vue b/.playground/pages/tests/base/placeload.vue
@@ -30,7 +30,7 @@ definePageMeta({
         description="Placeload component composition"
       >
         <div class="max-w-sm">
-          <BaseCard shape="rounded" class="p-4 md:p-6">
+          <BaseCard rounded="md" class="p-4 md:p-6">
             <div class="flex items-center">
               <BasePlaceload class="h-10 w-10 rounded-full" />
               <div class="ms-3 grow space-y-2">

diff --git a/.playground/pages/tests/form/checkbox.vue b/.playground/pages/tests/form/checkbox.vue
@@ -440,7 +440,7 @@ function reset() {
               <div class="grid gap-6 sm:grid-cols-3">
                 <BaseCheckboxHeadless v-model="value" value="team_member_1">
                   <BaseCard
-                    shape="rounded"
+                    rounded="md"
                     class="peer-checked:!border-primary-500 peer-checked:[&_.child]:!text-primary-500 border-2 p-4 opacity-50 peer-checked:opacity-100"
                   >
                     <div class="flex w-full items-center gap-2">
@@ -472,7 +472,7 @@ function reset() {
 
                 <BaseCheckboxHeadless v-model="value" value="team_member_2">
                   <BaseCard
-                    shape="rounded"
+                    rounded="md"
                     class="peer-checked:!border-primary-500 peer-checked:[&_.child]:!text-primary-500 border-2 p-4 opacity-50 peer-checked:opacity-100"
                   >
                     <div class="flex w-full items-center gap-2">
@@ -504,7 +504,7 @@ function reset() {
 
                 <BaseCheckboxHeadless v-model="value" value="team_member_3">
                   <BaseCard
-                    shape="rounded"
+                    rounded="md"
                     class="peer-checked:!border-primary-500 peer-checked:[&_.child]:!text-primary-500 border-2 p-4 opacity-50 peer-checked:opacity-100"
                   >
                     <div class="flex w-full items-center gap-2">

diff --git a/.playground/pages/tests/form/radio.vue b/.playground/pages/tests/form/radio.vue
@@ -183,7 +183,7 @@ const headlessValue = ref('value_1')
                   value="value_1"
                 >
                   <BaseCard
-                    shape="curved"
+                    rounded="lg"
                     class="peer-checked:!border-success-500 peer-checked:!bg-success-500/10 relative border-2 p-5 peer-checked:[&_.child]:!opacity-100"
                   >
                     <div class="flex flex-col">
@@ -225,7 +225,7 @@ const headlessValue = ref('value_1')
                   value="value_2"
                 >
                   <BaseCard
-                    shape="curved"
+                    rounded="lg"
                     class="peer-checked:!border-success-500 peer-checked:!bg-success-500/10 relative border-2 p-5 peer-checked:[&_.child]:!opacity-100"
                   >
                     <div class="flex flex-col">
@@ -267,7 +267,7 @@ const headlessValue = ref('value_1')
                   value="value_3"
                 >
                   <BaseCard
-                    shape="curved"
+                    rounded="lg"
                     class="peer-checked:!border-success-500 peer-checked:!bg-success-500/10 relative border-2 p-5 peer-checked:[&_.child]:!opacity-100"
                   >
                     <div class="flex flex-col">
@@ -309,7 +309,7 @@ const headlessValue = ref('value_1')
                   value="value_4"
                 >
                   <BaseCard
-                    shape="curved"
+                    rounded="lg"
                     class="peer-checked:!border-success-500 peer-checked:!bg-success-500/10 relative border-2 p-5 peer-checked:[&_.child]:!opacity-100"
                   >
                     <div class="flex flex-col">