From ca82305bff9959f8cc3d62845db8c14e9e0675dc Mon Sep 17 00:00:00 2001 From: ShuriZma Date: Sun, 15 Oct 2023 17:29:16 +0200 Subject: [PATCH] add accent color add keybinds --- .env.example | 3 + app/Http/Controllers/KeybindController.php | 73 +++++ app/Http/Requests/StoreKeybindRequest.php | 28 ++ app/Http/Requests/UpdateKeybindRequest.php | 28 ++ app/Models/Keybind.php | 93 ++++++ app/Policies/KeybindPolicy.php | 66 ++++ database/factories/KeybindFactory.php | 23 ++ ...023_10_15_114638_create_keybinds_table.php | 29 ++ database/seeders/KeybindSeeder.php | 17 + public/css/app.css | 299 ++++++++++++++++-- resources/views/components/keyboard.blade.php | 19 ++ resources/views/components/layout.blade.php | 4 +- .../components/layout/breadcrumb.blade.php | 6 +- .../views/components/layout/sidebar.blade.php | 21 +- .../views/components/primary-button.blade.php | 2 +- .../components/searchbar-select2.blade.php | 16 +- resources/views/components/section.blade.php | 2 +- .../select-dropdown-hover.blade.php | 10 +- .../views/components/table/row.blade.php | 4 +- .../views/components/table/table.blade.php | 2 +- .../views/components/text-input.blade.php | 2 +- .../views/components/vehicles/card.blade.php | 2 +- resources/views/home.blade.php | 53 +++- resources/views/keybinds.blade.php | 26 ++ .../vendor/pagination/tailwind.blade.php | 22 +- routes/breadcrumbs.php | 6 + routes/web.php | 3 + 27 files changed, 787 insertions(+), 72 deletions(-) create mode 100644 app/Http/Controllers/KeybindController.php create mode 100644 app/Http/Requests/StoreKeybindRequest.php create mode 100644 app/Http/Requests/UpdateKeybindRequest.php create mode 100644 app/Models/Keybind.php create mode 100644 app/Policies/KeybindPolicy.php create mode 100644 database/factories/KeybindFactory.php create mode 100644 database/migrations/2023_10_15_114638_create_keybinds_table.php create mode 100644 database/seeders/KeybindSeeder.php create mode 100644 resources/views/components/keyboard.blade.php create mode 100644 resources/views/keybinds.blade.php diff --git a/.env.example b/.env.example index 659f2cc..0b1ba3e 100644 --- a/.env.example +++ b/.env.example @@ -8,6 +8,9 @@ APP_COPYRIGHT=ShuriZma APP_COPYRIGHT_SINCE=2023 FOOTER_IMAGE=img/header.png # can be any image type. path should start from public/ (ex. 'img/header.png') LANDING_PAGE=false # if set to true a landing page will be added, if false the vehicle list is the landing page +ACCENT_COLOR=red-400 # https://tailwindcss.com/docs/background-color + +KEYBIND_SEPERATOR=; # seperator for keybind combos, thats being used on the db to seperate multiple keys # VEHICLE LIST CURRENCY=$ # unit for prices etc diff --git a/app/Http/Controllers/KeybindController.php b/app/Http/Controllers/KeybindController.php new file mode 100644 index 0000000..426f90a --- /dev/null +++ b/app/Http/Controllers/KeybindController.php @@ -0,0 +1,73 @@ + $keybinds, + ]) + ); + } + + /** + * Show the form for creating a new resource. + */ + public function create() + { + // + } + + /** + * Store a newly created resource in storage. + */ + public function store(StoreKeybindRequest $request) + { + // + } + + /** + * Display the specified resource. + */ + public function show(Keybind $keybind) + { + // + } + + /** + * Show the form for editing the specified resource. + */ + public function edit(Keybind $keybind) + { + // + } + + /** + * Update the specified resource in storage. + */ + public function update(UpdateKeybindRequest $request, Keybind $keybind) + { + // + } + + /** + * Remove the specified resource from storage. + */ + public function destroy(Keybind $keybind) + { + // + } +} diff --git a/app/Http/Requests/StoreKeybindRequest.php b/app/Http/Requests/StoreKeybindRequest.php new file mode 100644 index 0000000..30ee691 --- /dev/null +++ b/app/Http/Requests/StoreKeybindRequest.php @@ -0,0 +1,28 @@ + + */ + public function rules(): array + { + return [ + // + ]; + } +} diff --git a/app/Http/Requests/UpdateKeybindRequest.php b/app/Http/Requests/UpdateKeybindRequest.php new file mode 100644 index 0000000..4333a16 --- /dev/null +++ b/app/Http/Requests/UpdateKeybindRequest.php @@ -0,0 +1,28 @@ + + */ + public function rules(): array + { + return [ + // + ]; + } +} diff --git a/app/Models/Keybind.php b/app/Models/Keybind.php new file mode 100644 index 0000000..37b18f7 --- /dev/null +++ b/app/Models/Keybind.php @@ -0,0 +1,93 @@ +keybind_id; + } + + /** + * @param int $keybind_id + * + * @return Keybind + */ + public function setKeybindId(int $keybind_id): Keybind + { + $this->keybind_id = $keybind_id; + + return $this; + } + + /** + * @return string + */ + public function getKeybindKeys(): string + { + return $this->keybind_keys; + } + + /** + * @param string $keybind_keys + * + * @return Keybind + */ + public function setKeybindKeys(string $keybind_keys): Keybind + { + $this->keybind_keys = $keybind_keys; + + return $this; + } + + /** + * @return string + */ + public function getKeybindDescription(): string + { + return $this->keybind_description; + } + + /** + * @param string $keybind_description + * + * @return Keybind + */ + public function setKeybindDescription(string $keybind_description): Keybind + { + $this->keybind_description = $keybind_description; + + return $this; + } +} diff --git a/app/Policies/KeybindPolicy.php b/app/Policies/KeybindPolicy.php new file mode 100644 index 0000000..ad07401 --- /dev/null +++ b/app/Policies/KeybindPolicy.php @@ -0,0 +1,66 @@ + + */ +class KeybindFactory extends Factory +{ + /** + * Define the model's default state. + * + * @return array + */ + public function definition(): array + { + return [ + // + ]; + } +} diff --git a/database/migrations/2023_10_15_114638_create_keybinds_table.php b/database/migrations/2023_10_15_114638_create_keybinds_table.php new file mode 100644 index 0000000..ccacb9a --- /dev/null +++ b/database/migrations/2023_10_15_114638_create_keybinds_table.php @@ -0,0 +1,29 @@ +id('keybind_id'); + $table->timestamps(); + $table->string('keybind_keys'); + $table->text('keybind_description'); + }); + } + + /** + * Reverse the migrations. + */ + public function down(): void + { + Schema::dropIfExists('keybinds'); + } +}; diff --git a/database/seeders/KeybindSeeder.php b/database/seeders/KeybindSeeder.php new file mode 100644 index 0000000..3378c04 --- /dev/null +++ b/database/seeders/KeybindSeeder.php @@ -0,0 +1,17 @@ + .select{ border-radius: 0px; } +.kbd{ + display: inline-flex; + align-items: center; + justify-content: center; + border-width: 1px; + border-color: hsl(var(--bc) / var(--tw-border-opacity)); + --tw-border-opacity: 0.2; + --tw-bg-opacity: 1; + background-color: hsl(var(--b2, var(--b1)) / var(--tw-bg-opacity)); + padding-left: 0.5rem; + padding-right: 0.5rem; + border-radius: var(--rounded-btn, 0.5rem); + border-bottom-width: 2px; + min-height: 2.2em; + min-width: 2.2em; +} .link{ cursor: pointer; text-decoration-line: underline; @@ -14148,6 +14164,10 @@ html{ margin-top: auto; margin-bottom: auto; } +.my-1{ + margin-top: 0.25rem; + margin-bottom: 0.25rem; +} .-mb-\[6\.5rem\]{ margin-bottom: -6.5rem; } @@ -14229,6 +14249,123 @@ html{ .mt-8{ margin-top: 2rem; } +.ml-\[3rem\]{ + margin-left: 3rem; +} +.ml-\[2\.5rem\]{ + margin-left: 2.5rem; +} +.ml-\[2rem\]{ + margin-left: 2rem; +} +.ml-\[1rem\]{ + margin-left: 1rem; +} +.mr-\[1rem\]{ + margin-right: 1rem; +} +.mr-\[2rem\]{ + margin-right: 2rem; +} +.mr-\[2\.3rem\]{ + margin-right: 2.3rem; +} +.mr-\[2\.5rem\]{ + margin-right: 2.5rem; +} +.mr-\[2\.6rem\]{ + margin-right: 2.6rem; +} +.ml-\[1\.5rem\]{ + margin-left: 1.5rem; +} +.mr-\[23rem\]{ + margin-right: 23rem; +} +.mr-\[3rem\]{ + margin-right: 3rem; +} +.mr-\[2\.8rem\]{ + margin-right: 2.8rem; +} +.mr-\[2\.7rem\]{ + margin-right: 2.7rem; +} +.mr-\[9\.7rem\]{ + margin-right: 9.7rem; +} +.mr-\[12\.7rem\]{ + margin-right: 12.7rem; +} +.mr-\[11\.7rem\]{ + margin-right: 11.7rem; +} +.mr-\[12rem\]{ + margin-right: 12rem; +} +.mr-\[7rem\]{ + margin-right: 7rem; +} +.mr-\[3\.5rem\]{ + margin-right: 3.5rem; +} +.mr-\[5rem\]{ + margin-right: 5rem; +} +.mr-\[4rem\]{ + margin-right: 4rem; +} +.mr-\[4\.2rem\]{ + margin-right: 4.2rem; +} +.mr-\[2\.4rem\]{ + margin-right: 2.4rem; +} +.mr-\[3\.7rem\]{ + margin-right: 3.7rem; +} +.mr-\[2\.9rem\]{ + margin-right: 2.9rem; +} +.mr-\[3\.8rem\]{ + margin-right: 3.8rem; +} +.ml-\[3\.5rem\]{ + margin-left: 3.5rem; +} +.ml-\[3\.6rem\]{ + margin-left: 3.6rem; +} +.ml-\[3\.7rem\]{ + margin-left: 3.7rem; +} +.ml-\[3\.75rem\]{ + margin-left: 3.75rem; +} +.mr-\[2\.75rem\]{ + margin-right: 2.75rem; +} +.mr-\[2\.74rem\]{ + margin-right: 2.74rem; +} +.ml-\[2\.6rem\]{ + margin-left: 2.6rem; +} +.ml-\[4\.25rem\]{ + margin-left: 4.25rem; +} +.mr-\[3\.25rem\]{ + margin-right: 3.25rem; +} +.mr-\[13rem\]{ + margin-right: 13rem; +} +.mr-\[14rem\]{ + margin-right: 14rem; +} +.mr-\[13\.5rem\]{ + margin-right: 13.5rem; +} .block{ display: block; } @@ -14295,15 +14432,15 @@ html{ .h-\[83rem\]{ height: 83rem; } +.h-auto{ + height: auto; +} .h-full{ height: 100%; } .h-screen{ height: 100vh; } -.h-auto{ - height: auto; -} .max-h-\[20rem\]{ max-height: 20rem; } @@ -14316,12 +14453,6 @@ html{ .max-h-\[90vh\]{ max-height: 90vh; } -.max-h-32{ - max-height: 8rem; -} -.max-h-\[70vh\]{ - max-height: 70vh; -} .min-h-\[15rem\]{ min-height: 15rem; } @@ -14346,9 +14477,6 @@ html{ .min-h-screen{ min-height: 100vh; } -.min-h-\[70vh\]{ - min-height: 70vh; -} .w-1\/5{ width: 20%; } @@ -14397,6 +14525,75 @@ html{ .w-full{ width: 100%; } +.w-\[4rem\]{ + width: 4rem; +} +.w-\[6rem\]{ + width: 6rem; +} +.w-\[5rem\]{ + width: 5rem; +} +.w-\[2\.5rem\]{ + width: 2.5rem; +} +.w-\[3rem\]{ + width: 3rem; +} +.w-\[3\.5rem\]{ + width: 3.5rem; +} +.w-\[4\.2rem\]{ + width: 4.2rem; +} +.w-\[6\.2rem\]{ + width: 6.2rem; +} +.w-\[7\.2rem\]{ + width: 7.2rem; +} +.w-\[7rem\]{ + width: 7rem; +} +.w-\[6\.9rem\]{ + width: 6.9rem; +} +.w-\[10rem\]{ + width: 10rem; +} +.w-\[16rem\]{ + width: 16rem; +} +.w-\[6\.4rem\]{ + width: 6.4rem; +} +.w-\[3\.2rem\]{ + width: 3.2rem; +} +.w-\[3\.7rem\]{ + width: 3.7rem; +} +.w-\[18rem\]{ + width: 18rem; +} +.w-\[17rem\]{ + width: 17rem; +} +.w-\[17\.2rem\]{ + width: 17.2rem; +} +.w-\[17\.1rem\]{ + width: 17.1rem; +} +.w-\[6\.5rem\]{ + width: 6.5rem; +} +.w-\[5\.2rem\]{ + width: 5.2rem; +} +.w-\[2\.75rem\]{ + width: 2.75rem; +} .min-w-\[1\.5rem\]{ min-width: 1.5rem; } @@ -14409,6 +14606,9 @@ html{ .min-w-\[6rem\]{ min-width: 6rem; } +.min-w-\[70vw\]{ + min-width: 70vw; +} .min-w-full{ min-width: 100%; } @@ -14416,9 +14616,6 @@ html{ min-width: -moz-max-content; min-width: max-content; } -.min-w-\[70vw\]{ - min-width: 70vw; -} .max-w-6xl{ max-width: 72rem; } @@ -14437,6 +14634,9 @@ html{ .max-w-\[40rem\]{ max-width: 40rem; } +.max-w-\[70vw\]{ + max-width: 70vw; +} .max-w-\[8rem\]{ max-width: 8rem; } @@ -14450,15 +14650,6 @@ html{ .max-w-xl{ max-width: 36rem; } -.max-w-\[120rem\]{ - max-width: 120rem; -} -.max-w-\[100rem\]{ - max-width: 100rem; -} -.max-w-\[70vw\]{ - max-width: 70vw; -} .flex-1{ flex: 1 1 0%; } @@ -14719,6 +14910,10 @@ html{ .border-transparent{ border-color: transparent; } +.border-cyan-600{ + --tw-border-opacity: 1; + border-color: rgb(8 145 178 / var(--tw-border-opacity)); +} .border-opacity-40{ --tw-border-opacity: 0.4; } @@ -14757,6 +14952,10 @@ html{ --tw-bg-opacity: 1; background-color: rgb(39 39 42 / var(--tw-bg-opacity)); } +.bg-red-400{ + --tw-bg-opacity: 1; + background-color: rgb(248 113 113 / var(--tw-bg-opacity)); +} .fill-red-400{ fill: #f87171; } @@ -14832,6 +15031,54 @@ html{ padding-top: 1.5rem; padding-bottom: 1.5rem; } +.py-\[2rem\]{ + padding-top: 2rem; + padding-bottom: 2rem; +} +.px-\[2rem\]{ + padding-left: 2rem; + padding-right: 2rem; +} +.px-\[4rem\]{ + padding-left: 4rem; + padding-right: 4rem; +} +.px-\[1rem\]{ + padding-left: 1rem; + padding-right: 1rem; +} +.px-\[4\.1rem\]{ + padding-left: 4.1rem; + padding-right: 4.1rem; +} +.px-\[4\.3rem\]{ + padding-left: 4.3rem; + padding-right: 4.3rem; +} +.px-\[4\.2rem\]{ + padding-left: 4.2rem; + padding-right: 4.2rem; +} +.px-\[3rem\]{ + padding-left: 3rem; + padding-right: 3rem; +} +.px-\[2\.5rem\]{ + padding-left: 2.5rem; + padding-right: 2.5rem; +} +.px-\[2\.2rem\]{ + padding-left: 2.2rem; + padding-right: 2.2rem; +} +.px-\[2\.3rem\]{ + padding-left: 2.3rem; + padding-right: 2.3rem; +} +.px-\[2\.4rem\]{ + padding-left: 2.4rem; + padding-right: 2.4rem; +} .pb-4{ padding-bottom: 1rem; } @@ -14990,6 +15237,10 @@ html{ --tw-text-opacity: 1; color: rgb(161 161 170 / var(--tw-text-opacity)); } +.text-cyan-600{ + --tw-text-opacity: 1; + color: rgb(8 145 178 / var(--tw-text-opacity)); +} .underline{ text-decoration-line: underline; } diff --git a/resources/views/components/keyboard.blade.php b/resources/views/components/keyboard.blade.php new file mode 100644 index 0000000..e49cdbe --- /dev/null +++ b/resources/views/components/keyboard.blade.php @@ -0,0 +1,19 @@ +@props(['keys']) +@php + $layout = [ + 0 => ['ESC' => ['ESC'],'F1' => ['F1', 'ml-[2.5rem] w-[2.5rem]'],'F2' => ['F2'],'F3' => ['F3'],'F4' => ['F4'],'F5' => ['F5', 'ml-[1rem] w-[2.5rem]'],'F6' => ['F6'],'F7' => ['F7'],'F8' => ['F8'],'F9' => ['F9', 'ml-[1rem] w-[2.5rem]'],'F10' => ['F10'],'F11' => ['F11'],'F12' => ['F12'], 'DRUCK' => ['DRUCK', 'ml-[1rem] w-[3rem] text-sm'], 'ROLLEN' => ['ROLLEN', 'w-[3rem] text-sm'], 'PAUSE' => ['PAUSE', 'w-[3rem] text-sm'], 'CAL' => ['CAL', 'ml-[1rem] w-[2.5rem]'], 'SPEAKER' => ['🔈'], 'SPEAKER_LOW' => ['🔉'], 'SPEAKER_HIGH' => ['🔊']], + 1 => ['^' => ['^'], '1' => ['1'], '2' => ['2'], '3' => ['3'], '4' => ['4'], '5' => ['5'], '6' => ['6'], '7' => ['7'], '8' => ['8'], '9' => ['9'], '0' => ['0'], 'ß' => ['ß'], '´' => ['´'], 'BACKSPACE' => ['←', 'w-[4.2rem]'], 'EINFG' => ['EINFG', 'ml-[1rem] w-[3rem] text-sm'], 'POS1' => ['POS1', 'w-[3rem] text-sm'], 'BILD▲' => ['BILD▲', 'w-[3rem] text-sm'], 'NUM' => ['NUM', 'ml-[1rem] w-[2.5rem]'], 'NUM÷' => ['÷'], 'NUM*' => ['*'], 'NUM-' => ['-']], + 2 => ['TAB' => ['⇄', 'w-[3.2rem]'], 'Q' => ['Q'], 'W' => ['W'], 'E' => ['E'], 'R' => ['R'], 'T' => ['T'], 'Z' => ['Z'], 'U' => ['U'], 'I' => ['I'], 'O' => ['O'], 'P' => ['P'], 'Ü' => ['Ü'], '+' => ['+'], 'RETURN' => ['↵', 'w-[3.5rem]'], 'ENTF' => ['ENTF', 'ml-[1rem] w-[3rem] text-sm'], 'ENDE' => ['ENDE', 'w-[3rem] text-sm'], 'BILD▼' => ['BILD▼', 'w-[3rem] text-sm'], 'NUM7' => ['7', 'ml-[1rem] w-[2.5rem]'], 'NUM8' => ['8'], 'NUM9' => ['9'], 'NUM+' => ['+']], + 3 => ['CAPS' => ['⇓', 'w-[4.2rem]'], 'A' => ['A'], 'S' => ['S'], 'D' => ['D'], 'F' => ['F'], 'G' => ['G'], 'H' => ['H'], 'J' => ['J'], 'K' => ['K'], 'L' => ['L'], 'Ö' => ['Ö'], 'Ä' => ['Ä'], '#' => ['#', 'mr-[13.5rem] w-[2.5rem]'], 'NUM4' => ['4', 'ml-[1rem] w-[2.5rem]'], 'NUM5' => ['5'], 'NUM6' => ['6', 'mr-[2.74rem] w-[2.5rem]']], + 4 => ['SHIFT' => ['⇧', 'w-[3rem]'], '<' => ['<'], 'Y' => ['Y'], 'X' => ['X'], 'C' => ['C'], 'V' => ['V'], 'B' => ['B'], 'N' => ['N'], 'M' => ['M'], ',' => [','], '.' => ['.'], '-' => ['-'], 'RSHIFT' => ['⇧', 'w-[6.5rem]'], 'UP' => ['▲', 'mr-[3.25rem] ml-[4.25rem] w-[3rem]'], 'NUM1' => ['1', 'ml-[1rem] w-[2.5rem]'], 'NUM2' => ['2'], 'NUM3' => ['3'], 'NUM↵' => ['↵']], + 5 => ['CTRL' => ['CTRL', 'w-[3rem]'], 'HOME' => ['⌘', 'w-[3rem]'], 'ALT' => ['ALT', 'w-[3rem]'], 'SPACE' => ['SPACE', 'w-[17.2rem]'], 'ALTGR' => ['ALTGR', 'w-[3rem]'], 'RHOME' => ['⌘', 'w-[3rem]'], 'FN' => ['FN', 'w-[3rem]'], 'RCTRL' => ['CTRL', 'w-[3rem]'], 'LEFT' => ['◀︎', 'ml-[1rem] w-[3rem]'], 'DOWN' => ['▼', 'w-[3rem]'], 'RIGHT' => ['▶', 'w-[3rem]'], 'NUM0' => ['0', 'ml-[1rem] w-[5.2rem]'], 'NUM.' => ['.', 'mr-[2.75rem] w-[2.5rem]']], + ] +@endphp +@foreach($layout as $row) +
+ @foreach($row as $dbString => $key) + {{ $key[0] }} + @endforeach +
+@endforeach \ No newline at end of file diff --git a/resources/views/components/layout.blade.php b/resources/views/components/layout.blade.php index 92b4d90..688e61a 100644 --- a/resources/views/components/layout.blade.php +++ b/resources/views/components/layout.blade.php @@ -37,7 +37,7 @@ -
@@ -49,7 +49,7 @@
-

{{ env('APP_NAME') }}

+

{{ env('APP_NAME') }}

{{ env('APP_TITLE') }}

diff --git a/resources/views/components/layout/breadcrumb.blade.php b/resources/views/components/layout/breadcrumb.blade.php index ff51566..6ca833d 100644 --- a/resources/views/components/layout/breadcrumb.blade.php +++ b/resources/views/components/layout/breadcrumb.blade.php @@ -1,6 +1,6 @@ @unless ($breadcrumbs->isEmpty()) -
' + + '