module button styling

resources/views/components/layouts/modules/show/buttons.blade.php

@@ -1,6 +1,6 @@
 @props(['module', 'installed', 'enable'])
 
-<div x-show="price_type == 'monthly'" class="w-full">
+<div x-show="price_type == 'monthly'" class="w-full flex space-x-6">
     <x-tooltip message="{{ trans('modules.hosted_on_akaunting') }}" placement="top" width="w-full">
         <x-link
             href="{{ $module->action_url }}"
@@ -13,7 +13,7 @@
     </x-tooltip>
 </div>
 
-<div x-show="price_type == 'yearly'" class="w-full">
+<div x-show="price_type == 'yearly'" class="w-full flex space-x-6">
     @if (in_array('onprime', $module->where_to_use) || $module->isPurchase)
         @if ($installed)
             @can('delete-modules-item')
@@ -98,7 +98,7 @@
     @endif
 </div>
 
-<div x-show="price_type == 'lifetime'" class="w-full">
+<div x-show="price_type == 'lifetime'" class="w-full flex space-x-6">
     @if (empty($module->plan))
         @if ($installed)
             @can('delete-modules-item')

resources/views/components/layouts/modules/show/price.blade.php

@@ -1,7 +1,7 @@
 @props(['module'])
 
 @if ($module->price != '0.0000')
-    <div class="flex gap-2 items-baseline cursor-default">
+    <div class="flex flex-col 2xl:flex-row gap-2 items-baseline cursor-default">
         {!! $module->price_prefix !!}
 
         <div x-show="price_type == 'monthly'">

resources/views/components/layouts/modules/show/toggle.blade.php

@@ -1,7 +1,7 @@
 <x-form>
-    <div class="lg:absolute lg:ltr:right-0 lg:rtl:left-0 top-4">
+    <div>
         <div class="relative" x-model="price_type">
-            <div class="w-58 flex items-center bg-gray-200 p-1 ltr:mr-2 rtl:ml-2 rounded-lg">
+            <div class="w-58 flex items-center bg-gray-200 p-1 rounded-lg">
                 <button type="button"
                     x-on:click="price_type = 'monthly'"
                     class="w-18 flex justify-center px-2"