code refactoring

public/css/app.css

@@ -57807,6 +57807,10 @@ body{
 
 @media (min-width: 1280px){
 
+  .xl\:absolute{
+    position: absolute;
+  }
+
   .xl\:top-28{
     top: 7rem;
   }
@@ -57882,6 +57886,10 @@ body{
     left: 0px;
   }
 
+  [dir="ltr"] .xl\:ltr\:right-0{
+    right: 0px;
+  }
+
   [dir="ltr"] .xl\:ltr\:ml-64{
     margin-left: 16rem;
   }
@@ -57894,6 +57902,10 @@ body{
     right: 0px;
   }
 
+  [dir="rtl"] .xl\:rtl\:left-0{
+    left: 0px;
+  }
+
   [dir="rtl"] .xl\:rtl\:mr-64{
     margin-right: 16rem;
   }

resources/assets/js/components/AkauntingSwitch.vue

@@ -1,6 +1,6 @@
 <template>
-    <div class="lg:absolute w-12 lg:ltr:right-0 lg:rtl:left-0 xl:-top-12">
-        <label class="lg:hidden">{{ label }}</label>
+    <div class="xl:absolute w-12 xl:ltr:right-0 xl:rtl:left-0 xl:-top-12">
+        <label class="text-black text-sm font-medium mb-1 xl:hidden">{{ label }}</label>
 
         <div class="relative full flex items-center cursor-pointer">
             <input type="radio" :name="name" v-show="selected == '0'" @click="enabled = 1" value="1" id="enabled-1" v-model="selected" class="w-full h-full absolute right-0 z-20 opacity-0 cursor-pointer">

resources/views/modules/item/show.blade.php

@@ -121,7 +121,11 @@
             </div>
 
             <div class="tabs w-full">
-                <x-tabs class="flex items-center overflow-x-scroll lg:overflow-visible" active="{{ ! empty($module->call_to_actions) ? 'features' : 'description' }}">
+                <x-tabs
+                    class="w-full lg:w-auto"
+                    active="{{ ! empty($module->call_to_actions) ? 'features' : 'description' }}"
+                    data-disable-slider
+                >
                     <x-slot name="navs">
                         @stack('features_nav_start')