Skip to content

Commit 79f7cf7

Browse files
Parani2002Parani2002
committed
Ui updated
1 parent 456193d commit 79f7cf7

File tree

3 files changed

+40
-117
lines changed

3 files changed

+40
-117
lines changed

‎resources/views/components/layouts/app.blade.php

Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,22 @@
1111
</head>
1212
<body>
1313
{{-- Include header component properly if needed --}}
14-
<x-header />
15-
<x-sidebar />
1614

17-
{{ $slot }}
18-
19-
<x-footer />
15+
<div class="flex flex-col min-h-screen">
16+
<!-- Main Content -->
17+
<x-header />
18+
<x-sidebar />
19+
<div class="flex-grow">
20+
<!-- Your page content goes here -->
21+
{{ $slot }}
22+
</div>
23+
24+
<!-- Footer -->
25+
<div class="mt-auto">
26+
<x-footer />
27+
</div>
28+
</div>
29+
30+
2031
</body>
2132
</html>

‎resources/views/livewire/dashboard/card.blade.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
</div>
88
<div class="ml-4">
99
<h2 class="text-xl font-bold">{{$title}}</h2>
10-
<p class="text-lg">Average: <span class="font-semibold">{{$count}}</span></p>
10+
<p class="text-lg">Average: <span class="font-semibold"></span></p>
1111
</div>
1212
</div>
1313

‎resources/views/livewire/students/students.blade.php

Lines changed: 23 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -1,114 +1,26 @@
1-
2-
<div class="flex flex-col">
3-
<div class="-m-1.5 overflow-x-auto">
4-
<div class="p-1.5 min-w-full inline-block align-middle">
5-
<div class="border rounded-lg divide-y divide-gray-200 dark:border-neutral-700 dark:divide-neutral-700">
6-
<div class="py-3 px-4">
7-
<div class="relative max-w-xs">
8-
<label class="sr-only">Search</label>
9-
<input type="text" name="hs-table-with-pagination-search" id="hs-table-with-pagination-search" class="py-2 px-3 ps-9 block w-full border-gray-200 shadow-sm rounded-lg text-sm focus:z-10 focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-neutral-900 dark:border-neutral-700 dark:text-neutral-400 dark:placeholder-neutral-500 dark:focus:ring-neutral-600" placeholder="Search for items">
10-
<div class="absolute inset-y-0 start-0 flex items-center pointer-events-none ps-3">
11-
<svg class="size-4 text-gray-400 dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
12-
<circle cx="11" cy="11" r="8"></circle>
13-
<path d="m21 21-4.3-4.3"></path>
14-
</svg>
15-
</div>
16-
</div>
17-
</div>
18-
<div class="overflow-hidden">
19-
<table class="min-w-full divide-y divide-gray-200 dark:divide-neutral-700">
20-
<thead class="bg-gray-50 dark:bg-neutral-700">
21-
<tr>
22-
<th scope="col" class="py-3 px-4 pe-0">
23-
<div class="flex items-center h-5">
24-
<input id="hs-table-pagination-checkbox-all" type="checkbox" class="border-gray-200 rounded text-blue-600 focus:ring-blue-500 dark:bg-neutral-700 dark:border-neutral-500 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800">
25-
<label for="hs-table-pagination-checkbox-all" class="sr-only">Checkbox</label>
26-
</div>
27-
</th>
28-
<th scope="col" class="px-6 py-3 text-start text-xs font-medium text-gray-500 uppercase dark:text-neutral-500">Name</th>
29-
<th scope="col" class="px-6 py-3 text-start text-xs font-medium text-gray-500 uppercase dark:text-neutral-500">Age</th>
30-
<th scope="col" class="px-6 py-3 text-start text-xs font-medium text-gray-500 uppercase dark:text-neutral-500">Address</th>
31-
<th scope="col" class="px-6 py-3 text-end text-xs font-medium text-gray-500 uppercase dark:text-neutral-500">Action</th>
32-
</tr>
33-
</thead>
34-
<tbody class="divide-y divide-gray-200 dark:divide-neutral-700">
35-
@foreach ($students as $student)
36-
37-
38-
<tr>
39-
<td class="py-3 ps-4">
40-
<div class="flex items-center h-5">
41-
<input id="hs-table-pagination-checkbox-1" type="checkbox" class="border-gray-200 rounded text-blue-600 focus:ring-blue-500 dark:bg-neutral-800 dark:border-neutral-700 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-gray-800">
42-
<label for="hs-table-pagination-checkbox-1" class="sr-only">Checkbox</label>
43-
</div>
44-
</td>
45-
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-neutral-200">{{$student -> firstname}}</td>
46-
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-neutral-200">{{$student -> age}}</td>
47-
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-neutral-200">{{$student -> address}}</td>
1+
<div class="overflow-x-auto">
2+
<table class="min-w-full border border-gray-200 divide-y divide-gray-200 dark:border-gray-700 dark:divide-gray-700 shadow-lg rounded-lg overflow-hidden">
3+
<thead class="bg-gray-100 dark:bg-gray-800">
4+
<tr>
5+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-700 uppercase dark:text-gray-300">First Name</th>
6+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-700 uppercase dark:text-gray-300">Age</th>
7+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-700 uppercase dark:text-gray-300">Address</th>
8+
<th class="px-6 py-3 text-end text-xs font-medium text-gray-700 uppercase dark:text-gray-300">Actions</th>
9+
</tr>
10+
</thead>
11+
<tbody class="bg-white divide-y divide-gray-200 dark:bg-gray-900 dark:divide-gray-700">
12+
@foreach($students as $student)
13+
<tr class="hover:bg-gray-50 dark:hover:bg-gray-800 transition-all">
14+
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-200">{{$student->firstname}}</td>
15+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-gray-200">{{$student->age}}</td>
16+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-gray-200">{{$student->address}}</td>
4817
<td class="px-6 py-4 whitespace-nowrap text-end text-sm font-medium">
49-
{{-- <button type="button" class="inline-flex items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent text-blue-600 hover:text-blue-800 focus:outline-none focus:text-blue-800 disabled:opacity-50 disabled:pointer-events-none dark:text-blue-500 dark:hover:text-blue-400 dark:focus:text-blue-400" wire:click ="delete{{$student -> id}}">Delete</button> --}}
50-
<button type="button" class="py-3 px-4 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 focus:outline-none focus:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none" wire:click="delete({{ $student->id }})" aria-haspopup="dialog" aria-expanded="false" aria-controls="hs-basic-modal" data-hs-overlay="#hs-basic-modal">
51-
Delete
18+
<button type="button" class="py-2 px-4 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg bg-red-600 text-white hover:bg-red-700 focus:outline-none focus:bg-red-700 disabled:opacity-50 disabled:pointer-events-none" wire:click="delete({{ $student->id }})">
19+
Delete
5220
</button>
53-
54-
<div id="hs-basic-modal" class="hs-overlay hs-overlay-open:opacity-100 hs-overlay-open:duration-500 hidden size-full fixed top-0 start-0 z-[80] opacity-0 overflow-x-hidden transition-all overflow-y-auto pointer-events-none" role="dialog" tabindex="-1" aria-labelledby="hs-basic-modal-label">
55-
<div class="sm:max-w-lg sm:w-full m-3 sm:mx-auto">
56-
<div class="flex flex-col bg-white border shadow-sm rounded-xl pointer-events-auto dark:bg-neutral-800 dark:border-neutral-700 dark:shadow-neutral-700/70">
57-
<div class="flex justify-between items-center py-3 px-4 border-b dark:border-neutral-700">
58-
<h3 id="hs-basic-modal-label" class="font-bold text-gray-800 dark:text-white">
59-
Modal title
60-
</h3>
61-
<button type="button" class="size-8 inline-flex justify-center items-center gap-x-2 rounded-full border border-transparent bg-gray-100 text-gray-800 hover:bg-gray-200 focus:outline-none focus:bg-gray-200 disabled:opacity-50 disabled:pointer-events-none dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-basic-modal">
62-
<span class="sr-only">Close</span>
63-
<svg class="shrink-0 size-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
64-
<path d="M18 6 6 18"></path>
65-
<path d="m6 6 12 12"></path>
66-
</svg>
67-
</button>
68-
</div>
69-
<div class="p-4 overflow-y-auto">
70-
<p class="mt-1 text-gray-800 dark:text-neutral-400">
71-
This is a wider card with supporting text below as a natural lead-in to additional content.
72-
</p>
73-
</div>
74-
<div class="flex justify-end items-center gap-x-2 py-3 px-4 border-t dark:border-neutral-700">
75-
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-gray-200 bg-white text-gray-800 shadow-sm hover:bg-gray-50 focus:outline-none focus:bg-gray-50 disabled:opacity-50 disabled:pointer-events-none dark:bg-neutral-800 dark:border-neutral-700 dark:text-white dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" data-hs-overlay="#hs-basic-modal">
76-
Close
77-
</button>
78-
<button type="button" class="py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 focus:outline-none focus:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none">
79-
Save changes
80-
</button>
81-
</div>
82-
</div>
83-
</div>
84-
</div>
8521
</td>
86-
</tr>
87-
@endforeach
88-
89-
90-
91-
92-
93-
</tbody>
94-
</table>
95-
</div>
96-
<div class="py-1 px-4">
97-
<nav class="flex items-center space-x-1" aria-label="Pagination">
98-
<button type="button" class="p-2.5 min-w-[40px] inline-flex justify-center items-center gap-x-2 text-sm rounded-full text-gray-800 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 disabled:opacity-50 disabled:pointer-events-none dark:text-white dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" aria-label="Previous">
99-
<span aria-hidden="true">«</span>
100-
<span class="sr-only">Previous</span>
101-
</button>
102-
<button type="button" class="min-w-[40px] flex justify-center items-center text-gray-800 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 py-2.5 text-sm rounded-full disabled:opacity-50 disabled:pointer-events-none dark:text-white dark:focus:bg-neutral-700 dark:hover:bg-neutral-700" aria-current="page">1</button>
103-
<button type="button" class="min-w-[40px] flex justify-center items-center text-gray-800 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 py-2.5 text-sm rounded-full disabled:opacity-50 disabled:pointer-events-none dark:text-white dark:focus:bg-neutral-700 dark:hover:bg-neutral-700">2</button>
104-
<button type="button" class="min-w-[40px] flex justify-center items-center text-gray-800 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 py-2.5 text-sm rounded-full disabled:opacity-50 disabled:pointer-events-none dark:text-white dark:focus:bg-neutral-700 dark:hover:bg-neutral-700">3</button>
105-
<button type="button" class="p-2.5 min-w-[40px] inline-flex justify-center items-center gap-x-2 text-sm rounded-full text-gray-800 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 disabled:opacity-50 disabled:pointer-events-none dark:text-white dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" aria-label="Next">
106-
<span class="sr-only">Next</span>
107-
<span aria-hidden="true">»</span>
108-
</button>
109-
</nav>
110-
</div>
111-
</div>
112-
</div>
113-
</div>
114-
</div>
22+
</tr>
23+
@endforeach
24+
</tbody>
25+
</table>
26+
</div>

0 commit comments

Comments
 (0)