mirror of
https://github.com/OpenSquawk/OpenSquawk
synced 2026-08-06 09:16:26 +08:00
refactor: replace img tags with NuxtImg
This commit is contained in:
@@ -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"
|
||||
|
||||
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user