initial commit
This commit is contained in:
Executable
+162
@@ -0,0 +1,162 @@
|
||||
|
||||
<!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>
|
||||
Reference in New Issue
Block a user