chore: improve RTL support (#334)

Co-authored-by: Hassan Kadhim <hassan57905@gmail.com>

src/runtime/components/data/Table.vue

@@ -3,7 +3,7 @@
     <table :class="[ui.base, ui.divide]">
       <thead :class="ui.thead">
         <tr :class="ui.tr.base">
-          <th v-if="modelValue" scope="col" class="pl-4">
+          <th v-if="modelValue" scope="col" class="ps-4">
             <UCheckbox :checked="indeterminate || selected.length === rows.length" :indeterminate="indeterminate" @change="selected = $event.target.checked ? rows : []" />
           </th>
 
@@ -23,7 +23,7 @@
       </thead>
       <tbody :class="ui.tbody">
         <tr v-for="(row, index) in rows" :key="index" :class="[ui.tr.base, isSelected(row) && ui.tr.selected]">
-          <td v-if="modelValue" class="pl-4">
+          <td v-if="modelValue" class="ps-4">
             <UCheckbox v-model="selected" :value="row" />
           </td>
 

src/runtime/components/forms/Checkbox.vue

@@ -16,7 +16,7 @@
         v-bind="$attrs"
       >
     </div>
-    <div v-if="label || $slots.label" class="ml-3 text-sm">
+    <div v-if="label || $slots.label" class="ms-3 text-sm">
       <label :for="name" :class="ui.label">
         <slot name="label">{{ label }}</slot>
         <span v-if="required" :class="ui.required">*</span>

src/runtime/components/forms/Radio.vue

@@ -14,7 +14,7 @@
         v-bind="$attrs"
       >
     </div>
-    <div v-if="label || $slots.label" class="ml-3 text-sm">
+    <div v-if="label || $slots.label" class="ms-3 text-sm">
       <label :for="`${name}-${value}`" :class="ui.label">
         <slot name="label">{{ label }}</slot>
         <span v-if="required" :class="ui.required">*</span>