Merge pull request #2574 from brkcvn/master

Rtl controlled for document and transaction show

public/css/print.css

@@ -25,10 +25,14 @@ th, td
     margin-bottom: 9px;
 }
 
-.right-column {
+html[dir='ltr'] .right-column {
     text-align: right;
 }
 
+html[dir='rtl'] .right-column {
+    text-align: left;
+}
+
 .small-text {
     font-size: 10px;
 }
@@ -64,11 +68,26 @@ th, td
     margin-top: 8px;
 }
 
-.print-template .ml-1
+html[dir='ltr'] .print-template .ml-1
 {
     margin-left: 8px;
 }
 
+html[dir='rtl'] .print-template .ml-1
+{
+    margin-right: 8px;
+}
+
+html[dir='ltr'] .print-template .ml-2
+{
+    margin-right: 16px;
+}
+
+html[dir='rtl'] .print-template .ml-2
+{
+    margin-left: 16px;
+}
+
 .pl-head
 {
     padding-left: 18px;
@@ -239,16 +258,26 @@ html[dir='rtl'] .border-radius-last {
     border-radius: 10px 0px 0px 10px;
 }
 
-.float-left
+html[dir='ltr'] .float-left
 {
     float: left !important;
 }
 
-.float-right
+html[dir='rtl'] .float-left
 {
     float: right !important;
 }
 
+html[dir='ltr'] .float-right
+{
+    float: right !important;
+}
+
+html[dir='rtl'] .float-right
+{
+    float: left !important;
+}
+
 .font-size-unset
 {
     font-size: unset;
@@ -291,11 +320,16 @@ html[dir='rtl'] .text-alignment-right {
     text-align: left !important;
 }
 
-.text-right
+html[dir='ltr'] .text-right
 {
     text-align: right;
 }
 
+html[dir='rtl'] .text-right
+{
+    text-align: left;
+}
+
 .text-center
 {
     text-align: center;

resources/views/components/form/accordion/head.blade.php

@@ -4,7 +4,7 @@
     </h2>
 
     @if (! empty($description))
-    <span class="text-sm font-light text-black">
+    <span class="text-sm font-light text-black flex gap-x-1 mt-1">
         {!! $description !!}
     </span>
     @endif

resources/views/components/form/section/head.blade.php

@@ -4,7 +4,7 @@
     </h2>
 
     @if (!empty($description))
-    <span class="text-sm font-light text-black">
+    <span class="text-sm font-light text-black flex gap-x-1 mt-1">
         {!! $description !!}
     </span>
     @endif

resources/views/components/media/file.blade.php

@@ -5,7 +5,7 @@
             @else
                 <span class="material-icons text-base">attach_file</span>
         @endif  
-        <div class="flex flex-col text-gray-500 ml-3 gap-y-1">
+        <div class="flex flex-col text-gray-500 ltr:ml-3 rtl:mr-3 gap-y-1">
             <span class="w-64 text-sm truncate">{{ $file->basename }}</span>
             <span class="text-xs mb-0">{{ $file->readableSize() }}</span>
         </div>

resources/views/components/show/accordion/head.blade.php

@@ -1,4 +1,4 @@
-<div>
+<div class="ltr:text-left rtl:text-right">
     <h2 class="lg:text-lg font-medium text-black">
         <x-button.hover group-hover>
             {{ $title }}
@@ -6,7 +6,7 @@
     </h2>
 
     @if (! empty($description))
-        <span class="text-sm font-light text-black">
+        <span class="text-sm font-light text-black flex gap-x-1 mt-1">
             {!! $description !!}
         </span>
     @endif

resources/views/components/show/accordion/index.blade.php

@@ -5,7 +5,7 @@
         <div class="relative w-full text-left cursor-pointer group" x-on:click="{{ $type }} !== 'open' ? {{ $type }} = 'open' : {{ $type }} = 'close'">
             {!! $head !!}
 
-            <x-icon filled class="absolute right-0 top-0 transition-all transform" :icon="$icon" x-bind:class="{{ $type }} === 'open' ? 'rotate-180' : ''" />
+            <x-icon filled class="absolute ltr:right-0 rtl:left-0 top-0 transition-all transform" :icon="$icon" x-bind:class="{{ $type }} === 'open' ? 'rotate-180' : ''" />
         </div>
     @endif
 

resources/views/components/transactions/show/attachment.blade.php

@@ -2,7 +2,7 @@
     <div class="border-b border-gray-200 pb-4"
         x-data="{ attachment : null }"
     >
-        <div class="relative w-full text-left cursor-pointer group"
+        <div class="relative w-full ltr:text-left rtl:text-right cursor-pointer group"
             x-on:click="attachment !== 1 ? attachment = 1 : attachment = null"
         >
             <span class="font-medium">
@@ -11,11 +11,11 @@
                 </x-button.hover>
             </span>
 
-            <div class="text-black-400 text-sm">
+            <div class="text-black-400 text-sm flex gap-x-1 mt-1">
                 {{ trans('transactions.slider.attachments') }}
             </div>
 
-            <span class="material-icons absolute right-0 top-0 transition-all transform" x-bind:class="attachment === 1 ? 'rotate-180' : ''">expand_more</span>
+            <span class="material-icons absolute ltr:right-0 rtl:left-0 top-0 transition-all transform" x-bind:class="attachment === 1 ? 'rotate-180' : ''">expand_more</span>
         </div>
 
         <div class="overflow-hidden transition-transform origin-top-left ease-linear duration-100"

resources/views/components/transactions/show/children.blade.php

@@ -1,5 +1,5 @@
 <div class="border-b pb-4" x-data="{ children : null }">
-    <button class="relative w-full text-left cursor-pointer group"
+    <button class="relative w-full ltr:text-left rtl:text-right cursor-pointer group"
         x-on:click="children !== 1 ? children = 1 : children = null"
     >
         <span class="font-medium">
@@ -8,11 +8,11 @@
             </x-button.hover>
         </span>
 
-        <div class="text-black-400 text-sm">
+        <div class="text-black-400 text-sm flex gap-x-1 mt-1">
             {!! trans('transactions.slider.children', ['count' => $transaction->children()->count()]) !!}
         </div>
 
-        <span class="material-icons absolute right-0 top-0 transition-all transform"
+        <span class="material-icons absolute ltr:right-0 rtl:left-0 top-0 transition-all transform"
             x-bind:class="children === 1 ? 'rotate-180' : ''"
         >expand_more</span>
     </button>

resources/views/components/transactions/show/create.blade.php

@@ -1,7 +1,7 @@
 @php $created_date = '<span class="font-medium">' . company_date($transaction->created_at) . '</span>' @endphp
 
 <div class="border-b pb-4" x-data="{ create : null }">
-    <button class="relative w-full text-left group"
+    <button class="relative w-full ltr:text-left rtl:text-right group"
         x-on:click="create !== 1 ? create = 1 : create = null"
     >
         <span class="font-medium">
@@ -10,7 +10,7 @@
             </x-button.hover>
         </span>
 
-        <div class="text-black-400 text-sm">
+        <div class="text-black-400 text-sm flex gap-x-1 mt-1">
             @if ($transaction->isRecurringTransaction())
                 {!! trans('transactions.slider.create_recurring', ['user' => $transaction->owner->name, 'date' => $created_date]) !!}
             @else
@@ -18,7 +18,7 @@
             @endif
         </div>
 
-        <span class="material-icons absolute right-0 top-0 transition-all transform" x-bind:class="create === 1 ? 'rotate-180' : ''">expand_more</span>
+        <span class="material-icons absolute ltr:right-0 rtl:left-0 top-0 transition-all transform" x-bind:class="create === 1 ? 'rotate-180' : ''">expand_more</span>
     </button>
 
     <div class="overflow-hidden transition-transform origin-top-left ease-linear duration-100"

resources/views/components/transactions/show/schedule.blade.php

@@ -4,7 +4,7 @@
 @endphp
 
 <div class="border-b pb-4" x-data="{ schedule : null }">
-    <button class="relative w-full text-left cursor-pointer group"
+    <button class="relative w-full ltr:text-left rtl:text-right cursor-pointer group"
         x-on:click="schedule !== 1 ? schedule = 1 : schedule = null"
     >
         <span class="font-medium">
@@ -13,11 +13,11 @@
             </x-button.hover>
         </span>
 
-        <div class="text-black-400 text-sm">
+        <div class="text-black-400 text-sm flex gap-x-1 mt-1">
             {!! trans('transactions.slider.schedule', ['frequency' => $frequency, 'interval' => $transaction->recurring->interval, 'date' => $started_date]) !!}
         </div>
 
-        <span class="material-icons absolute right-0 top-0 transition-all transform" x-bind:class="schedule === 1 ? 'rotate-180' : ''">expand_more</span>
+        <span class="material-icons absolute ltr:right-0 rtl:left-0 top-0 transition-all transform" x-bind:class="schedule === 1 ? 'rotate-180' : ''">expand_more</span>
     </button>
 
     <div class="overflow-hidden transition-transform origin-top-left ease-linear duration-100"

resources/views/components/transactions/show/transfer.blade.php

@@ -10,7 +10,7 @@
     @endif
 
     <div class="border-b pb-4" x-data="{ transfer : 1 }">
-        <button class="relative w-full text-left cursor-pointer group"
+        <button class="relative w-full ltr:text-left rtl:text-right cursor-pointer group"
             x-on:click="transfer !== 1 ? transfer = 1 : transfer = null"
         >
             <span class="font-medium border-b border-transparent transition-all group-hover:border-black">
@@ -18,12 +18,12 @@
             </span>
 
             @if ($transfer)
-                <div class="text-black-400 text-sm">
+                <div class="text-black-400 text-sm flex gap-x-1 mt-1">
                     {!! trans('transactions.slider.transfer_headline', ['from_account' => $from_account, 'to_account' => $to_account]) !!}
                 </div>
             @endif
 
-            <span class="material-icons absolute right-0 top-0 transition-all transform"
+            <span class="material-icons absolute ltr:right-0 rtl:left-0 top-0 transition-all transform"
                 x-bind:class="transfer === 1 ? 'rotate-180' : ''"
             >expand_more</span>
         </button>
@@ -38,7 +38,7 @@
                 </div>
             @else
                 <div class="mt-2">
-                    <div class="alert alert-notify p-4 text-black font-bold rounded-lg bg-orange-100 text-orange-600">
+                    <div class="alert alert-notify p-4 font-bold rounded-lg bg-orange-100 text-orange-600">
                         <span class="alert-text">
                             <span>{{ trans('messages.warning.missing_transfer') }}</span>
                         </span>

resources/views/components/transactions/template/default.blade.php

@@ -368,11 +368,8 @@
                 <td valign="center" style="width:80%; display:block; float:right; background-color: #55588B; -webkit-print-color-adjust: exact; color:#ffffff; border-radius: 5px;">
                     <table>
                         <tr>
-                            <td valign="center" style="width: 80%; padding:0; font-size: 14px; font-weight:600; color:#ffffff;">
+                            <td valign="center" style="font-size: 14px; color: #ffffff; padding: 0;">
-                                {{ trans($textAmount) }}
+                                <span class="ml-2" style="font-weight: 600;">{{ trans($textAmount) }}</span>
-                            </td>
-
-                            <td valign="center" style="width: 20%; padding:0; font-size: 14px; color:#ffffff;">
                                 @money($transaction->amount, $transaction->currency_code, true)
                             </td>
                         </tr>