TeleQom.org/pages/en/qonsole.html

103 lines
3.8 KiB
HTML

<!DOCTYPE html>
<html lang="en-CA">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>The TeleQom Project | Repairs Service</title>
<meta name="description"
content="La Qonsole de TeleQom! Un apreçu avant son lancement." />
<link rel="icon" type="image/x-icon" href="/favicon.png">
<link rel="stylesheet" href="/css/pages/qonsole.css" />
</head>
<body>
<!-- FOUC -->
<script>0</script>
<header>
<nav>
<input type="checkbox" id="navbar-menu-btn" />
<label for="navbar-menu-btn" id="menu-btn-open">
<img src="/media/images/menu.png" alt="Menu Icon">
</label>
<label for="navbar-menu-btn" id="menu-btn-close">
<img src="/media/images/close.png" alt="Menu Icon">
</label>
<a href="/pages/en/index.html" class="logo">
<img src="/media/images/logo.svg" alt="TeleQom Logo">
</a>
<ul id="nav-list">
<li><a class="btn btn-2" href="#qonsole">Qonsole</a></li>
<li><a class="btn btn-2" href="#disq">DisQ</a></li>
<li><a class="btn btn-2" href="/pages/fr/qonsole.html">FR</a></li>
<li>
<div id="mobile-nav-action-btn">
<a class="btn btn-1" href="/pages/en/index.html#contact">Contact</a>
</div>
</li>
</ul>
<div id="navbar-action-btn">
<a class="btn btn-1" href="/pages/en/index.html#contact">Contact</a>
</div>
</nav>
</header>
<section id="intro">
<h2>Your <span class="q">Q</span>onsole</h2>
<p>
Simply put, the <span class="q">Q</span>onsole is a dashboard for your applications.
It manages your personal information in a secure way and shares them with applications, asking your permission and clearly explaining why.
</p>
<p>
You will have full control over your data!
The Qonsole is still under development but here are a few images to help you visualize:
</p>
</section>
<section id="qonsole">
<h3><span class="q">Q</span>onsole: Add and App</h3>
<img class="screenshot" src="/media/images/qonsole-add-app.png" alt="Qonsole aperçu">
</section>
<section id="disq">
<h3>Dis<span class="q">Q</span>: Your files</h3>
<img class="screenshot" src="/media/images/qonsole-disq.png" alt="DisQ aperçu">
</section>
<section id="call-to-action">
<h2>Want to help?</h2>
<p class="description">
You can make a donation to speed up the development process. Contact us for more information!
</p>
<a class="btn btn-1" href="/pages/en/index.html#contact">Contact</a>
</section>
<footer>
<div class="newsletter">
<h5>Subscribe!</h5>
<p>We only send important news</p>
<form action="/php/newsletter.php" method="get">
<input type="text" name="newsletter-language" value="en" hidden>
<input type="email" name="newsletter-email" placeholder="Email" required id="newsletter-email">
<input class="catch" type="email" name="newsletter-email-2" placeholder="Email" id="newsletter-email-2">
<input type="submit" class="btn btn-1" value="Subscribe">
</form>
</div>
<div class="wrapper">
<a href="https://qode.teleqom.org/TeleQom-Public/teleqom.org" target="_blank" rel="noreferrer noopener"><img
src="/media/images/Qode.png" alt="Qode"></a>
<a href="https://creativecommons.org/licenses/by/4.0/" target="_blank" rel="noreferrer noopener">
<img src="/media/images/CC-64.png" alt="Creative Commons">
</a>
<a href="https://www.torproject.org/" target="_blank" rel="noreferrer noopener">
<img src="/media/images/onion-64.png" alt="TOR">
</a>
<a href="/pages/fr/qonsole.html">
<img src="/media/images/quebec.png" alt="Français Québec">
</a>
</div>
</footer>
</body>
</html>