You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
210 lines
10 KiB
210 lines
10 KiB
4 years ago
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
|
||
|
|
<title>swarmlab.io</title>
|
||
|
|
<link rel="stylesheet" href="/stylesheets/bootstrap.min.css">
|
||
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic">
|
||
|
|
<link rel="stylesheet"
|
||
|
|
href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.4.1/css/simple-line-icons.min.css">
|
||
|
|
<link rel="stylesheet" href="/stylesheets/Footer-Dark.css">
|
||
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
|
||
|
|
<link rel="stylesheet" href="/stylesheets/Navigation-with-Button.css">
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<nav class="navbar navbar-light navbar-expand-md navigation-clean-button">
|
||
|
|
<div class="container"><a class="navbar-brand text-monospace" href="index.html">swarmlab.io</a><button
|
||
|
|
data-toggle="collapse" class="navbar-toggler" data-target="#navcol-1"><span class="sr-only">Toggle
|
||
|
|
navigation</span><span class="navbar-toggler-icon"></span></button>
|
||
|
|
<div class="collapse navbar-collapse" id="navcol-1">
|
||
|
|
<ul class="nav navbar-nav mr-auto">
|
||
|
|
<li class="nav-item" role="presentation"><a class="nav-link" href="#features">Features</a></li>
|
||
|
|
<li class="nav-item" role="presentation"><a class="nav-link" href="#services">Services</a></li>
|
||
|
|
<li class="nav-item" role="presentation"><a class="nav-link" href="#lab-rooms">Lab-rooms</a></li>
|
||
|
|
</ul><span class="navbar-text actions"> <a class="login" href="#">Log In</a><a
|
||
|
|
class="btn btn-light action-button" role="button" href="#">Sign Up</a></span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</nav>
|
||
|
|
<header class="masthead text-white text-center"
|
||
|
|
style="background: url(/images/markus-spiske-qjnAnF0jIGk-unsplash.jpg) top / cover;">
|
||
|
|
<div class="overlay"></div>
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-xl-9 mx-auto">
|
||
|
|
|
||
|
|
<h1 class="mb-5" style="height: 20px;"><%= t('welcome') %></h1>
|
||
|
|
<p style="font-size: 24px;"><%= t('welcome_text') %></p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
<section class="features-icons bg-light text-center" id="features">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-lg-4">
|
||
|
|
<div class="mx-auto features-icons-item mb-5 mb-lg-0 mb-lg-3">
|
||
|
|
<div class="d-flex features-icons-icon"><i class="icon-screen-desktop m-auto text-primary"
|
||
|
|
data-bs-hover-animate="pulse"></i></div>
|
||
|
|
<h3><%= t('features_01_header') %></h3>
|
||
|
|
<p class="lead mb-0"><%= t('features_01_text') %></p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-lg-4">
|
||
|
|
<div class="mx-auto features-icons-item mb-5 mb-lg-0 mb-lg-3">
|
||
|
|
<div class="d-flex features-icons-icon"><i class="icon-layers m-auto text-primary"
|
||
|
|
data-bs-hover-animate="pulse"></i></div>
|
||
|
|
<h3><%= t('features_02_header') %></h3>
|
||
|
|
<p class="lead mb-0"><%= t('features_02_text') %></p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-lg-4">
|
||
|
|
<div class="mx-auto features-icons-item mb-5 mb-lg-0 mb-lg-3">
|
||
|
|
<div class="d-flex features-icons-icon"><i class="icon-check m-auto text-primary"
|
||
|
|
data-bs-hover-animate="pulse"></i></div>
|
||
|
|
<h3><%= t('features_03_header') %></h3>
|
||
|
|
<p class="lead mb-0"><%= t('features_03_text') %></p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col"><a class="btn btn-primary btn-lg" role="button" data-bs-hover-animate="pulse"
|
||
|
|
style="color: rgb(255,255,255);margin-top: 80px;">Documentation</a></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="showcase" id="services">
|
||
|
|
<div class="container-fluid p-0">
|
||
|
|
<div class="row no-gutters">
|
||
|
|
<div class="col-lg-6 order-lg-2 text-white showcase-img"
|
||
|
|
style="background: url(/images/thomas-jensen-ISG-rUel0Uw-unsplash.jpg) center / cover;"><span></span></div>
|
||
|
|
<div class="col-lg-6 my-auto order-lg-1 showcase-text">
|
||
|
|
<h2><strong><%= t('on_demand') %> </strong></h2>
|
||
|
|
<p class="lead mb-0"><%= t('on_demand_text') %></p><a class="btn btn-light border-dark" role="button"
|
||
|
|
data-bs-hover-animate="pulse" style="margin: 0;margin-top: 20px;"
|
||
|
|
href="https://api-client.swarmlab.io:8088">api-client.swarmlab</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row no-gutters">
|
||
|
|
<div class="col-lg-6 text-white showcase-img"
|
||
|
|
style="background: url(/images/yancy-min-842ofHC6MaI-unsplash.jpg) center / cover;"><span></span></div>
|
||
|
|
<div class="col-lg-6 my-auto order-lg-1 showcase-text" style="margin: 0;">
|
||
|
|
<h2><strong><%= t('git') %></strong></h2>
|
||
|
|
<p class="lead mb-0"><%= t('git_text') %></p><a class="btn btn-light border-dark" role="button"
|
||
|
|
data-bs-hover-animate="pulse" style="margin: 0;margin-top: 20px;"
|
||
|
|
href="https://git.swarmlab.io:3000">git.swarmlab</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="testimonials text-center bg-light" id="lab-rooms">
|
||
|
|
<div class="container">
|
||
|
|
<h2 class="mb-5"><%= t('available_swarmlab') %></h2>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col">
|
||
|
|
<div class="card-group">
|
||
|
|
<div class="card" style="margin: 10px;">
|
||
|
|
<div class="card-body">
|
||
|
|
<h4 class="card-title">Title</h4>
|
||
|
|
<p class="card-text">Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac
|
||
|
|
facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus.</p><a
|
||
|
|
class="btn btn-light btn-sm border-dark" role="button">More Info</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card" style="margin: 10px;">
|
||
|
|
<div class="card-body">
|
||
|
|
<h4 class="card-title">Title</h4>
|
||
|
|
<p class="card-text">Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac
|
||
|
|
facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus.</p><a
|
||
|
|
class="btn btn-light border-dark" role="button">Button</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card" style="margin: 10px;">
|
||
|
|
<div class="card-body">
|
||
|
|
<h4 class="card-title">Title</h4>
|
||
|
|
<p class="card-text">Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac
|
||
|
|
facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus.</p><a
|
||
|
|
class="btn btn-light border-dark" role="button">Button</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="d-flex justify-content-center justify-content-xl-center">
|
||
|
|
<nav class="d-flex justify-content-center" style="width: auto;margin-top: 25px;color: rgb(33,37,41);">
|
||
|
|
<ul class="pagination">
|
||
|
|
<li class="page-item"><a class="page-link" href="#" aria-label="Previous"><span
|
||
|
|
aria-hidden="true">«</span></a></li>
|
||
|
|
<li class="page-item"><a class="page-link" href="#">1</a></li>
|
||
|
|
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
||
|
|
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
||
|
|
<li class="page-item"><a class="page-link" href="#">4</a></li>
|
||
|
|
<li class="page-item"><a class="page-link" href="#">5</a></li>
|
||
|
|
<li class="page-item"><a class="page-link" href="#" aria-label="Next"><span aria-hidden="true">»</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="call-to-action text-white text-center"
|
||
|
|
style="background: url(/images/annie-spratt-QckxruozjRg-unsplash.jpg) center / cover;height: 400;" id="feedback">
|
||
|
|
<div class="overlay"></div>
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-xl-9 mx-auto">
|
||
|
|
<h2 class="mb-4"> <%= t('bug') %></h2>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-10 col-lg-8 col-xl-7 mx-auto">
|
||
|
|
<div class="row d-flex justify-content-center justify-content-xl-center"><a
|
||
|
|
class="btn btn-secondary btn-lg border-secondary justify-content-center" role="button"
|
||
|
|
data-bs-hover-animate="pulse" style="margin: 0;margin-top: 20px;background-color: rgb(40,45,51);"
|
||
|
|
href=" https://git.swarmlab.io:3000/swarmlab/feedback">Feedback</a></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<div class="footer-dark">
|
||
|
|
<footer>
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-sm-6 col-md-3 item">
|
||
|
|
<h3>Menu</h3>
|
||
|
|
<ul>
|
||
|
|
<li><a href="#features">Features</a></li>
|
||
|
|
<li><a href="#">Documentation</a></li>
|
||
|
|
<li><a href="#services">Services</a></li>
|
||
|
|
<li><a href="#lab-rooms">Lab-rooms</a></li>
|
||
|
|
<li><a href="#feedback">Feedback</a></li>
|
||
|
|
<li><a href="#">FAQ</a></li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm-6 col-md-3 item">
|
||
|
|
<h3>Translations</h3>
|
||
|
|
<ul>
|
||
|
|
<li><a href="?lng=en">English</a></li>
|
||
|
|
<li><a href="?lng=el">Greek</a></li>
|
||
|
|
<li></li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
<div class=" col-md-6 item text">
|
||
|
|
<h3>swarmlab.io</h3>
|
||
|
|
<p><%= t('welcome_text') %></p>
|
||
|
|
</div>
|
||
|
|
<div class="col item social"><span class="actions"> <a class="btn btn-light btn-lg text-light action-button"
|
||
|
|
role="button" href="#" style="background-color: rgba(248,249,250,0);">Log In</a><a
|
||
|
|
class="btn btn-light btn-lg text-light action-button" role="button" href="#"
|
||
|
|
style="margin: 20px;background-color: rgba(248,249,250,0);color: rgb(255,255,255);">Sign Up</a></span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<p class="copyright">swarmlab.io © <%= new Date().getFullYear(); %></p>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.bundle.min.js"></script>
|
||
|
|
<script src="/javascripts/bs-init.js"></script>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|