Files
2026-06-25 21:26:53 +00:00

163 lines
5.5 KiB
HTML
Executable File

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>ESCAPE FROM TARKOV COMPANION — Quests</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Correct stylesheet include -->
<link rel="stylesheet" href="styles.css" />
<!-- Page-specific overrides (only affect this page) -->
<style>
/* Make the quest card a full-width panel on this page only */
.quests .quest-card.trader-card { max-width: 100%; }
/* Title spacing (center is already in .page-title) */
.quests .page-title { margin-bottom: 1rem; }
/* Objectives: compact, no default list indentation */
.quests .quest-objectives {
list-style: none;
padding-left: 0;
display: flex;
flex-direction: column;
gap: 6px;
}
.quests .quest-objective {
padding: 4px 0;
border-left: 2px solid rgba(0,255,102,0.18);
padding-left: 10px;
}
/* Meta row (title + wiki button) visual rhythm */
.quests .quest-meta {
display: flex;
align-items: center;
gap: 10px;
margin: 8px 0 6px;
}
.quests .quest-meta .btn { margin-left: auto; }
/* Two-column layout on desktop (objectives left, rewards right) */
@media (min-width: 900px) {
.quests .quest-card.trader-card {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 18px;
}
.quests .quest-meta { grid-column: 1 / -1; }
.quests .quest-objectives { grid-column: 1; }
.quests .quest-rewards { grid-column: 2; align-self: start; }
}
/* Optional: ensure the alt-matches block shows as a rounded panel in your theme */
.quest-alt-matches[hidden] { display: none !important; }
/* ====== NEW: Match Price Watch input look (padding/width) ====== */
.quests .quest-toolbar input[type="search"] {
padding: .45rem .6rem; /* same feel as pricewatch inputs */
}
/* Center the search input and button on the Quests page */
.quests .quest-toolbar {
justify-content: center; /* centers children in the flex row from styles.css */
}
/* Optional: keep the status from crowding the button a bit */
.quests #questStatus {
margin-left: 8px;
}
</style>
</head>
<body>
<!-- ======= TOP BAR ======= -->
<header class="topbar">
<a class="logo" href="index.html">ESCAPE FROM TARKOV COMPANION</a>
<!-- Hamburger (mobile) -->
<button class="nav-toggle" type="button" aria-controls="primary-nav" aria-expanded="false"
aria-label="Toggle navigation">
<span class="nav-toggle__bar" aria-hidden="true"></span>
<span class="nav-toggle__bar" aria-hidden="true"></span>
<span class="nav-toggle__bar" aria-hidden="true"></span>
</button>
<!-- Primary nav -->
<nav class="main-nav" id="primary-nav" aria-label="Primary navigation">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="goons.html">Goons</a></li>
<li><a href="maps.html">Maps</a></li>
<li><a href="quests.html" aria-current="page">Quests</a></li>
<li><a href="ammo.html">Ammo</a></li>
<li><a href="traders.html">Traders</a></li>
<li><a href="pricewatch.html">Price Watch</a></li>
<li><a href="crafts.html">Craft Calculator</a></li>
<li><a href="https://tarkovgunsmith.com/ballistics_simulator" target="_blank" rel="noopener">Ballistics Simulator</a></li>
<li><a href="https://tarkov-market.com/" target="_blank" rel="noopener noreferrer">Flea Market</a></li>
<li><a href="https://escapefromtarkov.fandom.com/wiki/Escape_from_Tarkov_Wiki"
target="_blank" rel="noopener noreferrer">Wiki</a></li>
</ul>
</nav>
</header>
<!-- ======= PAGE CONTENT ======= -->
<main class="content">
<section class="quests" aria-labelledby="quest-title">
<h1 id="quest-title" class="page-title">Quest Search</h1>
<!-- Search toolbar -->
<div class="quest-toolbar trader-toolbar">
<input
id="questInput"
type="search"
size="28"
placeholder="Type a quest name (e.g., Living High is Not a Crime)"
aria-label="Quest name">
<button id="questBtn" class="btn" type="button">Search</button>
<span id="questStatus" class="status">Waiting to search…</span>
</div>
<!-- “Other matches” list (populated by JS when there are multiple hits) -->
<div id="questAltMatches" class="quest-alt-matches" hidden></div>
<!-- Main results (the quest card is rendered here) -->
<div id="questResults"
class="quest-results grid-root"
role="region"
aria-live="polite"></div>
<p class="small-muted" style="text-align:center; margin-top:1rem;">
<!--Quest data is served from a local cache file (<code>/var/www/html/quests.json</code>).-->
</p>
<noscript>
<p class="error">JavaScript is required to search and display quest details.</p>
</noscript>
</section>
</main>
<!-- ======= HAMBURGER MENU SCRIPT ======= -->
<script>
(function () {
const btn = document.querySelector('.nav-toggle');
const nav = document.getElementById('primary-nav');
if (btn && nav) {
btn.addEventListener('click', () => {
const open = btn.getAttribute('aria-expanded') === 'true';
btn.setAttribute('aria-expanded', String(!open));
nav.classList.toggle('is-open', !open);
document.body.classList.toggle('nav-open', !open);
});
}
})();
</script>
<!-- Clean quest search (no guide-images code) -->
<script src="quest-search-local.js?v=clean-1.0.3"></script>
</body>
</html>