ai-adventure-labs/server/frontend/pages/index.html

48 lines
3.2 KiB
HTML

<center>
<!-- <h1>Добро пожаловать</h1> -->
<div id="carouselExampleDark" class="carousel carousel-dark slide">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner" style="text-shadow: #000 5px 0 10px;">
<div class="carousel-item active" data-bs-interval="10000">
<img id="main_img1" src="/assets/hello/1.png" class="d-block w-100 card-img" alt="...">
<div class="carousel-caption d-none d-md-block">
<h5 style="color: white;" class="translate" id="intro-1">Welcome to Adventure AI Labs!</h5>
<p style="color: white;" class="translate" id="description-1">Embark on an unforgettable adventure with your favorite characters and friends! Visit familiar and unfamiliar locations..</p>
<button onclick="fl.go('/connect');" type="button" class="btn btn-outline-light btn-card translate" id="button-1"><i class="fas fa-users"></i> Start the adventure</button>
<div class="centered-el"></div>
</div>
</div>
<div class="carousel-item" data-bs-interval="2000">
<img id="main_img2" src="/assets/hello/2.png" class="d-block w-100 card-img" alt="...">
<div class="carousel-caption d-none d-md-block">
<h5 style="color: white;" class="translate" id="intro-2">Become a gamemaster</h5>
<p style="color: white;" class="translate" id="description-2">Or you can become the gamemaster of the party and lead the plot of the characters and players like a creator god who tells an amazing story.</p>
<button onclick="fl.go('/documentation');" type="button" class="btn btn-outline-light btn-card translate" id="button-2"><i class="fas fa-book"></i> Documentation</button>
<div class="centered-el"></div>
</div>
</div>
<div class="carousel-item">
<img id="main_img3" src="/assets/hello/3.png" class="d-block w-100 card-img" alt="...">
<div class="carousel-caption d-none d-md-block">
<h5 style="color: white;" class="translate" id="intro-3">Needed a more gold..</h5>
<p style="color: white;" class="translate" id="description-3">The project exists purely on a voluntary basis and the enthusiasm of the author, so if you want to help financially, then it will be very cool (:</b></p>
<button onclick="fl.go('/donation');" type="button" class="btn btn-outline-light btn-card translate" id="button-3"><i class="fab fa-bitcoin"></i> Donate</button>
<div class="centered-el"></div>
</div>
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleDark" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleDark" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</center>