Skip to content

Commit

Permalink
refactor components
Browse files Browse the repository at this point in the history
  • Loading branch information
@FACorreiaa
FACorreiaa committed Jun 22, 2024
1 parent bd2f813 commit 2c8c378
Show file tree
Hide file tree
Showing 24 changed files with 139 additions and 95 deletions.
35 changes: 35 additions & 0 deletions app/static/css/output.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4542,6 +4542,9 @@ details.collapse summary::-webkit-details-marker {
.mt-8 {
margin-top: 2rem;
}
.mb-8 {
margin-bottom: 2rem;
}
.block {
display: block;
}
Expand Down Expand Up @@ -4861,6 +4864,11 @@ details.collapse summary::-webkit-details-marker {
margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(2rem * var(--tw-space-y-reverse));
}
.space-x-1 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0;
margin-right: calc(0.25rem * var(--tw-space-x-reverse));
margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
}
.self-center {
align-self: center;
}
Expand Down Expand Up @@ -4923,6 +4931,14 @@ details.collapse summary::-webkit-details-marker {
.border-transparent {
border-color: transparent;
}
.border-neutral-300 {
--tw-border-opacity: 1;
border-color: rgb(212 212 212 / var(--tw-border-opacity));
}
.border-neutral-700 {
--tw-border-opacity: 1;
border-color: rgb(64 64 64 / var(--tw-border-opacity));
}
.bg-base-100 {
--tw-bg-opacity: 1;
background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));
Expand All @@ -4942,6 +4958,10 @@ details.collapse summary::-webkit-details-marker {
.bg-transparent {
background-color: transparent;
}
.bg-neutral-800 {
--tw-bg-opacity: 1;
background-color: rgb(38 38 38 / var(--tw-bg-opacity));
}
.bg-opacity-50 {
--tw-bg-opacity: 0.5;
}
Expand Down Expand Up @@ -5252,6 +5272,11 @@ details.collapse summary::-webkit-details-marker {
--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-lg {
--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.outline {
outline-style: solid;
}
Expand Down Expand Up @@ -5688,6 +5713,16 @@ details.collapse summary::-webkit-details-marker {
}
@media (prefers-color-scheme: dark) {

.dark\:border-neutral-700 {
--tw-border-opacity: 1;
border-color: rgb(64 64 64 / var(--tw-border-opacity));
}

.dark\:bg-neutral-800 {
--tw-bg-opacity: 1;
background-color: rgb(38 38 38 / var(--tw-bg-opacity));
}

.dark\:shadow-\[0_4px_9px_-4px_rgba\(59\2c 113\2c 202\2c 0\.5\)\] {
--tw-shadow: 0 4px 9px -4px rgba(59,113,202,0.5);
--tw-shadow-colored: 0 4px 9px -4px var(--tw-shadow-color);
Expand Down
8 changes: 4 additions & 4 deletions app/view/airlines/AircraftTable.templ
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,16 +11,16 @@ templ AirlineAircraftTable(a models.AircraftTable) {
<div class="flex flex-col items-left">
@components.InputGroupContainer() {
<div class="mr-2">
@components.InputComponent("Filter Aircraft Name", "/airlines/aircraft", "aircraft_name", "#searchResults")
@components.InputSearch("Filter Aircraft Name", "/airlines/aircraft", "aircraft_name", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Engine Type", "/airlines/aircraft", "type_engine", "#searchResults")
@components.InputSearch("Filter Engine Type", "/airlines/aircraft", "type_engine", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Mode Code", "/airlines/aircraft", "model_code", "#searchResults")
@components.InputSearch("Filter Mode Code", "/airlines/aircraft", "model_code", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Plane Owner", "/airlines/aircraft", "plane_owner", "#searchResults")
@components.InputSearch("Filter Plane Owner", "/airlines/aircraft", "plane_owner", "#searchResults")
</div>
}
<div class="overflow-x-auto">
Expand Down
8 changes: 4 additions & 4 deletions app/view/airlines/AircraftTable_templ.go
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

8 changes: 4 additions & 4 deletions app/view/airlines/AirlineTable.templ
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,16 +11,16 @@ templ AirlineTable(a models.AirlineTable) {
<div class="flex flex-col items-left shadow-xl overflow-hidden">
@components.InputGroupContainer() {
<div class="mr-2">
@components.InputComponent("Filter Airline", "/airlines/airline", "airline_name", "#searchResults")
@components.InputSearch("Filter Airline", "/airlines/airline", "airline_name", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Call Sign", "/airlines/airline", "call_sign", "#searchResults")
@components.InputSearch("Filter Call Sign", "/airlines/airline", "call_sign", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Hub Code", "/airlines/airline", "hub_code", "#searchResults")
@components.InputSearch("Filter Hub Code", "/airlines/airline", "hub_code", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Country", "/airlines/airline", "country_name", "#searchResults")
@components.InputSearch("Filter Country", "/airlines/airline", "country_name", "#searchResults")
</div>
}
<div class="overflow-x-auto">
Expand Down
8 changes: 4 additions & 4 deletions app/view/airlines/AirlineTable_templ.go
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

8 changes: 4 additions & 4 deletions app/view/airlines/AirplaneTable.templ
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,16 +11,16 @@ templ AirplaneTable(a models.AirplaneTable) {
<div class="flex flex-col items-left">
@components.InputGroupContainer() {
<div class="mr-2">
@components.InputComponent("Filter Airline Name", "/airlines/airplane", "airline_name", "#searchResults")
@components.InputSearch("Filter Airline Name", "/airlines/airplane", "airline_name", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Model Name", "/airlines/airplane", "model_name", "#searchResults")
@components.InputSearch("Filter Model Name", "/airlines/airplane", "model_name", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Production Line", "/airlines/airplane", "production_line", "#searchResults")
@components.InputSearch("Filter Production Line", "/airlines/airplane", "production_line", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Registration Number", "/airlines/airplane", "registration_number", "#searchResults")
@components.InputSearch("Filter Registration Number", "/airlines/airplane", "registration_number", "#searchResults")
</div>
}
<div class="overflow-x-auto">
Expand Down
8 changes: 4 additions & 4 deletions app/view/airlines/AirplaneTable_templ.go
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions app/view/airlines/TaxTable.templ
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,13 @@ templ AirlineTaxTable(tax models.TaxTable) {
<div class="flex flex-col items-left">
@components.InputGroupContainer() {
<div class="mr-2">
@components.InputComponent("Filter Tax", "/airlines/tax", "tax_name", "#searchResults")
@components.InputSearch("Filter Tax", "/airlines/tax", "tax_name", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Airline", "/airlines/tax", "airline_name", "#searchResults")
@components.InputSearch("Filter Airline", "/airlines/tax", "airline_name", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Country", "/airlines/tax", "country_name", "#searchResults")
@components.InputSearch("Filter Country", "/airlines/tax", "country_name", "#searchResults")
</div>
}
<div class="overflow-x-auto">
Expand Down
6 changes: 3 additions & 3 deletions app/view/airlines/TaxTable_templ.go
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions app/view/airports/AirportTable.templ
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,13 +19,13 @@ templ AirportTableComponent(airport models.AirportTable) {
<div class="flex flex-col items-left" id="table-container">
@components.InputGroupContainer() {
<div class="mr-2">
@components.InputComponent("Filter Airport Name", "/airports", "airport_name", "#searchResults")
@components.InputSearch("Filter Airport Name", "/airports", "airport_name", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter Country Name", "/airports", "country_name", "#searchResults")
@components.InputSearch("Filter Country Name", "/airports", "country_name", "#searchResults")
</div>
<div class="mr-2">
@components.InputComponent("Filter GMT", "/airports", "gmt", "#searchResults")
@components.InputSearch("Filter GMT", "/airports", "gmt", "#searchResults")
</div>
}
<div class="overflow-x-auto">
Expand Down
6 changes: 3 additions & 3 deletions app/view/airports/AirportTable_templ.go
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion app/view/components/input-group-container.templ
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
package components

templ InputGroupContainer() {
<div class="border-dashed border-2 border-gray-500 rounded p-2 flex flex-row justify-between shadow-xl mb-10 mt-5">
<div class="bg-white dark:bg-neutral-800 border border-neutral-300 dark:border-neutral-700 rounded-lg p-4 flex flex-wrap gap-4 shadow-lg mb-8 mt-4">
{ children... }
</div>
}
3 changes: 1 addition & 2 deletions app/view/components/input-text.templ
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ package components

import "fmt"

templ InputComponent(placeholder, route, search, target string) {
templ InputSearch(placeholder, route, search, target string) {
<form
hx-boost="true"
method="get"
Expand All @@ -15,7 +15,6 @@ templ InputComponent(placeholder, route, search, target string) {
<label class="w-full max-w-xs form-control relative">
<div class="relative">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" class="absolute top-0 right-0 w-4 h-4 mt-2 mr-2 opacity-70 pointer-events-none">
// Updated: changed left-0 to right-0 and ml-2 to mr-2
<path fill-rule="evenodd" d="M9.965 11.026a5 5 0 1 1 1.06-1.06l2.755 2.754a.75.75 0 1 1-1.06 1.06l-2.755-2.754ZM10.5 7a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0Z" clip-rule="evenodd"></path>
</svg>
<input
Expand Down
2 changes: 1 addition & 1 deletion app/view/components/input-text_templ.go
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading

0 comments on commit 2c8c378

Please sign in to comment.