<%- include("../base/header", { title: "Home", session }) %>

<div class="row">
	<div class="col">
		<h1>EUS</h1>
		<h3>EUS is an approval based server for hosting media and screenshots.</h3>
		<div class="row mt-3">
			<div class="col">
				<a class="btn btn-lg btn-primary me-2" href="mailto:admin+eusaccess@eusv.net">Request Access</a>
				<a class="btn btn-lg btn-secondary" href="/account/login">Login</a>
			</div>
		</div>

		<div id="carousel" class="carousel slide border mt-3">
			<div class="carousel-indicators">
				<button type="button" data-bs-target="#carousel" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
				<button type="button" data-bs-target="#carousel" data-bs-slide-to="1" aria-label="Slide 2"></button>
				<button type="button" data-bs-target="#carousel" data-bs-slide-to="2" aria-label="Slide 3"></button>
			</div>			
			<div class="carousel-inner">
				<div class="carousel-item active">
					<img src="/img/scroller-1.png" class="d-block w-100" alt="Account Dashboard">
				</div>
				<div class="carousel-item">
					<img src="/img/scroller-2.png" class="d-block w-100" alt="API Key Management">
				</div>
				<div class="carousel-item">
					<img src="/img/scroller-1.png" class="d-block w-100" alt="Account Dashboard">
				</div>
			</div>
			<button class="carousel-control-prev" type="button" data-bs-target="#carousel" 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="#carousel" data-bs-slide="next">
				<span class="carousel-control-next-icon" aria-hidden="true"></span>
				<span class="visually-hidden">Next</span>
			</button>
		</div>
	</div>
</div>

<%- include("../base/footer") %>