Skip to content

Commit

Permalink
update : layout | all layout
Browse files Browse the repository at this point in the history
  • Loading branch information
@MRoyhanF
MRoyhanF committed Dec 14, 2024
1 parent de99b67 commit 2f8767b
Show file tree
Hide file tree
Showing 7 changed files with 83 additions and 73 deletions.
12 changes: 12 additions & 0 deletions public/css/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -770,6 +770,10 @@ video {
min-width: 240px;
}

.min-w-\[200px\] {
min-width: 200px;
}

.max-w-\[20rem\] {
max-width: 20rem;
}
Expand All @@ -778,6 +782,14 @@ video {
max-width: 24rem;
}

.max-w-\[10rem\] {
max-width: 10rem;
}

.max-w-\[14rem\] {
max-width: 14rem;
}

.flex-grow {
flex-grow: 1;
}
Expand Down
2 changes: 1 addition & 1 deletion src/resources/views/components/layout/app.edge
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
@include('components/ui/sidebar')

<div class="bg-gray-500 w-full flex flex-col">
<div class="p-6 w-full bg-white">
<div class="px-6 py-2 w-full bg-white">
<!-- Content Head -->
<h1 class="text-2xl font-bold">{{title}}</h1>
</div>
Expand Down
4 changes: 2 additions & 2 deletions src/resources/views/components/ui/sidebar.edge
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
<div
class="relative flex flex-col bg-clip-border rounded-r-xl bg-white text-gray-700 h-full w-full max-w-[20rem] p-4 shadow-xl shadow-blue-gray-900/5">
class="relative flex flex-col bg-clip-border rounded-r-xl bg-white text-gray-700 h-full w-full max-w-[14rem] p-4 shadow-xl shadow-blue-gray-900/5">
<div class="pb-2 px-4 flex flex-row items-center gap-4 border-b-2">
<img src="/images/airhopper.jpg" class="rounded-xl" width="50" alt="" srcset="" />
<h5 class="block antialiased tracking-normal font-sans text-xl font-semibold leading-snug text-gray-900">
AirHopper</h5>
</div>
<nav class="flex flex-col gap-1 min-w-[240px] p-2 font-sans text-base font-normal text-gray-700">
<nav class="flex flex-col gap-1 min-w-[200px] p-2 font-sans text-base font-normal text-gray-700">
<a href="/admin/dashboard"
class="flex items-center w-full p-3 rounded-lg text-start leading-tight transition-all hover:bg-blue-50 hover:bg-opacity-80 focus:bg-blue-50 focus:bg-opacity-80 active:bg-gray-50 active:bg-opacity-80 hover:text-blue-900 focus:text-blue-900 active:text-blue-900 outline-none">
<div class="grid place-items-center mr-4">
Expand Down
2 changes: 1 addition & 1 deletion src/resources/views/pages/airline/index.edge
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
@layout.app({ title: "Airlines List" })
@slot('main')

<div class="p-6 w-full bg-white rounded-lg">
<div class="px-6 py-2 w-full bg-white rounded-lg">
<!-- Content Head -->
<div class="flex justify-end items-center mb-2">
@component('components/ui/modal', {
Expand Down
10 changes: 4 additions & 6 deletions src/resources/views/pages/airline/listAirplanes.edge
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,14 @@
@layout.app({ title: "Airplanes List" })
@slot('main')

<div class="p-6 w-full bg-white rounded-lg">
<div class="px-6 py-2 w-full bg-white rounded-lg">
<!-- Content Head -->
<div class="flex justify-between items-center mb-2">
{{-- Ini Logi Maskapai --}}
<a href="/admin/airline" class="shadow-md py-2 px-4 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-blue-300 text-blue-800 hover:bg-blue-400 focus:outline-none focus:bg-blue-200 disabled:opacity-50 disabled:pointer-events-none">Back</a>
<div class="flex items-center gap-x-2">
<a href="/admin/airline" class="shadow-md py-2 px-4 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-blue-300 text-blue-800 hover:bg-blue-400 focus:outline-none focus:bg-blue-200 disabled:opacity-50 disabled:pointer-events-none">Back</a>
<div class="flex items-center gap-x-2">
<img src="/images/airhopper.jpg" class="rounded-xl w-10" alt="" srcset="" />
<span class="text-sm font-medium">Airline Name</span>
</div>
<img src="/images/airhopper.jpg" class="rounded-xl w-10" alt="" srcset="" />
<span class="text-md font-medium">Airline Name</span>
</div>
@component('components/ui/modal', {
title: 'Add Airplane',
Expand Down
4 changes: 2 additions & 2 deletions src/resources/views/pages/airport/index.edge
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
@layout.app({ title: "Airport List Page" })
@layout.app({ title: "Airport List" })
@slot('main')

<div class="p-6 w-full bg-white rounded-lg">
<div class="px-6 py-2 w-full bg-white rounded-lg">
<!-- Content Head -->
<div class="flex justify-end items-center mb-2">
@component('components/ui/modal', {
Expand Down
122 changes: 61 additions & 61 deletions src/resources/views/pages/flight/index.edge
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
@layout.app({ title: "Flights List" })
@slot('main')

<div class="p-6 w-full bg-white rounded-lg">
<div class="px-6 py-2 w-full bg-white rounded-lg">
<!-- Content Head -->
<div class="flex justify-end items-center mb-2">
@component('components/ui/modal', {
Expand All @@ -17,68 +17,68 @@
@end
</div>

<div class="border-2 rounded-lg p-4 overflow-x-auto">
<table class="myTable display" style="width:100%">
<thead>
<tr>
<th>No</th>
<th>Class</th>
<th>Airline</th>
<th>Departure City</th>
<th>Departure Time</th>
<th>Arrival City</th>
<th>Arrival Time</th>
<th>Action</th>
</tr>
</thead>
<tbody class="text-center">
@each((data, index) in flights)
<div class="border-2 rounded-lg p-4 overflow-x-auto">
<table class="myTable display" style="width:100%">
<thead>
<tr>
<td>{{ index + 1 }}</td>
<td>
@if(data.class == 'Economy')
<span class="bg-green-300 text-green-800 px-2 py-1 rounded-lg">
{{ data.class }}
</span>
@elseif(data.class == 'Premium_Economy')
<span class="bg-blue-300 text-blue-800 px-2 py-1 rounded-lg">
{{ data.class }}
</span>
@elseif(data.class == 'Business')
<span class="bg-red-300 text-red-800 px-2 py-1 rounded-lg">
{{ data.class }}
</span>
@else
<span class="bg-purple-300 text-purple-800 px-2 py-1 rounded-lg">
{{ data.class }}
</span>
@endif
</td>
<td>{{ data.airline }}</td>
<td>{{ data.departure.city.name }}</td>
<td>{{ data.departure.time }}</td>
<td>{{ data.arrival.city.name }}</td>
<td>{{ data.arrival.time }}</td>
<td>
<div class="flex flex-row gap-x-2">
<a href="/admin/flight/{{ data.id }}" class="shadow-md py-1 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-green-300 text-green-800 hover:bg-green-400 focus:outline-none focus:bg-green-200 disabled:opacity-50 disabled:pointer-events-none">
Detail
</a>
<a href="#" class="shadow-md py-1 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-yellow-300 text-yellow-800 hover:bg-yellow-400 focus:outline-none focus:bg-yellow-200 disabled:opacity-50 disabled:pointer-events-none">
Edit
</a>
</div>
</td>
<th>No</th>
<th>Class</th>
<th>Airline</th>
<th>Departure City</th>
<th>Departure Time</th>
<th>Arrival City</th>
<th>Arrival Time</th>
<th>Action</th>
</tr>
@else
<tr>
<td colspan="7" class="text-center">No data available</td>
</tr>
@end
</tbody>

</table>
</div>
</thead>
<tbody class="text-center">
@each((data, index) in flights)
<tr>
<td>{{ index + 1 }}</td>
<td>
@if(data.class == 'Economy')
<span class="bg-green-300 text-green-800 px-2 py-1 rounded-lg">
{{ data.class }}
</span>
@elseif(data.class == 'Premium_Economy')
<span class="bg-blue-300 text-blue-800 px-2 py-1 rounded-lg">
{{ data.class }}
</span>
@elseif(data.class == 'Business')
<span class="bg-red-300 text-red-800 px-2 py-1 rounded-lg">
{{ data.class }}
</span>
@else
<span class="bg-purple-300 text-purple-800 px-2 py-1 rounded-lg">
{{ data.class }}
</span>
@endif
</td>
<td>{{ data.airline }}</td>
<td>{{ data.departure.city.name }}</td>
<td>{{ data.departure.time }}</td>
<td>{{ data.arrival.city.name }}</td>
<td>{{ data.arrival.time }}</td>
<td>
<div class="flex flex-row gap-x-2">
<a href="/admin/flight/{{ data.id }}" class="shadow-md py-1 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-green-300 text-green-800 hover:bg-green-400 focus:outline-none focus:bg-green-200 disabled:opacity-50 disabled:pointer-events-none">
Detail
</a>
<a href="#" class="shadow-md py-1 px-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-yellow-300 text-yellow-800 hover:bg-yellow-400 focus:outline-none focus:bg-yellow-200 disabled:opacity-50 disabled:pointer-events-none">
Edit
</a>
</div>
</td>
</tr>
@else
<tr>
<td colspan="7" class="text-center">No data available</td>
</tr>
@end
</tbody>

</table>
</div>
</div>


Expand Down

0 comments on commit 2f8767b

Please sign in to comment.