Finish style section

epicmaxco · Jun 1, 2023 · 2e9e6eb · 2e9e6eb
1 parent 80d39f9
commit 2e9e6eb
Show file tree

Hide file tree

Showing 11 changed files with 12 additions and 13 deletions.
diff --git a/packages/docs/page-config/styles/colors/components/Components.vue b/packages/docs/page-config/styles/colors/components/Components.vue
@@ -40,7 +40,7 @@
 
     <va-card class="card card-2">
       <va-card-content>
-        <table style="width: 100%;">
+        <table class="w-full">
           <tr>
             <td>Amount</td>
             <td>

diff --git a/packages/docs/page-config/styles/colors/components/components/PaletteGridCard.vue b/packages/docs/page-config/styles/colors/components/components/PaletteGridCard.vue
@@ -7,7 +7,7 @@
       <p>
         {{ name }}
       </p>
-      <p style="font-size: 14px;">
+      <p class="text-sm">
         var(--va-{{ kebabCase(name) }})<span class="ml-2">{{ value }}</span>
       </p>
     </div>

diff --git a/packages/docs/page-config/styles/css-variables/examples/profile.vue b/packages/docs/page-config/styles/css-variables/examples/profile.vue
@@ -28,7 +28,7 @@
           <va-button
             preset="secondary"
             color="#fff"
-            style="margin-left: -0.5rem;"
+            class="-ml-[0.5rem]"
           >
             Follow
           </va-button>

diff --git a/packages/docs/page-config/styles/grid/examples/AlignContent.vue b/packages/docs/page-config/styles/grid/examples/AlignContent.vue
@@ -1,7 +1,7 @@
 <template>
   <va-card
     color="background-element"
-    style="padding: 0.75rem;"
+    class="p-3"
   >
     <!-- align-content-start -->
     <div class="row align-content-start">

diff --git a/packages/docs/page-config/styles/grid/examples/AlignDefault.vue b/packages/docs/page-config/styles/grid/examples/AlignDefault.vue
@@ -1,7 +1,7 @@
 <template>
   <va-card
     color="background-element"
-    style="padding: 0.75rem;"
+    class="p-3"
   >
     <!-- align--start -->
     <div class="row align-start">

diff --git a/packages/docs/page-config/styles/grid/examples/AlignJustify.vue b/packages/docs/page-config/styles/grid/examples/AlignJustify.vue
@@ -1,7 +1,7 @@
 <template>
   <va-card
     color="background-element"
-    style="padding: 0.75rem;"
+    class="p-3"
   >
     <!-- justify--start -->
     <div class="row justify-start">

diff --git a/packages/docs/page-config/styles/grid/examples/AlignSelf.vue b/packages/docs/page-config/styles/grid/examples/AlignSelf.vue
@@ -1,7 +1,7 @@
 <template>
   <va-card
     color="background-element"
-    style="padding: 0.75rem;"
+    class="p-3"
   >
     <div class="row">
       <!-- align-self-start -->

diff --git a/packages/docs/page-config/styles/grid/examples/Breakpoints.vue b/packages/docs/page-config/styles/grid/examples/Breakpoints.vue
@@ -1,7 +1,7 @@
 <template>
   <va-card
     color="background-element"
-    style="padding: 0.75rem;"
+    class="p-3"
   >
     <div class="row">
       <div class="flex flex-col md12">

diff --git a/packages/docs/page-config/styles/grid/examples/Default.vue b/packages/docs/page-config/styles/grid/examples/Default.vue
@@ -1,12 +1,11 @@
 <template>
   <va-card
     color="background-element"
-    style="padding: 0.75rem;"
+    class="p"
   >
     <div class="row">
       <div
-        class="flex flex-col"
-        style="width: 100%;"
+        class="flex flex-col w-full"
       >
         <div class="item">
           {{ $t("grid.examples.default.example") }}

diff --git a/packages/docs/page-config/styles/grid/examples/Gutters.vue b/packages/docs/page-config/styles/grid/examples/Gutters.vue
@@ -1,7 +1,7 @@
 <template>
   <va-card
     color="background-element"
-    style="padding: 0.75rem;"
+    class="p-3"
   >
     <div class="layout gutter--md">
       <div class="row">

diff --git a/packages/docs/page-config/styles/grid/examples/Offsets.vue b/packages/docs/page-config/styles/grid/examples/Offsets.vue
@@ -1,7 +1,7 @@
 <template>
   <va-card
     color="background-element"
-    style="padding: 0.75rem;"
+    class="p-3"
   >
     <div class="row">
       <div class="flex flex-col xs1 offset-md3 offset-lg2">