flightsimulatorplatfrom/OpenSquawk
1
0
Fork 0
mirror of https://github.com/OpenSquawk/OpenSquawk synced 2026-08-08 18:45:33 +08:00
Code Issues Packages Projects Releases Wiki Activity

switch to nuxt-img

Browse Source
This commit is contained in:
itsrubberduck
2025-10-12 16:54:48 +02:00
parent f343d75c50 a0d89a8b87
commit 4898f63f7b
8 changed files with 23 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/pages/api-docs.vue
View File

@@ -91,8 +91,8 @@
class="space-y-6 rounded-3xl border border-white/10 bg-gradient-to-br from-white/10 via-white/5 to-transparent p-8">
<div class="overflow-hidden rounded-2xl border border-white/10 bg-black/40">
<div class="relative aspect-[3/1]">
<img src="/img/learn/missions/full-flight/briefing-weather.png" alt="Weather briefing overview"
class="absolute inset-0 h-full w-full object-cover" />
<NuxtImg src="/img/learn/missions/full-flight/briefing-weather.png" alt="Weather briefing overview"
class="absolute inset-0 h-full w-full object-cover" format="webp" />
</div>
</div>
<header class="space-y-3">

2
app/pages/bridge/index.vue
View File

@@ -32,7 +32,7 @@
<h2 id="bridge-notice-title" class="text-3xl font-semibold leading-tight sm:text-4xl">
Live ATC is still in the works
</h2>
<nuxt-img src="/img/bridge/hangar_sleeping.jpeg" alt="Bridge app screenshot" style="aspect-ratio: 2.7/1;object-fit: cover" class="rounded-2xl border border-white/10 shadow-[0_20px_60px_rgba(4,8,24,0.45)]"/>
<NuxtImg src="/img/bridge/hangar_sleeping.jpeg" alt="Bridge app screenshot" style="aspect-ratio: 2.7/1;object-fit: cover" class="rounded-2xl border border-white/10 shadow-[0_20px_60px_rgba(4,8,24,0.45)]" format="webp" />
<p class="text-sm text-white/75 sm:text-base">
We&rsquo;re actively building this part of the Bridge experience. There isn&rsquo;t a hosted version
yet, but we&rsquo;re lining everything up for launch in the coming weeks and months.

9
app/pages/classroom-introduction.vue
View File

@@ -64,16 +64,17 @@
</div>
<div class="flex flex-col gap-6">
<div class="overflow-hidden rounded-3xl border border-white/10 bg-black/40 shadow-xl shadow-cyan-500/10">
<img
<NuxtImg
src="/img/learn/modules/img14.jpeg"
alt="Pilots reviewing the Classroom mission board"
class="h-56 w-full object-cover"
loading="lazy"
format="webp"
/>
</div>
<div class="rounded-3xl border border-white/10 bg-[#0b1328]/90 p-6 shadow-xl shadow-cyan-500/10">
<div class="flex items-center gap-4">
<img src="/img/learn/instructor.png" alt="Avery, the Classroom instructor" class="h-14 w-14 rounded-2xl border border-cyan-400/40 object-cover" />
<NuxtImg src="/img/learn/instructor.png" alt="Avery, the Classroom instructor" class="h-14 w-14 rounded-2xl border border-cyan-400/40 object-cover" />
<div>
<p class="text-base font-semibold">Avery</p>
<p class="text-sm text-white/60">Your Classroom instructor</p>
@@ -273,7 +274,7 @@
class="relative overflow-hidden rounded-3xl border border-white/10 bg-gradient-to-b from-white/5 via-white/[0.03] to-white/[0.02] shadow-xl shadow-black/30"
>
<div class="relative h-48 w-full overflow-hidden border-b border-white/5 sm:h-56">
<img :src="activeStage.image" :alt="activeStage.imageAlt" class="h-full w-full object-cover" loading="lazy" />
<NuxtImg :src="activeStage.image" :alt="activeStage.imageAlt" class="h-full w-full object-cover" loading="lazy" />
<div class="absolute inset-0 bg-gradient-to-t from-[#080f1f] via-transparent to-transparent"></div>
<div class="absolute bottom-4 left-4 rounded-full bg-[#080f1f]/80 px-3 py-1 text-xs font-semibold uppercase tracking-[0.3em] text-white/80">
Stop {{ stageIndex + 1 }} of {{ stages.length }}
@@ -311,7 +312,7 @@
<div class="rounded-2xl border border-white/10 bg-[#0c162c]/80 p-4 sm:p-5">
<div class="flex items-start gap-4">
<img
<NuxtImg
src="/img/learn/instructor.png"
alt="Avery instructor avatar"
class="h-24 w-24 rounded-2xl border border-cyan-400/40 object-cover"

14
app/pages/classroom.vue
View File

@@ -289,7 +289,7 @@
<div v-if="flightPlanMode==='random'" class="plan-panel">
<div class="plan-summary">
<img :src="currentBriefingArt" alt="Mission hero" class="plan-hero" />
<NuxtImg :src="currentBriefingArt" alt="Mission hero" class="plan-hero" />
<div class="plan-summary-body">
<span class="plan-tag">Auto flight</span>
<div class="plan-callout">{{ displayCallsign(draftPlanScenario?.radioCall, draftPlanScenario) }}</div>
@@ -571,7 +571,7 @@
<div v-else class="plan-panel simbrief-panel">
<div class="simbrief-hero-card">
<img src="/img/learn/missions/full-flight/briefing-hero.png" alt="SimBrief import preview" class="simbrief-hero-art" />
<NuxtImg src="/img/learn/missions/full-flight/briefing-hero.png" alt="SimBrief import preview" class="simbrief-hero-art" format="webp" />
<div class="simbrief-hero-overlay">
<span class="simbrief-tag">SimBrief import</span>
<h3 class="simbrief-hero-title">Load your airline dispatch</h3>
@@ -667,7 +667,7 @@
<div v-else-if="moduleStage==='briefing' && briefingSnapshot" class="module-stage-panel mission-briefing">
<section class="briefing-hero-banner">
<img :src="currentBriefingArt" alt="Mission hero" class="briefing-hero-bg" />
<NuxtImg :src="currentBriefingArt" alt="Mission hero" class="briefing-hero-bg" />
<div class="briefing-hero-content">
<div class="briefing-tag-row">
<span class="plan-tag">Mission briefing</span>
@@ -714,7 +714,7 @@
<div class="briefing-layout">
<div class="briefing-main-grid">
<div class="briefing-card">
<img src="/img/learn/missions/full-flight/briefing-route.png" alt="Route preview" class="briefing-card-art" />
<NuxtImg src="/img/learn/missions/full-flight/briefing-route.png" alt="Route preview" class="briefing-card-art" format="webp" />
<div class="card-title">
<v-icon size="16">mdi-map-marker-path</v-icon>
Flight deck setup
@@ -726,7 +726,7 @@
</ul>
</div>
<div class="briefing-card">
<img src="/img/learn/missions/full-flight/briefing-departure.png" alt="Departure" class="briefing-card-art" />
<NuxtImg src="/img/learn/missions/full-flight/briefing-departure.png" alt="Departure" class="briefing-card-art" format="webp" />
<div class="card-title">
<v-icon size="16">mdi-airplane-takeoff</v-icon>
Departure flow
@@ -739,7 +739,7 @@
</ul>
</div>
<div class="briefing-card">
<img src="/img/learn/missions/full-flight/briefing-arrival.png" alt="Arrival" class="briefing-card-art" />
<NuxtImg src="/img/learn/missions/full-flight/briefing-arrival.png" alt="Arrival" class="briefing-card-art" format="webp" />
<div class="card-title">
<v-icon size="16">mdi-airplane-landing</v-icon>
Arrival setup
@@ -752,7 +752,7 @@
</ul>
</div>
<div class="briefing-card">
<img src="/img/learn/missions/full-flight/briefing-weather.png" alt="Weather" class="briefing-card-art" />
<NuxtImg src="/img/learn/missions/full-flight/briefing-weather.png" alt="Weather" class="briefing-card-art" format="webp" />
<div class="card-title">
<v-icon size="16">mdi-weather-cloudy</v-icon>
Weather snapshot

3
app/pages/feedback.vue
View File

@@ -1,9 +1,10 @@
<template>
<div class="relative min-h-screen bg-[#050914] text-white">
<img
<NuxtImg
src="/img/landing/feedback.jpeg"
alt="Path through a forest"
class="fixed inset-0 h-screen w-full object-cover object-center brightness-[0.55]"
format="webp"
/>
<div class="absolute inset-0 backdrop-blur-sm"/>
<div

2
app/pages/index.vue
View File

@@ -634,7 +634,7 @@
</a>
</div>
</div>
<img src="/img/landing/simulator.jpeg" alt="Runway" class="rounded-lg card w-full object-cover"/>
<NuxtImg src="/img/landing/simulator.jpeg" alt="Runway" class="rounded-lg card w-full object-cover" format="webp" />
</div>
</div>
</section>

6
app/pages/login.vue
View File

@@ -16,8 +16,8 @@
class="mx-auto flex h-full w-full max-w-6xl flex-1 flex-col overflow-hidden sm:py-8 sm:px-8 lg:flex-row lg:items-stretch lg:py-12 lg:pl-0 min-h-0">
<div
class="relative hidden h-full min-h-0 overflow-hidden rounded-3xl border border-white/10 bg-white/5 shadow-2xl lg:flex lg:w-[48%]">
<img :src="img" alt="Guiding lights on a runway"
class="absolute inset-0 h-full w-full object-cover"/>
<NuxtImg :src="img" alt="Guiding lights on a runway"
class="absolute inset-0 h-full w-full object-cover" />
<div class="absolute inset-0 bg-gradient-to-t from-[#050816]/95 via-[#050816]/40 to-transparent"/>
<div class="relative z-10 flex h-full flex-col justify-between p-10">
<div>
@@ -52,7 +52,7 @@
<div class="flex-1 overflow-y-auto px-5 pt-6 pb-10 sm:px-6 md:px-8 lg:pr-4">
<div
class="floating-card relative mb-8 overflow-hidden rounded-3xl border border-white/10 bg-white/5 shadow-2xl lg:hidden">
<img src="/img/landing/runway.jpeg" alt="Guiding lights on a runway" class="h-56 w-full object-cover"/>
<NuxtImg src="/img/landing/runway.jpeg" alt="Guiding lights on a runway" class="h-56 w-full object-cover" format="webp" />
<div
class="absolute inset-x-0 bottom-0 bg-gradient-to-t from-[#050816] via-transparent to-transparent p-6">
<p class="text-xs uppercase tracking-[0.3em] text-white/50">Alpha Access</p>

4
app/pages/present.vue
View File

@@ -60,14 +60,14 @@
</blockquote>
<div v-if="currentSlide.image" class="media" @click.stop>
<img :src="currentSlide.image" :alt="currentSlide.imageAlt || ''" loading="lazy" />
<NuxtImg :src="currentSlide.image" :alt="currentSlide.imageAlt || ''" loading="lazy" />
<p v-if="currentSlide.imageCredit" class="image-caption">{{ currentSlide.imageCredit }}</p>
</div>
<p v-if="currentSlide.note" class="note">{{ currentSlide.note }}</p>
<div v-if="currentSlide.qr" class="qr-wrapper" @click.stop>
<img v-if="qrCode" :src="qrCode" alt="QR code linking to the project" />
<NuxtImg v-if="qrCode" :src="qrCode" alt="QR code linking to the project" provider="none" />
<div v-else class="qr-placeholder">QR code is rendering…</div>
<p>{{ currentSlide.qr }}</p>
</div>