152 lines
5.4 KiB
HTML
152 lines
5.4 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8" />
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|||
|
|
<title>freeTTRPG</title>
|
|||
|
|
<link rel="stylesheet" href="style.css" />
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<header>
|
|||
|
|
<div class="header-content">
|
|||
|
|
<div class="project-name"><a href="index.html">freeTTRPG</a></div>
|
|||
|
|
<button class="burger-menu" onclick="toggleMenu()">☰</button>
|
|||
|
|
<ul class="menu">
|
|||
|
|
<li><a href="#section1">The Game</a></li>
|
|||
|
|
<li><a href="#section2">Our Vision</a></li>
|
|||
|
|
<li><a href="#section3">Copyright</a></li>
|
|||
|
|
<li><a href="#section4">Platform</a></li>
|
|||
|
|
<li><a href="#section5">Join Us</a></li>
|
|||
|
|
<li><a href="#section6">Source Code</a></li>
|
|||
|
|
<li><a href="#section7">Game Assets</a></li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
</header>
|
|||
|
|
|
|||
|
|
<article>
|
|||
|
|
<section id="section1">
|
|||
|
|
<h1>The Game</h1>
|
|||
|
|
<p>
|
|||
|
|
Tired of the commercialization of tabletop role-playing games, we
|
|||
|
|
decided to take matters into our own hands. We're creating an
|
|||
|
|
open-source, community-driven TTRPG project that puts creativity and
|
|||
|
|
freedom back in the hands of players.
|
|||
|
|
</p>
|
|||
|
|
<img src="assets/game.png" alt="current game version" />
|
|||
|
|
<p>Current game version</p>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
<section id="section2">
|
|||
|
|
<h1>Our Vision</h1>
|
|||
|
|
<p>
|
|||
|
|
Our project offers a game engine with a solid foundation of basic
|
|||
|
|
content and story packs to get you started. But that's just the
|
|||
|
|
beginning. We're also providing a powerful content creator tool that
|
|||
|
|
allows users to craft their own custom content packs. With this tool,
|
|||
|
|
you'll be able to create your own rules, characters, items, spells,
|
|||
|
|
attacks, and much more.
|
|||
|
|
</p>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
<section id="section3">
|
|||
|
|
<h1>Copyright</h1>
|
|||
|
|
<p>
|
|||
|
|
The best part? Everything you create with our tool is yours to own and
|
|||
|
|
control. We won't claim any copyright or ownership over your
|
|||
|
|
creations. You're free to share, modify, or use your content as you
|
|||
|
|
see fit.
|
|||
|
|
</p>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
<section id="section4">
|
|||
|
|
<h1>Community-Driven Platform</h1>
|
|||
|
|
<p>
|
|||
|
|
We're building a platform where users can share their content packs
|
|||
|
|
with the community. While sharing is encouraged, it's not required.
|
|||
|
|
You can keep your creations private or share them with the world – the
|
|||
|
|
choice is yours.
|
|||
|
|
</p>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
<section id="section5">
|
|||
|
|
<h1>Join Us</h1>
|
|||
|
|
<p>
|
|||
|
|
We're excited to share freeTTRPG with the world and hope you'll join
|
|||
|
|
us on this journey. Together, let's create a TTRPG ecosystem that's
|
|||
|
|
open, inclusive, and driven by the passion of its community.
|
|||
|
|
</p>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
<section id="section6">
|
|||
|
|
<h1>Our Code</h1>
|
|||
|
|
<a href="download.html" target="_blank"
|
|||
|
|
><button type="button">Download</button></a
|
|||
|
|
>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
<section id="section7">
|
|||
|
|
<h1>Our Game Assets</h1>
|
|||
|
|
<h1>Our charackters</h1>
|
|||
|
|
<div class="cards">
|
|||
|
|
<a href="charackters/gigachad.html" class="card">
|
|||
|
|
<img src="assets/gigachad.png" alt="Gigachad" />
|
|||
|
|
<h3>Gigachad</h3>
|
|||
|
|
<p>Our test human paladin on maximum level</p>
|
|||
|
|
</a>
|
|||
|
|
<a href="charackters/tharok.html" class="card">
|
|||
|
|
<img src="assets/tharok.png" alt="Tharok" />
|
|||
|
|
<h3>Tharok</h3>
|
|||
|
|
<p>Our test human fighter on starting level</p>
|
|||
|
|
</a>
|
|||
|
|
<a href="charackters/bjoern.html" class="card">
|
|||
|
|
<img src="assets/player.png" alt="Blank Card" />
|
|||
|
|
<h3>Björn</h3>
|
|||
|
|
<p>Our test dwarven Mage at starting level</p>
|
|||
|
|
</a>
|
|||
|
|
<a href="charackters/elara.html" class="card">
|
|||
|
|
<img src="assets/player.png" alt="Blank Card" />
|
|||
|
|
<h3>Elara</h3>
|
|||
|
|
<p>Our test elf Ranger at starting level</p>
|
|||
|
|
</a>
|
|||
|
|
<a href="charackters/lyra.html" class="card">
|
|||
|
|
<img src="assets/player.png" alt="Blank Card" />
|
|||
|
|
<h3>Lyra</h3>
|
|||
|
|
<p>Out test tiefling bard at starting level</p>
|
|||
|
|
</a>
|
|||
|
|
</div>
|
|||
|
|
<h1>Our textures</h1>
|
|||
|
|
<div class="cards">
|
|||
|
|
<a href="index.html" class="card">
|
|||
|
|
<img src="assets/water.png" alt="Water Texture" />
|
|||
|
|
<h3>Water</h3>
|
|||
|
|
<p>Our water texture that is incomplete</p>
|
|||
|
|
</a>
|
|||
|
|
<a href="index.html" class="card">
|
|||
|
|
<img src="assets/grass.png" alt="Grass Texture" />
|
|||
|
|
<h3>Grass</h3>
|
|||
|
|
<p>Our grass texture that is incomplete</p>
|
|||
|
|
</a>
|
|||
|
|
<a href="index.htmlm" class="card">
|
|||
|
|
<img src="assets/sand.png" alt="Blank Card" />
|
|||
|
|
<h3>sand</h3>
|
|||
|
|
<p>Our sand texture that is incomplete</p>
|
|||
|
|
</a>
|
|||
|
|
<!-- To create new cards use this template
|
|||
|
|
<a href="https://www.example5.com" class="card">
|
|||
|
|
<img src="assets/blank.png" alt="Blank Card" />
|
|||
|
|
<h3>Blank Card 5</h3>
|
|||
|
|
<p>Description for Blank Card 5</p>
|
|||
|
|
</a> -->
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
</article>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
function toggleMenu() {
|
|||
|
|
const menu = document.querySelector(".menu");
|
|||
|
|
menu.classList.toggle("active");
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|