99 lines
3.7 KiB
HTML
99 lines
3.7 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Index & Glossary</title>
|
||
<link rel="stylesheet" href="book-page.css">
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<header>
|
||
<h1>CHAPTER</h1>
|
||
<h2>Other Nature <small>(d8 or d12, based upon the context)</small></h2>
|
||
<p><strong>Type:</strong> Fungal / Incorporeal Liquid</p>
|
||
</header>
|
||
|
||
<!-- Section 1: Tripartite Classification (Fungal/Liquid) -->
|
||
<section class="three-column-section">
|
||
|
||
<div class="three-column-list">
|
||
<h3>Fungal</h3>
|
||
<ul>
|
||
<li>Boletus</li>
|
||
<li>Hen</li>
|
||
<li>Honeyshroom</li>
|
||
<li>Morel</li>
|
||
<li>Mucilage</li>
|
||
<li>Mushroom</li>
|
||
<li>Oyster</li>
|
||
<li>Truffle</li>
|
||
<li> </li> <!-- Placeholder for missing data continuity -->
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="three-column-list">
|
||
<h3>Incorporeal Liquid</h3>
|
||
<ul>
|
||
<li>Ash</li>
|
||
<li>Bubble</li>
|
||
<li>Essence</li>
|
||
<li>Gas</li>
|
||
<li>Mirage</li>
|
||
<li>Smoke</li>
|
||
<li>Strand</li>
|
||
<li>Vapor</li>
|
||
<li> </li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="three-column-list">
|
||
<h3>Properties</h3>
|
||
<ul>
|
||
<li>Clot</li>
|
||
<li>Drop</li>
|
||
<li>Extract</li>
|
||
<li>Fluid</li>
|
||
<li>Ichor</li>
|
||
<li>Oil</li>
|
||
<li>Reagent</li>
|
||
<li>Sludge</li>
|
||
<li> </li>
|
||
</ul>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Section 2: Artificial Mineral Plant (Grid Layout) -->
|
||
<h2 style="margin-top: 40px;">Artificial Mineral Plant</h2>
|
||
<div class="mineral-plant-grid">
|
||
|
||
<div class="mineral-column"><strong>1. Chain</strong>
|
||
<ul><li>Core</li><li>Fabric</li><li>Gear</li><li>Leather</li><li>Lens</li><li>Plate</li><li>Propeller</li><li>Rope</li><li>Scrap</li><li>Spring</li><li>Valve</li></ul>
|
||
</div>
|
||
|
||
<div class="mineral-column"><strong>2. Block</strong>
|
||
<ul><li>Charcoal</li><li>Crystal</li><li>Dust</li><li>Fragment</li><li>Gem</li><li>Limestone</li><li>Block</li><li>Salt</li><li>Stele</li><li>Stone</li></ul>
|
||
</div>
|
||
|
||
<div class="mineral-column"><strong>3. Algae</strong>
|
||
<ul><li>Bark</li><li>Bramble</li><li>Flower</li><li>Berry</li><li>Branch</li><li>Fruit</li><li>Plant</li><li>Moss</li><li>Root</li><li>Thorn</li></ul>
|
||
</div>
|
||
|
||
<div class="mineral-column"><strong>1. Block (Restarting structure due to poor extraction)</strong>
|
||
<ul><li>Algae</li><li>Bark</li><li>Crystal</li><li>Bramble</li><li>Flower</li><li>Fruit</li><li>Leaf</li><li>Moss</li><li>Petal</li><li>Stone</li></ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Section 3: Dialogue/Epilogue -->
|
||
<div class="dialogue">
|
||
<p>“This mushroom here? They call it Faery Toadstool.<br>No. It’s not a good idea to pick it.”</p>
|
||
|
||
<hr style="border: none; border-top: 1px solid #ccc; margin: 20px 0;">
|
||
|
||
<div class="signature">
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</body>
|
||
</html> |