Save user flights

This commit is contained in:
2026-04-05 21:38:36 +10:00
parent fcbf021af7
commit 8da717a400
10 changed files with 273 additions and 51 deletions
@@ -0,0 +1,51 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\DB;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
private array $timezones = [
176 => 'Antarctica/Macquarie',
1012 => 'America/Iqaluit',
1129 => 'America/Iqaluit',
1153 => 'America/Iqaluit',
9241 => 'Asia/Anadyr',
9245 => 'Asia/Anadyr',
9364 => 'Europe/Moscow',
9365 => 'Asia/Krasnoyarsk',
11018 => 'Asia/Ulaanbaatar',
11019 => 'Asia/Ulaanbaatar',
];
public function up(): void
{
// 1. Populate timezones for the specific airports that were missing them
foreach ($this->timezones as $id => $timezone) {
DB::table('airports')
->where('id', $id)
->whereNull('timezone')
->update(['timezone' => $timezone]);
}
// 2. Make the timezone column non-nullable
Schema::table('airports', function (Blueprint $table) {
$table->string('timezone')->nullable(false)->change();
});
}
public function down(): void
{
// 1. Revert the column back to nullable first
Schema::table('airports', function (Blueprint $table) {
$table->string('timezone')->nullable()->change();
});
// 2. Null out only the rows we populated
DB::table('airports')
->whereIn('id', array_keys($this->timezones))
->update(['timezone' => null]);
}
};
+15
View File
@@ -13,6 +13,21 @@
}
a {
color: var(--accent);
text-decoration: none;
}
a:visited {
color: var(--accent);
}
a:hover {
text-decoration: underline;
text-decoration-color: rgba(56, 189, 248, 0.4);
text-underline-offset: 3px;
}
.glass {
background: rgba(17, 24, 39, 0.2); /* --surface at 60% */
-webkit-backdrop-filter: blur(12px) saturate(180%);
@@ -0,0 +1,33 @@
<!-- AppLink.vue -->
<script setup lang="ts">
import { Link } from "@inertiajs/vue3";
defineProps<{
href: string;
}>();
</script>
<template>
<Link :href="href" class="app-link">
<slot />
</Link>
</template>
<style scoped>
.app-link {
color: var(--accent);
text-decoration: none;
transition: color 0.15s ease, text-decoration-color 0.15s ease;
text-underline-offset: 3px;
}
.app-link:visited {
color: var(--accent);
}
.app-link:hover {
color: var(--accent-soft);
text-decoration: underline;
text-decoration-color: rgba(56, 189, 248, 0.4);
}
</style>
@@ -15,8 +15,7 @@ defineProps<{
<style scoped>
.glass-box {
width: 50%;
min-height: 50dvh;
width: clamp(280px, 100%, 700px);
gap: 1em;
padding: 2em;
}
@@ -32,4 +31,11 @@ p {
opacity: 0.7;
margin-bottom: 1rem;
}
@media (max-width: 600px) {
.glass-box {
padding: 1.25em;
min-height: unset;
}
}
</style>
@@ -1,54 +1,170 @@
<script setup lang="ts">
import {Link} from "@inertiajs/vue3";
import { Link } from "@inertiajs/vue3";
import { usePage } from '@inertiajs/vue3'
import type { SharedProps } from '@/Types/types'
import { ref } from 'vue'
const props = usePage<SharedProps>().props
const menuOpen = ref(false)
</script>
<template>
<header class="glass">
<h1>FlightsGoneBy</h1>
<nav>
<Link v-if="!props.auth.user" :href="route('login')">Log In</Link>
<Link v-if="!props.auth.user" :href="route('register')">Register</Link>
<Link v-if="props.auth.user">Welcome {{props.auth.user.name}}</Link>
<Link href="/" class="brand">FlightsGoneBy</Link>
<!-- Desktop nav -->
<nav class="nav-desktop">
<template v-if="!props.auth.user">
<Link :href="route('login')" class="nav-link">Log In</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight">Register</Link>
</template>
<span v-else class="nav-link nav-link--greeting">Welcome, {{ props.auth.user.name }}</span>
</nav>
<!-- Hamburger (mobile only) -->
<button class="hamburger" :class="{ open: menuOpen }" @click="menuOpen = !menuOpen" aria-label="Toggle menu">
<span /><span /><span />
</button>
<!-- Mobile drawer -->
<Transition name="slide">
<nav v-if="menuOpen" class="nav-mobile" @click="menuOpen = false">
<template v-if="!props.auth.user">
<Link :href="route('login')" class="nav-link">Log In</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight">Register</Link>
</template>
<span v-else class="nav-link nav-link--greeting">Welcome, {{ props.auth.user.name }}</span>
</nav>
</Transition>
</header>
</template>
<style scoped>
header {
display:flex;
align-content: center;
justify-content: center;
flex: 0 0 5dvh;
min-height: 40px; /* prevents it getting too tiny */
display: flex;
align-items: center;
padding: 0 1rem;
flex: 0 0 5dvh;
min-height: 48px;
padding: 0 1.25rem;
position: relative;
z-index: 10;
}
header h1 {
flex-basis: 25%;
margin: 0;
font-size: 1.5rem;
.brand {
margin-right: auto;
font-size: 1.25rem;
font-weight: 700;
letter-spacing: 0.08em;
color: var(--accent);
text-decoration: none;
}
/* Shared nav link base */
.nav-link {
display: inline-flex;
align-items: center;
padding: 0.3em 0.75em;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.04em;
text-decoration: none;
color: var(--text);
border-radius: 4px;
transition: color 0.15s ease, background 0.15s ease;
}
.nav-link:visited {
color: var(--text);
}
.nav-link:hover {
color: var(--accent);
background: rgba(56, 189, 248, 0.07);
}
/* Highlighted CTA-style link */
.nav-link--highlight {
border: 1px solid rgba(56, 189, 248, 0.35);
color: var(--accent);
}
.nav-link--highlight:visited {
color: var(--accent);
}
.nav-link--highlight:hover {
background: rgba(56, 189, 248, 0.12);
}
.nav-link--greeting {
opacity: 0.7;
font-size: 0.85rem;
cursor: default;
}
/* Desktop nav */
.nav-desktop {
display: flex;
align-items: center;
gap: 0.5rem;
}
/* Hamburger */
.hamburger {
display: none;
flex-direction: column;
justify-content: center;
gap: 5px;
width: 36px;
height: 36px;
padding: 6px;
background: none;
border: none;
cursor: pointer;
}
header nav{
flex-basis: 75%;
display: flex;
align-content: center;
justify-content: flex-end;
padding: 0 1em;
gap: 1rem;
.hamburger span {
display: block;
width: 100%;
height: 1.5px;
background: var(--text);
border-radius: 2px;
transition: transform 0.2s ease, opacity 0.2s ease;
transform-origin: center;
}
header nav a {
height: 100%;
.hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
/* Mobile nav drawer */
.nav-mobile {
position: absolute;
top: 100%;
left: 0;
right: 0;
display: flex;
flex-direction: column;
gap: 0.25rem;
padding: 0.75rem 1rem;
background: var(--bg);
border-bottom: 1px solid rgba(56, 189, 248, 0.1);
z-index: 20;
}
.slide-enter-from,
.slide-leave-to {
opacity: 0;
transform: translateY(-6px);
}
.slide-enter-active,
.slide-leave-active {
transition: opacity 0.15s ease, transform 0.15s ease;
}
@media (max-width: 600px) {
.nav-desktop { display: none; }
.hamburger { display: flex; }
}
</style>
@@ -78,13 +78,11 @@
/* In your component <style> or global CSS */
.radar-bg {
position: fixed;
inset: 0;
/* just a normal flow wrapper */
position: relative;
min-height: 100dvh;
background: var(--bg);
overflow: hidden;
z-index: 0;
}
.radar-svg {
position: absolute;
inset: 0;
+4
View File
@@ -0,0 +1,4 @@
FROM ubuntu:latest
LABEL authors="josh"
ENTRYPOINT ["top", "-b"]
+14 -16
View File
@@ -16,13 +16,13 @@ router.on('success', () => {
<template>
<Radar>
<div class="layoutContainer">
<MainHeader />
<MainHeader :key="transitionKey" />
<Transition name="fade" mode="out-in">
<main id="pageContainer" :key="transitionKey">
<slot />
</main>
</Transition>
<MainFooter />
<MainFooter :key="transitionKey" />
</div>
</Radar>
</template>
@@ -34,29 +34,27 @@ router.on('success', () => {
min-height: 100dvh;
background: var(--bg);
color: var(--text);
overflow-y: auto;
}
header,
footer {
flex: 0 0 5dvh;
min-height: 3rem;
}
main {
flex: 1 0 90dvh;
min-height: 0;
flex: 1 1 auto;
padding: 1rem;
background:transparent;
display:flex;
background: transparent;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.fade-enter-from,
.fade-leave-to {
opacity: 0;
transform: translateY(10px);
}
.fade-leave-to { opacity: 0; }
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.3s ease, transform 0.3s ease;
}
.fade-leave-active { transition: opacity 0.2s ease; }
</style>
+1 -1
View File
@@ -9,7 +9,7 @@ import vuetify from './plugins/vuetify';
import '@mdi/font/css/materialdesignicons.css'
import 'flag-icons/css/flag-icons.min.css'
const appName = import.meta.env.VITE_APP_NAME || 'Laravel';
const appName = document.querySelector('meta[name="app-name"]')?.getAttribute('content') || 'Laravel';
createInertiaApp({
title: (title) => `${title} | ${appName}`,
+1
View File
@@ -4,6 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<meta name="app-name" content="{{ config('app.name') }}">
<title inertia>{{ config('app.name', 'Laravel') }}</title>
<!-- Fonts -->