Project-new-web/cs/home.html
2019-04-26 22:29:32 +02:00

202 lines
8.0 KiB
HTML

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/normalize.css">
<link rel="stylesheet" href="../css/master.css">
<link rel="stylesheet" href="../css/bootstrap.css">
<link rel="shortcut icon" href="../favicon.ico" type="image/vnd.microsoft.icon" />
<title>Sincoolka</title>
</head>
<body>
<nav id="overlay" class="overlay">
<div class="navbar-strip">
<div class="navbar-container">
<div class="navbar-grid">
<div class="navbar-grid-col -left">
<h1 class="nav">Sincoolka</h1>
</div>
<div class="navbar-grid-col -right">
<img src="../img/close-menu.svg" alt="close-menu" class="close-btn" id="close-menu">
</div>
</div>
</div>
</div>
<ul>
<div class="container-nav-top">
<li>
<a href="#">DOMŮ</a>
</li>
<li>
<a href="#">KALENDÁŘ</a>
</li>
<li>
<a href="#">AKTUALITY</a>
</li>
<li>
<a href="#">ČLENSTVÍ</a>
</li>
</div>
<div class="container-nav-bottom">
<li>
<a href="#">SEKCE</a>
</li>
<li>
<a href="#">EN</a>
</li>
</div>
</ul>
</nav>
<header>
<div class="navbar-strip">
<div class="navbar-container">
<div class="navbar-grid">
<div class="navbar-grid-col -left">
<a href="#Home"><h2 class="nav">Sin</h2></a>
</div>
<div class="navbar-grid-col -right">
<img src="../img/nav-menu.svg" alt="open-menu" class="menu-btn" id="open-menu">
</div>
</div>
</div>
</div>
</header>
<main>
<div class="home" id="Home">
<div class="fill"></div>
<a href="#About-us" class="arrow-down"><img src="../img/arrow-down.svg" alt="arrow down" class="arrow-down"></a>
</div>
<section class="about" id="About-us">
<h2 class="title">O nás</h2>
<article class="about-us-1">
<h3 class="title">Kdo jsme</h3>
<p class="article">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur.</p>
</article>
<article class="about-us-2">
<h3 class="title">Co děláme</h3>
<p class="article">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur.</p>
</article>
</section>
<section class="gallery-in">
<h2 class="title">Galerie</h2>
<div class="gallery">
<img src="../img/sunset.jpg" alt="Sunset">
</div>
</section>
<section class="team">
<h2 class="title">Tým klubu</h2>
<div class="people">
<section class="member">
<img src="../img/Photo.svg" alt="Photo" class="member-photo">
<h3 class="title">Kateřina Němcová</h3>
<p class="article">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur.</p>
</section>
<section class="member">
<img src="../img/Photo.svg" alt="Photo" class="member-photo">
<h3 class="title">Kateřina Koutová</h3>
<p class="article">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur.</p>
</section>
<section class="member">
<img src="../img/Photo.svg" alt="Photo" class="member-photo">
<h3 class="title">Jiří Kapoun</h3>
<p class="article">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur.</p>
</section>
<section class="member">
<img src="../img/Photo.svg" alt="Photo" class="member-photo">
<h3 class="title">Pavel Valach</h3>
<p class="article">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur.</p>
</section>
</div>
<section class="member-last">
<img src="../img/Photo.svg" alt="Photo" class="member-photo">
<h3 class="title">Marcel Petráň</h3>
<p class="article">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur.</p>
</section>
</section>
<section class="contact-us">
<h2 class="title">Kontaktuj nás</h2>
<form class="contact-form" action="#" method="post">
<input type="text" name="e-mail" placeholder="Tvůj e-mail *">
<input type="text" name="full-name" class="name-surname" placeholder="Tvé jméno a přijmení *">
<textarea name="your-message" onkeyup="auto_grow(this)" rows="1" placeholder="Tvá zpráva"></textarea>
<button type="button" name="send-btn">Odeslat</button>
</form>
</section>
</main>
<footer>
<div class="footer-top">
<div class="footer-buttons-left-row-grid">
<a href="#">
<div class="footer-button">Členské příspěvky</div>
</a>
<a href="#">
<div class="footer-button">Sinis</div>
</a>
<a href="#">
<div class="footer-button">Wiki</div>
</a>
<a href="#">
<div class="footer-button">Cloud</div>
</a>
</div>
<div class="footer-logo-right-col-grid">
<img src="../img/sin-logo-col.png" alt="Club" class="opacity-decrease footer-img-logo">
<a href="https://su.cvut.cz/" target="_blank"><img src="../img/su-logo-col.svg" alt="Club" class="footer-img-logo"></a>
</div>
</div>
<section class="footer-bottom">
<div class="footer-contacts-row-grid">
<div class="footer-heading-col-grid">
<div class="footer-heading-left">
<h3 class="title">Kontakty</h3>
</div>
<div class="footer-heading-social-col-grid -right">
<a href="https://www.facebook.com/" target="_blank"><img src="../img/facebook.png" alt="Social" class="footer-img-social"></a>
<a href="https://www.instagram.com/" target="_blank"><img src="../img/instagram.png" alt="Social" class="footer-img-social"></a>
<a href="https://twitter.com/?lang=cs" target="_blank"><img src="../img/twitter.png" alt="Social" class="footer-img-social"></a>
</div>
</div>
<div class="footer-contacts-col-grid">
<p class="article">Představenstvo:</p>
<p class="article">predstavenstvo@sin.cvut.cz</p>
</div>
<div class="footer-contacts-col-grid">
<p class="article">Administrátoři:</p>
<p class="article">admin@sin.cvut.cz</p>
</div>
<div class="footer-contacts-col-grid">
<p class="article">PR oddělení:</p>
<p class="article">pr@sin.cvut.cz</p>
</div>
<div class="footer-contacts-col-grid">
<p class="article">Ostatní:</p>
<p class="article">sin@sin.cvut.cz</p>
</div>
</div>
<div class="footer-visit-row-grid">
<h3 class="title">Úřední hodiny</h3>
<div class="footer-visit-col-grid">
<p class="article">Administrátoři:</p>
<p class="article">Po & St 20:00 - 21:00</p>
</div>
<div class="footer-visit-col-grid">
<p class="article">Správci posilovny:</p>
<p class="article">Po & St 20:00 - 21:00</p>
</div>
</div>
</section>
</footer>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="../js/bootstrap.bundle.js"></script>
<script src="../js/auto_height.js"></script>
<script src="../js/navbar.js"></script>
<script src="../js/smooth-scroll.js"></script>
</body>
</html>