Pdf Changes Done
This commit is contained in:
Utkarsh Khedkar
@@ -15,11 +15,19 @@
|
||||
@endphp
|
||||
|
||||
<style>
|
||||
/* [ALL YOUR ORIGINAL CSS HERE - SAME AS BEFORE] */
|
||||
@keyframes fadeInUp {0% { transform: translateY(20px); opacity: 0; }100% { transform: translateY(0); opacity: 1; }}
|
||||
.card, .custom-table-wrapper { animation: fadeInUp 0.8s ease both; }
|
||||
.custom-table tbody tr { transition: all 0.25s ease-in-out; }
|
||||
.custom-table tbody tr:hover { background-color: #fffbea; transform: scale(1.01); box-shadow: 0 2px 6px rgba(0,0,0,0.05); }
|
||||
|
||||
/* ✅ ROW HOVER EFFECT COMPLETELY DISABLED */
|
||||
.custom-table tbody tr {
|
||||
transition: none !important;
|
||||
}
|
||||
.custom-table tbody tr:hover {
|
||||
background-color: transparent !important;
|
||||
transform: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.priority-badge {
|
||||
display: inline-flex; align-items: center; font-size: 13.5px; padding: 6px 16px; border-radius: 12px; font-weight: 600;
|
||||
box-shadow: 0 1px 2px 0 rgba(230, 206, 206, 0.15); width: 90px; min-height: 28px; justify-content: center;
|
||||
@@ -29,18 +37,22 @@
|
||||
.priority-high { background: linear-gradient(135deg, #ff8a8a, #d12929); }
|
||||
.priority-medium { background: linear-gradient(135deg, #ffe390, #f5b041); }
|
||||
.priority-low { background: linear-gradient(135deg, #b8f0c2, #1d8660); }
|
||||
|
||||
.custom-table thead th {
|
||||
text-align: center; font-weight: 700; color: #ffffffff; padding: 14px; font-size: 17px; letter-spacing: 0.5px;
|
||||
border-bottom: 2px solid #bfbfbf; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);;
|
||||
border-bottom: 2px solid #bfbfbf; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
}
|
||||
.custom-table thead tr:first-child th:first-child { border-top-left-radius: 12px; }
|
||||
.custom-table thead tr:first-child th:last-child { border-top-right-radius: 12px; }
|
||||
.custom-table tbody tr:last-child td:first-child { border-bottom-left-radius: 12px; }
|
||||
.custom-table tbody tr:last-child td:last-child { border-bottom-right-radius: 12px; }
|
||||
|
||||
.input-group input { border-radius: 10px 0 0 10px; border: 1px solid #ccc; box-shadow: inset 0 1px 3px rgba(0,0,0,0.05); }
|
||||
.input-group .btn { border-radius: 0 10px 10px 0; transition: all 0.2s ease-in-out; }
|
||||
.input-group .btn:hover { background: #ffd65a; border-color: #ffd65a; color: #000; }
|
||||
|
||||
.card { border-radius: 16px; border: none; box-shadow: 0 4px 10px rgba(0,0,0,0.08); background: #fff; }
|
||||
|
||||
.badge {
|
||||
font-size: 11px !important; font-weight: 600 !important; padding: 7px 13px !important; border-radius: 20px !important;
|
||||
text-transform: uppercase; letter-spacing: 0.3px; display: inline-flex !important; align-items: center; justify-content: center;
|
||||
@@ -54,8 +66,13 @@
|
||||
@keyframes pulse {0% { box-shadow: 0 0 8px rgba(0,0,0,0.1); }50% { box-shadow: 0 0 14px rgba(0,0,0,0.15); }100% { box-shadow: 0 0 8px rgba(0,0,0,0.1); }}
|
||||
.count-badge { --bs-badge-padding-x: 0.65em; --bs-badge-padding-y: 0.35em; --bs-badge-font-size: 0.75em; --bs-badge-font-weight: 700; --bs-badge-color: #fff; --bs-badge-border-radius: var(--bs-border-radius); }
|
||||
h4.fw-bold { background: linear-gradient(90deg, #000000ff 0%, #030302ff 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: 800; letter-spacing: 1px; }
|
||||
.custom-table tbody td:last-child { text-align: center !important; vertical-align: middle !important; }
|
||||
|
||||
|
||||
.custom-table th,
|
||||
.custom-table td {
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/* ===== PAGINATION STYLES ===== */
|
||||
.pagination-container {
|
||||
display: flex;
|
||||
@@ -197,19 +214,19 @@
|
||||
margin-bottom: 20px;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
|
||||
.search-form {
|
||||
flex: 1;
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
|
||||
.search-input-group {
|
||||
display: flex;
|
||||
box-shadow: 0 2px 6px rgba(0,0,0,0.08);
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
.search-input {
|
||||
flex: 1;
|
||||
border: 1px solid #e2e8f0;
|
||||
@@ -219,13 +236,13 @@
|
||||
background-color: #fff;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
|
||||
.search-input:focus {
|
||||
outline: none;
|
||||
border-color: #3b82f6;
|
||||
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
|
||||
}
|
||||
|
||||
|
||||
.search-button {
|
||||
background: #3b82f6;
|
||||
border: 1px solid #3b82f6;
|
||||
@@ -237,23 +254,23 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
.search-button:hover {
|
||||
background: #2563eb;
|
||||
border-color: #2563eb;
|
||||
}
|
||||
|
||||
|
||||
.search-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
|
||||
.status-badges {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.status-badge {
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
@@ -264,25 +281,34 @@
|
||||
gap: 4px;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
|
||||
.status-badge-pending {
|
||||
background: linear-gradient(135deg, #fef3c7, #fde68a);
|
||||
color: #d97706;
|
||||
border: 1px solid #f59e0b;
|
||||
}
|
||||
|
||||
|
||||
.status-badge-approved {
|
||||
background: linear-gradient(135deg, #d1fae5, #a7f3d0);
|
||||
color: #065f46;
|
||||
border: 1px solid #10b981;
|
||||
}
|
||||
|
||||
|
||||
.status-badge-rejected {
|
||||
background: linear-gradient(135deg, #fecaca, #fca5a5);
|
||||
color: #991b1b;
|
||||
border: 1px solid #ef4444;
|
||||
}
|
||||
|
||||
/* ✅ TABLE WRAPPER – REMOVE HORIZONTAL SCROLL */
|
||||
.custom-table-wrapper {
|
||||
overflow-x: hidden !important;
|
||||
}
|
||||
.custom-table {
|
||||
width: 100%;
|
||||
table-layout: auto;
|
||||
}
|
||||
|
||||
/* Responsive styles */
|
||||
@media (max-width: 768px) {
|
||||
.pagination-container {
|
||||
@@ -293,77 +319,64 @@
|
||||
.pagination-controls {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
.search-container {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
|
||||
.search-form {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
|
||||
.status-badges {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
/* ==============================================
|
||||
PROFILE UPDATE REQUEST BUTTON BADGE FIX
|
||||
============================================== */
|
||||
|
||||
/* Ensure button is positioning context */
|
||||
a.btn.btn-primary.position-relative {
|
||||
position: relative;
|
||||
margin-right: 10px;
|
||||
}
|
||||
/* PROFILE UPDATE REQUEST BUTTON BADGE FIX */
|
||||
a.btn.btn-primary.position-relative {
|
||||
position: relative;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
/* Fix badge inside Profile Update Requests button */
|
||||
a.btn.btn-primary.position-relative .badge {
|
||||
width: 30px !important;
|
||||
height: 30px !important;
|
||||
min-width: 30px !important;
|
||||
padding: 0 !important;
|
||||
font-size: 14px !important;
|
||||
line-height: 30px !important;
|
||||
border-radius: 50% !important;
|
||||
display: inline-flex !important;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
animation: none !important;
|
||||
box-shadow: 0 0 0 2px #ffffff;
|
||||
|
||||
}
|
||||
.custom-table th,
|
||||
.custom-table td {
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
a.btn.btn-primary.position-relative .badge {
|
||||
width: 30px !important;
|
||||
height: 30px !important;
|
||||
min-width: 30px !important;
|
||||
padding: 0 !important;
|
||||
font-size: 14px !important;
|
||||
line-height: 30px !important;
|
||||
border-radius: 50% !important;
|
||||
display: inline-flex !important;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
animation: none !important;
|
||||
box-shadow: 0 0 0 2px #ffffff;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- Counts -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-2 mt-3">
|
||||
<h4 class="fw-bold mb-0">User Requests (Total: {{ $total }})</h4>
|
||||
<h4 class="fw-bold mb-0">User Requests (Total: {{ $total }})</h4>
|
||||
|
||||
@can('request.update_profile')
|
||||
<a href="{{ route('admin.profile.requests') }}" class="btn btn-primary position-relative">
|
||||
<i class="bi bi-person-lines-fill me-1"></i>
|
||||
Profile Update Requests
|
||||
|
||||
@if($pendingProfileUpdates > 0)
|
||||
<span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
|
||||
{{ $pendingProfileUpdates }}
|
||||
</span>
|
||||
@endif
|
||||
</a>
|
||||
@endcan
|
||||
</div>
|
||||
@can('request.update_profile')
|
||||
<a href="{{ route('admin.profile.requests') }}" class="btn btn-primary position-relative">
|
||||
<i class="bi bi-person-lines-fill me-1"></i>
|
||||
Profile Update Requests
|
||||
|
||||
@if($pendingProfileUpdates > 0)
|
||||
<span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
|
||||
{{ $pendingProfileUpdates }}
|
||||
</span>
|
||||
@endif
|
||||
</a>
|
||||
@endcan
|
||||
</div>
|
||||
|
||||
<!-- Search + Table -->
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-body pb-1">
|
||||
<!-- Updated Search Bar with Status Badges in the same line -->
|
||||
<div class="search-container">
|
||||
<form method="GET" action="" class="search-form">
|
||||
<div class="search-input-group">
|
||||
@@ -375,7 +388,7 @@ a.btn.btn-primary.position-relative .badge {
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
<div class="status-badges">
|
||||
<span class="status-badge status-badge-pending">{{ $requests->where('status', 'pending')->count() }} Pending</span>
|
||||
<span class="status-badge status-badge-approved">{{ $requests->where('status', 'approved')->count() }} Approved</span>
|
||||
@@ -385,9 +398,21 @@ a.btn.btn-primary.position-relative .badge {
|
||||
|
||||
<div class="table-responsive custom-table-wrapper">
|
||||
<table class="table align-middle mb-0 custom-table">
|
||||
<thead><tr>
|
||||
<th>#</th><th>Request ID</th><th>Name</th><th>Company</th><th>Email</th><th>Mobile</th><th>Address</th><th>Priority</th><th>Date</th><th>Status</th><th>Actions</th>
|
||||
</tr></thead>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Request ID</th>
|
||||
<th>Name</th>
|
||||
<th>Company</th>
|
||||
<th>Email</th>
|
||||
<th>Mobile</th>
|
||||
<th>Address</th>
|
||||
<th>Priority</th>
|
||||
<th>Date</th>
|
||||
<th>Status</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@forelse($currentItems as $index => $req)
|
||||
<tr>
|
||||
@@ -399,33 +424,41 @@ a.btn.btn-primary.position-relative .badge {
|
||||
<td>{{ $req->mobile_no }}</td>
|
||||
<td>{{ Str::limit($req->address, 30) }}</td>
|
||||
<td>
|
||||
@if(strtolower($req->priority) == 'high')<span class="priority-badge priority-high">High</span>
|
||||
@elseif(strtolower($req->priority) == 'medium')<span class="priority-badge priority-medium">Medium</span>
|
||||
@elseif(strtolower($req->priority) == 'low')<span class="priority-badge priority-low">Low</span>
|
||||
@else{{ $req->priority ?? 'N/A' }}@endif
|
||||
@if(strtolower($req->priority) == 'high')
|
||||
<span class="priority-badge priority-high">High</span>
|
||||
@elseif(strtolower($req->priority) == 'medium')
|
||||
<span class="priority-badge priority-medium">Medium</span>
|
||||
@elseif(strtolower($req->priority) == 'low')
|
||||
<span class="priority-badge priority-low">Low</span>
|
||||
@else
|
||||
{{ $req->priority ?? 'N/A' }}
|
||||
@endif
|
||||
</td>
|
||||
<td>{{ $req->date }}</td>
|
||||
<td>
|
||||
@if($req->status == 'approved')<span class="badge badge-approved"><i class="bi bi-check-circle-fill status-icon"></i>Approved</span>
|
||||
@elseif($req->status == 'rejected')<span class="badge badge-rejected"><i class="bi bi-x-circle-fill status-icon"></i>Rejected</span>
|
||||
@else<span class="badge badge-pending"><i class="bi bi-clock-fill status-icon"></i>Pending</span>@endif
|
||||
@if($req->status == 'approved')
|
||||
<span class="badge badge-approved"><i class="bi bi-check-circle-fill status-icon"></i>Approved</span>
|
||||
@elseif($req->status == 'rejected')
|
||||
<span class="badge badge-rejected"><i class="bi bi-x-circle-fill status-icon"></i>Rejected</span>
|
||||
@else
|
||||
<span class="badge badge-pending"><i class="bi bi-clock-fill status-icon"></i>Pending</span>
|
||||
@endif
|
||||
</td>
|
||||
<td>
|
||||
@if($req->status == 'pending')
|
||||
<a href="{{ route('admin.requests.approve', $req->id) }}"
|
||||
class="btn btn-success btn-sm">
|
||||
<a href="{{ route('admin.requests.approve', $req->id) }}"
|
||||
class="btn btn-success btn-sm">
|
||||
<i class="bi bi-check-circle"></i> Approve
|
||||
</a>
|
||||
|
||||
<a href="{{ route('admin.requests.reject', $req->id) }}"
|
||||
class="btn btn-danger btn-sm">
|
||||
<a href="{{ route('admin.requests.reject', $req->id) }}"
|
||||
class="btn btn-danger btn-sm">
|
||||
<i class="bi bi-x-circle"></i> Reject
|
||||
</a>
|
||||
@else
|
||||
<span class="text-muted">No Action</span>
|
||||
@endif
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
@empty
|
||||
<tr><td colspan="11" class="text-center text-muted py-4">No records found.</td></tr>
|
||||
@@ -504,4 +537,4 @@ a.btn.btn-primary.position-relative .badge {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
@endsection
|
||||
|
||||
Reference in New Issue
Block a user