Merge branch 'master' of https://github.com/brkcvn/akaunting
This commit is contained in:
commit
925029e0c6
@ -282,7 +282,7 @@ class DeleteLink extends Component
|
||||
|
||||
protected function getClass($class)
|
||||
{
|
||||
$default_class = 'w-full flex items-center text-purple px-2 h-9 leading-9 whitespace-nowrap';
|
||||
$default_class = 'w-full flex items-center text-red sm:text-purple px-2 h-9 leading-9 whitespace-nowrap';
|
||||
|
||||
$explode = explode(',', $this->override);
|
||||
|
||||
|
67
public/akaunting-js/generalAction.js
vendored
67
public/akaunting-js/generalAction.js
vendored
@ -11,7 +11,7 @@ document.querySelectorAll("[data-table-list]").forEach((row) => {
|
||||
|
||||
//redirect edit or show page for table row click
|
||||
document.querySelectorAll("[data-table-body]").forEach((table) => {
|
||||
if (document.body.clientWidth >= 991) {
|
||||
if (document.body.clientWidth < 768 || document.body.clientWidth > 1200) {
|
||||
let rows = table.querySelectorAll("tr");
|
||||
|
||||
rows.forEach((row) => {
|
||||
@ -27,7 +27,13 @@ document.querySelectorAll("[data-table-body]").forEach((table) => {
|
||||
if (row_href) {
|
||||
for (let i = first_selector; i < td.length - 1; i++) {
|
||||
let td_item = td[i];
|
||||
td_item.addEventListener("click", () => {
|
||||
|
||||
td_item.addEventListener("click", (event) => {
|
||||
// click disabled when preview dialog is open
|
||||
if (event.target.closest('[data-tooltip-target]')) {
|
||||
return;
|
||||
}
|
||||
// click disabled when preview dialog is open
|
||||
window.location.href = row_href;
|
||||
});
|
||||
|
||||
@ -42,6 +48,20 @@ document.querySelectorAll("[data-table-body]").forEach((table) => {
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (document.body.clientWidth <= 768) {
|
||||
table.querySelectorAll('[data-table-list]').forEach((actions) => {
|
||||
actions.querySelector('[data-mobile-actions]').addEventListener('click', function() {
|
||||
this.closest('td').querySelector('[data-mobile-actions-modal]').classList.add('show');
|
||||
this.closest('td').querySelector('[data-mobile-actions-modal]').classList.remove('opacity-0', 'invisible');
|
||||
|
||||
this.closest('td').querySelector('[data-mobile-actions-modal]').addEventListener('click', function() {
|
||||
this.classList.add('opacity-0', 'invisible');
|
||||
this.classList.remove('show');
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
//redirect edit or show page for table row click
|
||||
|
||||
@ -441,3 +461,46 @@ document.querySelectorAll('[data-index-icon]').forEach((defaultText) => {
|
||||
//disable/enable icons ejected from data-truncate-marquee
|
||||
|
||||
//margue animation for truncated text
|
||||
|
||||
// set with for page header
|
||||
document.querySelectorAll('[data-page-title-first]').forEach((first) => {
|
||||
document.querySelectorAll('[data-page-title-second]').forEach((second) => {
|
||||
let title_truncate = first.querySelector('[data-title-truncate]');
|
||||
|
||||
if (title_truncate !== null) {
|
||||
if (first.clientWidth < title_truncate.clientWidth && second.clientHeight > 0) {
|
||||
// added specific width styling for truncate text
|
||||
title_truncate.style.width = first.clientWidth + 'px';
|
||||
let subtract = title_truncate.clientWidth - 40;
|
||||
title_truncate.style.width = subtract + 'px';
|
||||
title_truncate.classList.add('truncate');
|
||||
// added specific width styling for truncate text
|
||||
|
||||
// added specific width styling into the parent title element for truncate text
|
||||
first.classList.add('w-full', 'sm:w-6/12');
|
||||
// added specific width styling into the parent title element for truncate text
|
||||
|
||||
title_truncate.parentNode.classList.add('overflow-x-hidden', 'hide-scroll-bar');
|
||||
|
||||
// added truncate animation for truncated text
|
||||
title_truncate.addEventListener('mouseover', function () {
|
||||
this.classList.add('animate-marquee');
|
||||
this.classList.remove('truncate');
|
||||
this.style.animationPlayState = 'running';
|
||||
});
|
||||
|
||||
title_truncate.addEventListener('mouseout', function () {
|
||||
this.style.animationPlayState = 'paused';
|
||||
this.classList.remove('animate-marquee');
|
||||
this.classList.add('truncate');
|
||||
});
|
||||
// added truncate animation for truncated text
|
||||
}
|
||||
}
|
||||
|
||||
// remove width class name for extend the right side
|
||||
first.classList.remove('w-full', 'sm:w-6/12');
|
||||
// remove width class name for extend the right side
|
||||
});
|
||||
});
|
||||
// set with for page header
|
||||
|
39
public/css/app.css
vendored
39
public/css/app.css
vendored
@ -53411,6 +53411,9 @@ button, input, optgroup, select, textarea{
|
||||
border-bottom-left-radius: 0.5rem;
|
||||
border-right-width: 0px;
|
||||
}
|
||||
.suggestion-buttons > a:first-child, .suggestion-buttons > button:first-child{
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
[data-dropdown-actions] {
|
||||
-webkit-transform: unset !important;
|
||||
transform: unset !important;
|
||||
@ -54088,6 +54091,17 @@ html[dir="rtl"] .lines-radius-border thead td:last-child {
|
||||
}
|
||||
/* plans page accordion */
|
||||
|
||||
/* hidden scroll-bar */
|
||||
.hide-scroll-bar::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hide-scroll-bar {
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
}
|
||||
/* hidden scroll-bar */
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
.small-table-width {
|
||||
width: 550px;
|
||||
@ -54501,16 +54515,16 @@ body{
|
||||
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.hover\:bg-gray-100:hover{
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.hover\:bg-lilac-100:hover{
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(245 247 250 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.hover\:bg-gray-100:hover{
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.hover\:bg-gray-200:hover{
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
|
||||
@ -57027,6 +57041,12 @@ body{
|
||||
gap: 0px;
|
||||
}
|
||||
|
||||
.sm\:space-x-4 > :not([hidden]) ~ :not([hidden]){
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(1rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.sm\:space-y-2 > :not([hidden]) ~ :not([hidden]){
|
||||
--tw-space-y-reverse: 0;
|
||||
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
|
||||
@ -57045,6 +57065,10 @@ body{
|
||||
border-left-width: calc(2px * calc(1 - var(--tw-divide-x-reverse)));
|
||||
}
|
||||
|
||||
.sm\:p-7{
|
||||
padding: 1.75rem;
|
||||
}
|
||||
|
||||
.sm\:px-0{
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
@ -57060,6 +57084,11 @@ body{
|
||||
line-height: 2.75rem;
|
||||
}
|
||||
|
||||
.sm\:text-purple{
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(85 88 139 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
[dir="ltr"] .sm\:ltr\:right-4{
|
||||
right: 1rem;
|
||||
}
|
||||
|
52
public/css/print.css
vendored
52
public/css/print.css
vendored
@ -767,69 +767,63 @@ html[dir='rtl'] .print-heading {
|
||||
.classic-invoice {
|
||||
margin-top: 10px;
|
||||
}
|
||||
/*--Print --*/
|
||||
|
||||
.col-60
|
||||
{
|
||||
.col-60 {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
width: 60%;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.col-50
|
||||
{
|
||||
.col-50 {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
width: 50%;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.col-40
|
||||
{
|
||||
.col-40 {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
width: 40%;
|
||||
vertical-align: top;
|
||||
}
|
||||
.col-58
|
||||
{
|
||||
|
||||
.col-58{
|
||||
display: inline-block;
|
||||
width: 58%;
|
||||
vertical-align: top;
|
||||
}
|
||||
.col-42
|
||||
{
|
||||
|
||||
.col-42 {
|
||||
display: inline-block;
|
||||
width: 42%;
|
||||
vertical-align: top;
|
||||
}
|
||||
.col-16
|
||||
{
|
||||
|
||||
.col-16 {
|
||||
display: inline-block;
|
||||
max-width: 16%;
|
||||
vertical-align: top;
|
||||
}
|
||||
/*--Print --*/
|
||||
|
||||
@media (min-width: 991px) {
|
||||
.col-60
|
||||
{
|
||||
display: inline-block;
|
||||
width: 60%;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.col-50
|
||||
{
|
||||
@media (max-width: 480px) {
|
||||
.col-60 {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.col-40
|
||||
{
|
||||
.col-40 {
|
||||
display: inline-block;
|
||||
width: 40%;
|
||||
width: 50%;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.mt-classic {
|
||||
margin-top: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 991px) {
|
||||
.classic-invoice {
|
||||
margin-top: unset;
|
||||
}
|
||||
|
16
resources/assets/sass/app.css
vendored
16
resources/assets/sass/app.css
vendored
@ -21,6 +21,11 @@
|
||||
.index-actions {
|
||||
@apply ltr:[&:nth-child(2)]:border-l ltr:[&:nth-child(3)]:border-l-0 rtl:[&:nth-child(2)]:border-r rtl:[&:nth-child(3)]:border-r-0 ltr:[&:first-child]:rounded-tl-lg ltr:[&:first-child]:rounded-bl-lg ltr:[&:first-child]:border-r-0 rtl:[&:first-child]:rounded-tr-lg rtl:[&:first-child]:rounded-br-lg rtl:[&:first-child]:border-l-0 ltr:[&:last-child]:rounded-tr-lg ltr:[&:last-child]:rounded-br-lg ltr:[&:last-child]:border-l-0 rtl:[&:last-child]:rounded-tl-lg rtl:[&:last-child]:rounded-bl-lg rtl:[&:last-child]:border-r-0;
|
||||
}
|
||||
|
||||
.suggestion-buttons > a:first-child, .suggestion-buttons > button:first-child {
|
||||
@apply mt-2;
|
||||
}
|
||||
|
||||
[data-dropdown-actions] {
|
||||
transform: unset !important;
|
||||
}
|
||||
@ -600,6 +605,17 @@ html[dir="rtl"] .lines-radius-border thead td:last-child {
|
||||
}
|
||||
/* plans page accordion */
|
||||
|
||||
/* hidden scroll-bar */
|
||||
.hide-scroll-bar::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hide-scroll-bar {
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
}
|
||||
/* hidden scroll-bar */
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
.small-table-width {
|
||||
width: 550px;
|
||||
|
@ -1,10 +1,26 @@
|
||||
<x-button
|
||||
@mobile
|
||||
<button
|
||||
type="button"
|
||||
class="rw-full flex items-center text-red sm:text-purple px-2 h-9 leading-9"
|
||||
@click="onDeleteViaConfirmation('delete-{{ $modelTable }}-{{ $id }}')"
|
||||
override="class"
|
||||
{{ $attributes }}
|
||||
>
|
||||
|
||||
@if ($slot->isNotEmpty())
|
||||
{!! $slot !!}
|
||||
@else
|
||||
<span class="w-full h-full flex items-center rounded-md px-2 text-sm hover:bg-lilac-100">{!! $label !!}</span>
|
||||
@endif
|
||||
@else
|
||||
<button
|
||||
type="button"
|
||||
class="relative bg-white hover:bg-gray-100 border py-0.5 px-1 cursor-pointer group/tooltip index-actions"
|
||||
@click="onDeleteViaConfirmation('delete-{{ $modelTable }}-{{ $id }}')"
|
||||
override="class"
|
||||
{{ $attributes }}
|
||||
>
|
||||
|
||||
@if ($slot->isNotEmpty())
|
||||
{!! $slot !!}
|
||||
@else
|
||||
@ -14,6 +30,7 @@
|
||||
<div class="absolute w-2 h-2 -bottom-1 before:content-[' '] before:absolute before:w-2 before:h-2 before:bg-white before:border-gray-200 before:transform before:rotate-45 before:border before:border-t-0 before:border-l-0" data-popper-arrow></div>
|
||||
</div>
|
||||
@endif
|
||||
@endmobile
|
||||
|
||||
<x-form.input.hidden
|
||||
name="delete-{{ $modelTable }}-{{ $id }}"
|
||||
@ -25,4 +42,4 @@
|
||||
data-cancel="{!! $cancelText !!}"
|
||||
data-delete="{!! $deleteText !!}"
|
||||
/>
|
||||
</x-button>
|
||||
</button>
|
||||
|
@ -1,4 +1,4 @@
|
||||
<div class="p-7 shadow-2xl rounded-2xl">
|
||||
<div class="p-3 sm:p-7 shadow-2xl rounded-2xl">
|
||||
@switch($documentTemplate)
|
||||
@case('classic')
|
||||
<x-documents.template.classic
|
||||
|
@ -81,8 +81,8 @@
|
||||
|
||||
<div class="row mt-2">
|
||||
<div class="col-33">
|
||||
<div class="invoice-classic-line mb-1 mt-4" style="background-color:{{ $backgroundColor }};"></div>
|
||||
<div class="invoice-classic-line" style="background-color:{{ $backgroundColor }};"></div>
|
||||
<div class="invoice-classic-line mb-1 mt-4" style="background-color:{{ $backgroundColor }}; -webkit-print-color-adjust: exact;"></div>
|
||||
<div class="invoice-classic-line" style="background-color:{{ $backgroundColor }}; -webkit-print-color-adjust: exact;"></div>
|
||||
</div>
|
||||
|
||||
<div class="col-33">
|
||||
@ -106,8 +106,8 @@
|
||||
</div>
|
||||
|
||||
<div class="col-33">
|
||||
<div class="invoice-classic-line mb-1 mt-4" style="background-color:{{ $backgroundColor }};"></div>
|
||||
<div class="invoice-classic-line" style="background-color:{{ $backgroundColor }};"></div>
|
||||
<div class="invoice-classic-line mb-1 mt-4" style="background-color:{{ $backgroundColor }}; -webkit-print-color-adjust: exact;"></div>
|
||||
<div class="invoice-classic-line" style="background-color:{{ $backgroundColor }}; -webkit-print-color-adjust: exact;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -1,10 +1,10 @@
|
||||
@stack('header_start')
|
||||
|
||||
<div id="header" class="xl:pt-6">
|
||||
<div class="flex flex-col sm:flex-row flex-wrap items-start justify-between hide-empty-page">
|
||||
<div class="w-full sm:w-6/12 items-center mb-3 sm:mb-0">
|
||||
<div id="header" class="xl:pt-6 -mt-2">
|
||||
<div class="flex flex-col sm:flex-row items-start justify-between sm:space-x-4 hide-empty-page">
|
||||
<div data-page-title-first class="w-full sm:w-6/12 items-center mb-3 sm:mb-0">
|
||||
<div class="flex items-center">
|
||||
<h1 class="flex items-center text-2xl xl:text-5xl text-black font-light -ml-0.5">
|
||||
<h1 class="flex items-center text-2xl xl:text-5xl text-black font-light -ml-0.5 mt-2 whitespace-nowrap">
|
||||
<x-title>
|
||||
{!! $title !!}
|
||||
</x-title>
|
||||
@ -24,8 +24,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full sm:w-6/12">
|
||||
<div class="flex flex-wrap flex-col sm:flex-row sm:items-center justify-end sm:space-x-2 sm:rtl:space-x-reverse">
|
||||
<div data-page-title-second class="w-full flex flex-wrap flex-col sm:flex-row sm:items-center justify-end sm:space-x-2 sm:rtl:space-x-reverse space-y-2 suggestion-buttons">
|
||||
@stack('header_button_start')
|
||||
|
||||
{!! $buttons !!}
|
||||
@ -39,7 +38,6 @@
|
||||
{!! $moreButtons !!}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@stack('header_end')
|
||||
|
@ -1,11 +1,13 @@
|
||||
@stack('header_start')
|
||||
|
||||
<div id="header" class="xl:pt-6">
|
||||
<div class="flex flex-col sm:flex-row flex-wrap items-start justify-between hide-empty-page">
|
||||
<div class="w-full sm:w-6/12 items-center mb-3 sm:mb-0">
|
||||
<div id="header" class="xl:pt-6 -mt-2">
|
||||
<div class="flex flex-col sm:flex-row items-start justify-between space-x-4 hide-empty-page">
|
||||
<div data-page-title-first class="w-full sm:w-6/12 items-center mb-3 sm:mb-0">
|
||||
<div class="flex items-center">
|
||||
<h1 class="flex items-center text-2xl xl:text-5xl text-black font-light -ml-0.5">
|
||||
<h1 class="flex items-center text-2xl xl:text-5xl text-black font-light -ml-0.5 mt-2 whitespace-nowrap">
|
||||
<x-title>
|
||||
{!! $title !!}
|
||||
</x-title>
|
||||
|
||||
@yield('dashboard_action')
|
||||
</h1>
|
||||
@ -22,8 +24,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full sm:w-6/12">
|
||||
<div class="flex flex-wrap flex-col sm:flex-row sm:items-center justify-end sm:space-x-2 sm:rtl:space-x-reverse">
|
||||
<div data-page-title-second class="w-full flex flex-wrap flex-col sm:flex-row sm:items-center justify-end sm:space-x-2 sm:rtl:space-x-reverse space-y-2 suggestion-buttons">
|
||||
@stack('header_button_start')
|
||||
|
||||
{!! $buttons !!}
|
||||
@ -33,7 +34,6 @@
|
||||
{!! $moreButtons !!}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@stack('header_end')
|
||||
|
@ -1,10 +1,10 @@
|
||||
@stack('header_start')
|
||||
|
||||
<div id="header" class="xl:pt-6">
|
||||
<div class="flex flex-col sm:flex-row flex-wrap items-start justify-between hide-empty-page">
|
||||
<div class="w-full sm:w-6/12 items-center mb-3 sm:mb-0">
|
||||
<div id="header" class="xl:pt-6 -mt-2">
|
||||
<div class="flex flex-col sm:flex-row items-start justify-between space-x-4 hide-empty-page">
|
||||
<div data-page-title-first class="w-full sm:w-6/12 items-center mb-3 sm:mb-0">
|
||||
<div class="flex items-center">
|
||||
<h1 class="flex items-center text-2xl xl:text-5xl text-black font-light -ml-0.5">
|
||||
<h1 class="flex items-center text-2xl xl:text-5xl text-black font-light -ml-0.5 mt-2 whitespace-nowrap">
|
||||
<x-title>
|
||||
{!! $title !!}
|
||||
</x-title>
|
||||
@ -24,8 +24,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full sm:w-6/12">
|
||||
<div class="flex flex-wrap flex-col sm:flex-row sm:items-center justify-end sm:space-x-2 sm:rtl:space-x-reverse">
|
||||
<div data-page-title-second class="w-full flex flex-wrap flex-col sm:flex-row sm:items-center justify-end sm:space-x-2 sm:rtl:space-x-reverse space-y-2 suggestion-buttons">
|
||||
@stack('header_button_start')
|
||||
|
||||
{!! $buttons !!}
|
||||
@ -35,7 +34,6 @@
|
||||
{!! $moreButtons !!}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@stack('header_end')
|
||||
|
@ -1,10 +1,10 @@
|
||||
@stack('header_start')
|
||||
|
||||
<div id="header" class="xl:pt-6">
|
||||
<div class="flex flex-col sm:flex-row flex-wrap items-start justify-between hide-empty-page">
|
||||
<div class="w-full sm:w-6/12 items-center mb-3 sm:mb-0">
|
||||
<div id="header" class="xl:pt-6 -mt-2">
|
||||
<div lass="flex flex-col sm:flex-row items-start justify-between space-x-4 hide-empty-page">
|
||||
<div data-page-title-first class="w-full sm:w-6/12 items-center mb-3 sm:mb-0">
|
||||
<div class="flex items-center">
|
||||
<h1 class="flex items-center text-2xl xl:text-5xl text-black font-light -ml-0.5">
|
||||
<h1 class="flex items-center text-2xl xl:text-5xl text-black font-light -ml-0.5 mt-2 whitespace-nowrap">
|
||||
<x-title>
|
||||
{!! $title !!}
|
||||
</x-title>
|
||||
@ -24,8 +24,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full sm:w-6/12">
|
||||
<div class="flex flex-wrap flex-col sm:flex-row sm:items-center justify-end sm:space-x-2 sm:rtl:space-x-reverse">
|
||||
<div data-page-title-second class="w-full flex flex-wrap flex-col sm:flex-row sm:items-center justify-end sm:space-x-2 sm:rtl:space-x-reverse space-y-2 suggestion-buttons">
|
||||
@stack('header_button_start')
|
||||
|
||||
{!! $buttons !!}
|
||||
@ -35,7 +34,6 @@
|
||||
{!! $moreButtons !!}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@stack('header_end')
|
||||
|
150
resources/views/components/table/actions-mobile.blade.php
Normal file
150
resources/views/components/table/actions-mobile.blade.php
Normal file
@ -0,0 +1,150 @@
|
||||
@php
|
||||
$count_buttons = 1;
|
||||
$more_actions = [];
|
||||
@endphp
|
||||
|
||||
<div
|
||||
data-mobile-actions
|
||||
class="absolute w-6 h-6 flex items-center justify-center ltr:right-0 rtl:left-0 -top-3 py-0.5 px-1 bg-white border rounded-full cursor-pointer hover:bg-gray-100"
|
||||
>
|
||||
<span class="material-icons-outlined text-lg">
|
||||
more_horiz
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
data-mobile-actions-modal
|
||||
class="modal w-full h-full fixed flex top-0 left-0 right-0 justify-center items-center flex-wrap overflow-y-auto overflow-hidden z-50 opacity-0 invisible modal-background transition-opacity"
|
||||
>
|
||||
<div class="w-full my-10 m-auto flex flex-col px-2 sm:px-0 max-w-md">
|
||||
<div class="p-2 bg-body rounded-lg">
|
||||
@foreach ($actions as $action)
|
||||
@if (! empty($action['permission']))
|
||||
@can($action['permission'])
|
||||
@endif
|
||||
|
||||
@if ($count_buttons > 3 && $loop->count > 4)
|
||||
@break
|
||||
@endif
|
||||
|
||||
@php
|
||||
$type = ! empty($action['type']) ? $action['type'] : 'link';
|
||||
@endphp
|
||||
|
||||
@switch($type)
|
||||
@case('button')
|
||||
<button type="button" class="w-full flex items-center text-purple px-2 h-9 leading-9" {!! $action['attributes'] ?? null !!}>
|
||||
<div class="w-full h-full flex items-center rounded-md px-2 text-sm hover:bg-lilac-100">
|
||||
<span class="material-icons-outlined text-purple text-lg mr-2 pointer-events-none">
|
||||
{{ $action['icon'] }}
|
||||
</span>
|
||||
|
||||
{{ $action['title'] }}
|
||||
</div>
|
||||
</button>
|
||||
@break
|
||||
|
||||
@case('delete')
|
||||
@php
|
||||
$title = $action['title'] ?? null;
|
||||
$modelId = ! empty($action['model-id']) ? $action['model-id'] : 'id';
|
||||
$modelName = ! empty($action['model-name']) ? $action['model-name'] : 'name';
|
||||
@endphp
|
||||
|
||||
<x-delete-button :model="$action['model']" :route="$action['route']" :text="$title" :model-id="$modelId" :model-name="$modelName" />
|
||||
@break
|
||||
|
||||
@default
|
||||
<a href="{{ $action['url'] }}" class="w-full flex items-center text-purple px-2 h-9 leading-9" {!! $action['attributes'] ?? null !!}>
|
||||
<div class="w-full h-full flex items-center rounded-md px-2 text-sm hover:bg-lilac-100">
|
||||
<span class="material-icons-outlined text-purple text-lg mr-2 pointer-events-none">
|
||||
{{ $action['icon'] }}
|
||||
</span>
|
||||
|
||||
{{ $action['title'] }}
|
||||
</div>
|
||||
</a>
|
||||
@endswitch
|
||||
|
||||
@php
|
||||
array_shift($actions);
|
||||
|
||||
$count_buttons++;
|
||||
@endphp
|
||||
|
||||
@if (! empty($action['permission']))
|
||||
@endcan
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
@foreach ($actions as $action)
|
||||
@if (! empty($action['permission']))
|
||||
@can($action['permission'])
|
||||
@php $more_actions[] = $action; @endphp
|
||||
@endcan
|
||||
@else
|
||||
@php $more_actions[] = $action; @endphp
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
@if ($more_actions)
|
||||
@php $divider = false; @endphp
|
||||
|
||||
@foreach ($more_actions as $action)
|
||||
@php
|
||||
$type = ! empty($action['type']) ? $action['type'] : 'link';
|
||||
@endphp
|
||||
|
||||
@switch($type)
|
||||
@case('button')
|
||||
@php $divider = false; @endphp
|
||||
|
||||
<button type="button" class="w-full flex items-center text-purple px-2 h-9 leading-9" {!! $action['attributes'] ?? null !!}>
|
||||
<div class="w-full h-full flex items-center rounded-md px-2 text-sm hover:bg-lilac-100">
|
||||
<span class="material-icons-outlined text-purple text-lg mr-2 pointer-events-none">
|
||||
{{ $action['icon'] }}
|
||||
</span>
|
||||
|
||||
{{ $action['title'] }}
|
||||
</div>
|
||||
</button>
|
||||
@break
|
||||
|
||||
@case('delete')
|
||||
@php $divider = false; @endphp
|
||||
|
||||
@php
|
||||
$title = $action['title'] ?? null;
|
||||
$modelId = ! empty($action['model-id']) ? $action['model-id'] : 'id';
|
||||
$modelName = ! empty($action['model-name']) ? $action['model-name'] : 'name';
|
||||
@endphp
|
||||
<x-delete-link :model="$action['model']" :route="$action['route']" :text="$title" :model-id="$modelId" :model-name="$modelName" />
|
||||
@break
|
||||
|
||||
@case('divider')
|
||||
@if (! $divider)
|
||||
@php $divider = true; @endphp
|
||||
<div class="py-2 px-2">
|
||||
<div class="w-full border-t border-gray-200"></div>
|
||||
</div>
|
||||
@endif
|
||||
@break
|
||||
|
||||
@default
|
||||
@php $divider = false; @endphp
|
||||
|
||||
<a href="{{ $action['url'] }}" class="w-full flex items-center text-purple px-2 h-9 leading-9" {!! $action['attributes'] ?? null !!}>
|
||||
<div class="w-full h-full flex items-center rounded-md px-2 text-sm hover:bg-lilac-100">
|
||||
<span class="material-icons-outlined text-purple text-lg mr-2 pointer-events-none">
|
||||
{{ $action['icon'] }}
|
||||
</span>
|
||||
|
||||
{{ $action['title'] }}
|
||||
</div>
|
||||
</a>
|
||||
@endswitch
|
||||
@endforeach
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
@ -3,7 +3,10 @@
|
||||
$more_actions = [];
|
||||
@endphp
|
||||
|
||||
<div class="absolute ltr:right-12 rtl:left-12 -top-4 hidden items-center group-hover:flex">
|
||||
@mobile
|
||||
<x-table.actions-mobile :actions="$actions" :model="$model" />
|
||||
@else
|
||||
<div class="absolute ltr:right-12 rtl:left-12 -top-4 hidden items-center group-hover:flex">
|
||||
@foreach ($actions as $action)
|
||||
@if (! empty($action['permission']))
|
||||
@can($action['permission'])
|
||||
@ -131,4 +134,5 @@
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@endmobile
|
||||
|
@ -4,12 +4,8 @@
|
||||
$slot_is_string = strval(strlen($slot));
|
||||
@endphp
|
||||
|
||||
@if ($slot_is_string >= $textSize && ! $slot_isHtml)
|
||||
<x-tooltip id="page-title" placement="bottom" message="{!! $slot !!}">
|
||||
<div class="truncate" style="width: 22rem;">
|
||||
<div>
|
||||
<div data-title-truncate>
|
||||
{!! $slot !!}
|
||||
</div>
|
||||
</x-tooltip>
|
||||
@else
|
||||
{!! $slot !!}
|
||||
@endif
|
||||
</div>
|
||||
|
@ -1,4 +1,4 @@
|
||||
<div class="p-7 shadow-2xl rounded-2xl">
|
||||
<div class="p-3 sm:p-7 shadow-2xl rounded-2xl">
|
||||
@switch($transactionTemplate)
|
||||
@case('classic')
|
||||
@break
|
||||
|
@ -8,7 +8,7 @@
|
||||
</div>
|
||||
|
||||
<div class="w-full lg:w-7/12">
|
||||
<div class="p-7 shadow-2xl rounded-2xl">
|
||||
<div class="p-3 sm:p-7 shadow-2xl rounded-2xl">
|
||||
<x-transfers.show.template :model="$transfer" />
|
||||
</div>
|
||||
</div>
|
||||
|
@ -3,7 +3,7 @@
|
||||
<span
|
||||
id="{{ $favorited ? 'remove-from-favorite' : 'add-to-favorite' }}"
|
||||
@class([
|
||||
'flex items-center text-purple text-2xl ltr:ml-2 rtl:mr-2 lg:mt-2 cursor-pointer',
|
||||
'flex items-center text-purple text-2xl ltr:ml-2 rtl:mr-2 lg:mt-4 cursor-pointer',
|
||||
'material-icons-outlined transform transition-all hover:scale-125' => ($favorited) ? false : true,
|
||||
'material-icons' => (! $favorited) ? false : true,
|
||||
])
|
||||
|
@ -16,8 +16,11 @@ sm:rtl:left-4
|
||||
sm:w-500
|
||||
sm:min-h-500
|
||||
sm:max-w-4xl
|
||||
sm:space-x-4
|
||||
sm:text-purple
|
||||
md:grid-cols-2
|
||||
lg:mt-2
|
||||
lg:mt-4
|
||||
lg:pl-24
|
||||
lg:my-12
|
||||
lg:mt-4
|
||||
|
Loading…
x
Reference in New Issue
Block a user