group-hover development for relating component
This commit is contained in:
parent
60668d9817
commit
f9e66a761e
9
public/css/app.css
vendored
9
public/css/app.css
vendored
@ -47438,11 +47438,6 @@ body{
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.hover\:border-black:hover{
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(66 66 66 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.hover\:bg-gray-100:hover{
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
||||
@ -47687,6 +47682,10 @@ body{
|
||||
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.group:hover .group-hover\:bg-full-2{
|
||||
background-size: 100% 2px;
|
||||
}
|
||||
|
||||
.group:hover .group-hover\:text-purple-700{
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(64 66 104 / var(--tw-text-opacity));
|
||||
|
@ -42,7 +42,7 @@
|
||||
|
||||
<div class="ltr:ml-2 rtl:mr-2">
|
||||
<h2 class="mb-1">
|
||||
<x-text.hover text="{{ $report->name }}" color="to-black" />
|
||||
<x-text.hover text="{{ $report->name }}" color="to-black" group-hover />
|
||||
</h2>
|
||||
|
||||
<span class="text-black-400 text-sm">{{ $report->description }}</span>
|
||||
|
@ -11,7 +11,7 @@
|
||||
@if ($attributes->has('route'))
|
||||
<div class="flex justify-center items-center group">
|
||||
<a href="{{ route($attributes->get('route')) }}">
|
||||
<x-text.hover text="{{ trans('modules.see_all_type', ['type' => $attributes->get('title')]) }}" color="to-black" />
|
||||
<x-text.hover text="{{ trans('modules.see_all_type', ['type' => $attributes->get('title')]) }}" color="to-black" group-hover />
|
||||
</a>
|
||||
|
||||
<i class="material-icons text-sm ltr:ml-1 rtl:mr-1 transform transition-all group-hover:translate-x-1">arrow_forward</i>
|
||||
|
@ -1,6 +1,6 @@
|
||||
<div>
|
||||
<h2 class="lg:text-lg font-medium text-black">
|
||||
<x-text.hover text="{{ $title }}" color="to-black" />
|
||||
<x-text.hover text="{{ $title }}" color="to-black" group-hover />
|
||||
</h2>
|
||||
|
||||
@if (! empty($description))
|
||||
|
@ -1,11 +1,15 @@
|
||||
@props(['color', 'text'])
|
||||
@props(['color', 'text', 'groupHover'])
|
||||
|
||||
@php
|
||||
if (empty($color)) {
|
||||
$color = 'to-purple';
|
||||
}
|
||||
|
||||
if (empty($groupHover)) {
|
||||
$groupHover = false;
|
||||
}
|
||||
@endphp
|
||||
|
||||
<span class="bg-no-repeat bg-0-2 bg-0-full hover:bg-full-2 bg-gradient-to-b from-transparent {{ $color }} transition-backgroundSize">
|
||||
<span class="bg-no-repeat bg-0-2 bg-0-full {{ $groupHover ? 'group-hover:bg-full-2' : 'hover:bg-full-2' }} bg-gradient-to-b from-transparent {{ $color }} transition-backgroundSize">
|
||||
{{ $text }}
|
||||
</span>
|
@ -6,7 +6,7 @@
|
||||
x-on:click="attachment !== 1 ? attachment = 1 : attachment = null"
|
||||
>
|
||||
<span class="font-medium">
|
||||
<x-text.hover text="{{ trans_choice('general.attachments', 2) }}" color="to-black" />
|
||||
<x-text.hover text="{{ trans_choice('general.attachments', 2) }}" color="to-black" group-hover />
|
||||
</span>
|
||||
|
||||
<div class="text-black-400 text-sm">
|
||||
|
@ -3,7 +3,7 @@
|
||||
x-on:click="children !== 1 ? children = 1 : children = null"
|
||||
>
|
||||
<span class="font-medium">
|
||||
<x-text.hover text="{{ trans_choice('general.transactions', 2) }}" color="to-black" />
|
||||
<x-text.hover text="{{ trans_choice('general.transactions', 2) }}" color="to-black" group-hover />
|
||||
</span>
|
||||
|
||||
<div class="text-black-400 text-sm">
|
||||
|
@ -8,7 +8,7 @@
|
||||
x-on:click="schedule !== 1 ? schedule = 1 : schedule = null"
|
||||
>
|
||||
<span class="font-medium">
|
||||
<x-text.hover text="{{ trans_choice('general.schedules', 1) }}" color="to-black" />
|
||||
<x-text.hover text="{{ trans_choice('general.schedules', 1) }}" color="to-black" group-hover />
|
||||
</span>
|
||||
|
||||
<div class="text-black-400 text-sm">
|
||||
|
@ -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" x-on:click="attachment !== 1 ? attachment = 1 : attachment = null">
|
||||
<span class="font-medium">
|
||||
<x-text.hover text="{{ trans_choice('general.attachments', 2) }}" color="to-black" />
|
||||
<x-text.hover text="{{ trans_choice('general.attachments', 2) }}" color="to-black" group-hover />
|
||||
</span>
|
||||
|
||||
<div class="text-black-400 text-sm">
|
||||
|
@ -3,7 +3,7 @@
|
||||
<div class="border-b pb-4" x-data="{ create : null }">
|
||||
<button class="relative w-full text-left group" x-on:click="create !== 1 ? create = 1 : create = null">
|
||||
<span class="font-medium">
|
||||
<x-text.hover text="{{ trans('general.create') }}" color="to-black" />
|
||||
<x-text.hover text="{{ trans('general.create') }}" color="to-black" group-hover />
|
||||
</span>
|
||||
|
||||
<div class="text-black-400 text-sm">
|
||||
|
@ -9,7 +9,7 @@
|
||||
<span class="material-icons-outlined text-4xl transition-all text-black-400">{{ $icons[$report->id] }}</span>
|
||||
|
||||
<div class="h-10 font-medium text-sm mt-2">
|
||||
<x-text.hover text="{{ $report->name }}" color="to-black" />
|
||||
<x-text.hover text="{{ $report->name }}" color="to-black" group-hover />
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
|
@ -24,7 +24,7 @@
|
||||
<div class="w-full lg:w-5/12 space-y-8">
|
||||
<div class="border-b-2 border-gray-200 pb-1">
|
||||
<div class="relative w-full text-left group">
|
||||
<x-text.hover text="{{ trans('portal.received_date') }}" color="to-black" />
|
||||
<x-text.hover text="{{ trans('portal.received_date') }}" color="to-black" group-hover />
|
||||
</div>
|
||||
|
||||
<div class="relative overflow-hidden transition-all duration-700">
|
||||
|
@ -22,7 +22,7 @@
|
||||
<div class="w-full lg:w-5/12 space-y-8">
|
||||
<div class="border-b-2 border-gray-200 pb-1">
|
||||
<div class="relative w-full text-left group">
|
||||
<x-text.hover text="{{ trans('portal.received_date') }}" color="to-black" />
|
||||
<x-text.hover text="{{ trans('portal.received_date') }}" color="to-black" group-hover />
|
||||
</div>
|
||||
|
||||
<div class="relative overflow-hidden transition-all duration-700">
|
||||
|
@ -32,7 +32,7 @@
|
||||
<div class="w-full lg:w-5/12 space-y-8">
|
||||
<div class="border-b-2 border-gray-200 pb-1">
|
||||
<div class="relative w-full text-left group">
|
||||
<x-text.hover text="{{ trans('portal.received_date') }}" color="to-black" />
|
||||
<x-text.hover text="{{ trans('portal.received_date') }}" color="to-black" group-hover />
|
||||
</div>
|
||||
|
||||
<div class="relative overflow-hidden transition-all duration-700">
|
||||
|
@ -28,7 +28,7 @@
|
||||
</span>
|
||||
|
||||
<button id="dashboard-widget-{{ strtolower(class_basename($class)) }}-overdue" type="button" class="flex items-center text-black-400 font-medium group" data-dropdown-toggle="widgets-list-{{ $class->model->id }}">
|
||||
<x-text.hover text="{{ $totals['overdue'] }}" color="to-black-400" />
|
||||
<x-text.hover text="{{ $totals['overdue'] }}" color="to-black-400" group-hover />
|
||||
|
||||
<div class="relative flex">
|
||||
<span class="material-icons-round cursor-pointer">arrow_drop_down</span>
|
||||
|
Loading…
x
Reference in New Issue
Block a user