Merge branch 'feature/new_digitalglarus' of github.com:ungleich/dynamicweb into feature/new_digitalglarus
This commit is contained in:
Levi
commit
116f99a2a3
15 changed files with 467 additions and 119 deletions
|
|
@ -56,8 +56,7 @@ h6 {
|
||||||
color: #f8f8f8;
|
color: #f8f8f8;
|
||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 70vh;
|
height: 100vh;
|
||||||
max-height: 620px;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
@ -76,11 +75,36 @@ h6 {
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
.intro-header:before{
|
||||||
|
content: " ";
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
background-color: rgba(49, 49, 49, 0.15);
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.intro-header .arrow-down{
|
||||||
|
position: absolute;
|
||||||
|
color: #fff;
|
||||||
|
bottom: 20px;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
.intro-header .arrow-down a{
|
||||||
|
color: #fff;
|
||||||
|
font-size: 32px;
|
||||||
|
z-index: 100;
|
||||||
|
}
|
||||||
.intro-header .background:nth-child(1){
|
.intro-header .background:nth-child(1){
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#about{
|
||||||
|
padding-top: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
.intro-header-1 {
|
.intro-header-1 {
|
||||||
padding-top: 50px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
|
padding-top: 50px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
|
||||||
|
|
@ -113,11 +137,54 @@ h6 {
|
||||||
}
|
}
|
||||||
|
|
||||||
.intro-login {
|
.intro-login {
|
||||||
background: url(../img/login-bg.jpg) no-repeat center center;
|
background: url(../img/banner-4.jpg) no-repeat center center;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
.section-login{
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.section-login .box-login{
|
||||||
|
background: #fff;
|
||||||
|
padding: 60px;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
.section-login .box-login img{
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
.section-login .title h1{
|
||||||
|
font-size: 41px;
|
||||||
|
}
|
||||||
|
.section-login .description{
|
||||||
|
font-size: 20px;
|
||||||
|
border-bottom: 3px solid #737373;
|
||||||
|
margin-bottom: 44px;
|
||||||
|
padding-bottom: 9px;
|
||||||
|
width: 96px;
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-bottom: 44px;
|
||||||
|
}
|
||||||
|
.section-login .text{
|
||||||
|
margin: 5px 10px;
|
||||||
|
color: #797979;
|
||||||
|
}
|
||||||
|
.section-login .text a{
|
||||||
|
color: #0056c1;
|
||||||
|
}
|
||||||
|
.btn-red{
|
||||||
|
background: #980000;
|
||||||
|
|
||||||
|
}
|
||||||
|
.section-login .btn-login{
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 700;
|
||||||
|
padding: 10px 20px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
.intro-signup {
|
.intro-signup {
|
||||||
background: url(../img/signup-bg.png) no-repeat center center;
|
background: url(../img/signup-bg.png) no-repeat center center;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
|
|
@ -177,6 +244,7 @@ h6 {
|
||||||
.intro-divider {
|
.intro-divider {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.network-name {
|
.network-name {
|
||||||
|
|
@ -228,13 +296,28 @@ h6 {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.pt-70{
|
||||||
|
padding-top: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 1199px) {
|
@media (max-width: 1199px) {
|
||||||
ul.banner-social-buttons {
|
ul.banner-social-buttons {
|
||||||
float: left;
|
float: left;
|
||||||
margin-top: 15px;
|
margin-top: 15px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
footer {
|
||||||
|
padding: 2%;
|
||||||
|
background-color: #f8f8f8;
|
||||||
|
#position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
footer .footer-links{
|
||||||
|
text-align: right;
|
||||||
|
padding-top: 50px;
|
||||||
|
}
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
.banner h2 {
|
.banner h2 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
@ -251,16 +334,11 @@ h6 {
|
||||||
ul.banner-social-buttons > li:last-child {
|
ul.banner-social-buttons > li:last-child {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
footer .footer-links{
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
footer {
|
|
||||||
padding: 2%;
|
|
||||||
background-color: #f8f8f8;
|
|
||||||
#position: absolute;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
p.copyright {
|
p.copyright {
|
||||||
margin: 15px 0 0;
|
margin: 15px 0 0;
|
||||||
|
|
@ -472,3 +550,5 @@ img::selection {
|
||||||
#portfolio .portfolio-item {
|
#portfolio .portfolio-item {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//utils
|
||||||
|
|
|
||||||
BIN
alplora/static/alplora/img/banner-1.jpg
Normal file
BIN
alplora/static/alplora/img/banner-1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
BIN
alplora/static/alplora/img/banner-2.jpg
Normal file
BIN
alplora/static/alplora/img/banner-2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2 MiB |
BIN
alplora/static/alplora/img/banner-3.jpg
Normal file
BIN
alplora/static/alplora/img/banner-3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2 MiB |
BIN
alplora/static/alplora/img/banner-4.jpg
Normal file
BIN
alplora/static/alplora/img/banner-4.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3 MiB |
|
|
@ -14,7 +14,7 @@
|
||||||
|
|
||||||
|
|
||||||
$( document ).ready(function() {
|
$( document ).ready(function() {
|
||||||
|
init_nav();
|
||||||
initBackgroundsHeader();
|
initBackgroundsHeader();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -35,4 +35,14 @@
|
||||||
_changeBg(0, arrayElements, 4000);
|
_changeBg(0, arrayElements, 4000);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function init_nav(){
|
||||||
|
|
||||||
|
$('.nav-local').click(function(){
|
||||||
|
$('html, body').animate({
|
||||||
|
scrollTop: $('#'+$(this).data('href')).offset().top
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
})(jQuery);
|
})(jQuery);
|
||||||
|
|
@ -79,28 +79,28 @@
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
</button>
|
</button>
|
||||||
<a class="navbar-brand topnav" href="/en-us/"><img src="{% static 'alplora/img/logo_black.svg'%}"></a>
|
<a class="navbar-brand topnav nav-local" href="javascript:void(0)" data-href="home"><img src="{% static 'alplora/img/logo_black.svg'%}"></a>
|
||||||
</div>
|
</div>
|
||||||
<!-- Collect the nav links, forms, and other content for toggling -->
|
<!-- Collect the nav links, forms, and other content for toggling -->
|
||||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||||||
<ul class="nav navbar-nav navbar-right">
|
<ul class="nav navbar-nav navbar-right">
|
||||||
<li>
|
<li>
|
||||||
<a href="#how">{% trans 'About' %}</a>
|
<a class="nav-local" href="javascript:void(0)" data-href="about">{% trans 'About' %}</a>
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="#your">{% trans 'Usecase' %}</a>
|
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#our">{% trans 'Why Alplora?' %}</a>
|
<a class="nav-local" href="javascript:void(0)" data-href="why" >{% trans 'Why Alplora?' %}</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#price">{% trans 'Testimonials' %}</a>
|
<a class="nav-local" href="javascript:void(0)" data-href="usecase" >{% trans 'Usecase' %}</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#contact">{% trans 'Contact' %}</a>
|
<a class="nav-local" href="javascript:void(0)" data-href="testimonial" >{% trans 'Testimonials' %}</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="/hosting/login?next=">{% trans 'Login' %}</a>
|
<a class="nav-local" href="javascript:void(0)" data-href="contact" >{% trans 'Contact' %}</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="{% url 'alplora:login' %}">{% trans 'Login' %}</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -113,12 +113,13 @@
|
||||||
|
|
||||||
|
|
||||||
<a name="about"></a>
|
<a name="about"></a>
|
||||||
<section class="intro-header">
|
<section class="intro-header" id="home">
|
||||||
<!-- Add images backgrounds url(url-image); -->
|
<!-- Add images backgrounds url(url-image); -->
|
||||||
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/intro-bg.png' %});"></div>
|
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/banner-1.jpg' %});"></div>
|
||||||
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/configure.jpg' %});"></div>
|
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/banner-2.jpg' %});"></div>
|
||||||
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/django-intro-bg.png' %});"></div>
|
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/banner-3.jpg' %});"></div>
|
||||||
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/rails-intro-bg.png' %});"></div>
|
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/banner-4.jpg' %});"></div>
|
||||||
|
|
||||||
<div class="intro-message">
|
<div class="intro-message">
|
||||||
|
|
||||||
<img class="responsive" src="{% static 'alplora/img/alplora_logo_nopadding.svg' %}">
|
<img class="responsive" src="{% static 'alplora/img/alplora_logo_nopadding.svg' %}">
|
||||||
|
|
@ -136,10 +137,15 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="arrow-down">
|
||||||
|
<a class="nav-local" href="javascript:void(0)" data-href="about">
|
||||||
|
<i class="glyphicon glyphicon-menu-down"></i>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="background backcground-cover" ></div>
|
||||||
</section>
|
</section>
|
||||||
<!-- /.intro-header -->
|
<!-- /.intro-header -->
|
||||||
<section id="whatis">
|
<section id="about" class="pt-70">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-lg-12 text-center wow fadeInDown">
|
<div class="col-lg-12 text-center wow fadeInDown">
|
||||||
|
|
@ -221,7 +227,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div></section>
|
</div></section>
|
||||||
<section id="portfolio" class="bg-light-gray">
|
<section id="why" class="bg-light-gray pt-70">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-lg-12 text-center wow fadeInDown">
|
<div class="col-lg-12 text-center wow fadeInDown">
|
||||||
|
|
@ -258,8 +264,7 @@
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
<!-- Page Content -->
|
<!-- Page Content -->
|
||||||
<a name="how"></a>
|
<div class="content-section-b" id="usecase">
|
||||||
<div class="content-section-b">
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-lg-12 wow text-center fadeInDown">
|
<div class="col-lg-12 wow text-center fadeInDown">
|
||||||
|
|
@ -273,8 +278,6 @@
|
||||||
|
|
||||||
<!-- Your Infrastructure -->
|
<!-- Your Infrastructure -->
|
||||||
|
|
||||||
|
|
||||||
<a name="your"></a>
|
|
||||||
<div class="content-section-a" id="own">
|
<div class="content-section-a" id="own">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|
@ -333,7 +336,7 @@
|
||||||
<!-- /.container -->
|
<!-- /.container -->
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<section id="team" class="bg-light-gray">
|
<section id="testimonial" class="bg-light-gray">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-16 text-center center-block wow fadeInDown">
|
<div class="col-sm-16 text-center center-block wow fadeInDown">
|
||||||
|
|
@ -343,9 +346,9 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-10 col-sm-offset-1 wow fadeInDown">
|
<div class="col-sm-10 col-sm-offset-1 wow fadeInDown ">
|
||||||
<!-- start:recommendationSlider -->
|
<!-- start:recommendationSlider -->
|
||||||
<div id="carousel-recommendation-ungleich" class="carousel slide ungleich ungleich-gallery ungleich-gallery-text-carousel" data-ride="carousel" data-interval="3000">
|
<div id="carousel-recommendation-ungleich" class="carousel slide ungleich ungleich-gallery ungleich-gallery-text-carousel" data-ride="carousel" data-interval="10000">
|
||||||
<!-- Indicators -->
|
<!-- Indicators -->
|
||||||
<ol class="carousel-indicators">
|
<ol class="carousel-indicators">
|
||||||
<li data-target="#carousel-recommendation-ungleich" data-slide-to="0" class="active"></li>
|
<li data-target="#carousel-recommendation-ungleich" data-slide-to="0" class="active"></li>
|
||||||
|
|
@ -390,8 +393,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<a name="about"></a>
|
<div class="intro-header-1" id="contact">
|
||||||
<div class="intro-header-1">
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|
@ -421,18 +423,14 @@
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-lg-6">
|
<div class="col-md-6">
|
||||||
|
|
||||||
<h3>Alplora </h3>
|
<h3>Alplora </h3>
|
||||||
<p><i class="fa fa-envelope-o"></i> info@alplora.ch</p>
|
<p><i class="fa fa-envelope-o"></i> info@alplora.ch</p>
|
||||||
<p>In der Au 7 Schwanden 8762</p>
|
<p>In der Au 7 Schwanden 8762</p>
|
||||||
<p>Switzerland</p>
|
<p>Switzerland</p>
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-6">
|
|
||||||
|
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
|
|
@ -456,16 +454,16 @@
|
||||||
<a href="#contact">{% trans 'Contact' %}</a>
|
<a href="#contact">{% trans 'Contact' %}</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<div class="col-xs-6 col-lg-4"></div>
|
|
||||||
<div class="col-xs-6 col-lg-8 text-right">
|
|
||||||
<a href="www.ungleich.ch">
|
|
||||||
<img src="{% static 'alplora/img/ungleich_logo.svg'%}">
|
|
||||||
<img src="{% static 'alplora/img/digitalglarus_logo.svg'%}">
|
|
||||||
<img src="{% static 'alplora/img/adnexo_logo.svg'%}">
|
|
||||||
</div>
|
</div>
|
||||||
<p class="copyright text-muted small">Copyright © Alplora 2017. All Rights Reserved</p>
|
<div class="col-md-6 footer-links">
|
||||||
|
|
||||||
|
<a href="http://www.ungleich.ch" target="_blank"><img src="{% static 'alplora/img/ungleich_logo.svg'%}"></a>
|
||||||
|
<a href="http://www.digitalglarus.ch" target="_blank"> <img src="{% static 'alplora/img/digitalglarus_logo.svg'%}"></a>
|
||||||
|
<a href="https://www.adnexo.ch" target="_blank"> <img src="{% static 'alplora/img/adnexo_logo.svg'%}"></a>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<p class="copyright text-muted small">Copyright © Alplora 2017. All Rights Reserved</p>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
|
|
|
||||||
216
alplora/templates/alplora/login.html
Normal file
216
alplora/templates/alplora/login.html
Normal file
|
|
@ -0,0 +1,216 @@
|
||||||
|
{% load staticfiles i18n%}
|
||||||
|
<html lang="en"><head>
|
||||||
|
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<meta name="description" content="">
|
||||||
|
<meta name="author" content="">
|
||||||
|
|
||||||
|
<title>Alplora.ch - Find your animal anywhere, anytime</title>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Bootstrap Core CSS -->
|
||||||
|
<link href="{% static 'alplora/css/bootstrap.min.css' %}" rel="stylesheet">
|
||||||
|
|
||||||
|
<link href="{% static 'alplora/css/pricing.css' %}" rel="stylesheet">
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Custom CSS -->
|
||||||
|
<link href="{% static 'alplora/css/alplora.css' %}" rel="stylesheet">
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Custom Fonts -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet">
|
||||||
|
<link rel="stylesheet" href="{% static 'alplora/font-awesome/css/font-awesome.min.css' %}">
|
||||||
|
<link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
|
||||||
|
<link rel="shortcut icon" href="{% static 'alplora/img/favicon.ico' %}" type="image/x-icon">
|
||||||
|
|
||||||
|
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||||
|
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||||
|
<!--[if lt IE 9]>
|
||||||
|
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
||||||
|
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
|
||||||
|
<![endif]-->
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body data-feedly-mini="yes">
|
||||||
|
|
||||||
|
<script async src="//www.google-analytics.com/analytics.js"></script><script>
|
||||||
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||||
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||||
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||||
|
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
||||||
|
|
||||||
|
ga('create', 'UA-62285904-5', 'auto');
|
||||||
|
ga('send', 'pageview');
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Navigation -->
|
||||||
|
<div class="page-loader">
|
||||||
|
<div class="loader">
|
||||||
|
<div class="circle circle-1"></div>
|
||||||
|
<div class="line line-1"></div>
|
||||||
|
<div class="circle circle-2"></div>
|
||||||
|
<div class="line line-2"></div>
|
||||||
|
<div class="circle circle-3"></div>
|
||||||
|
<div class="line line-3"></div>
|
||||||
|
<div class="circle circle-4"></div>
|
||||||
|
<div class="line line-4"></div>
|
||||||
|
<div class="circle circle-5"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
|
||||||
|
<div class="container topnav">
|
||||||
|
<!-- Brand and toggle get grouped for better mobile display -->
|
||||||
|
<div class="navbar-header">
|
||||||
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
|
||||||
|
<span class="sr-only">Toggle navigation</span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
</button>
|
||||||
|
<a class="navbar-brand topnav" href="{% url 'alplora:index' %}"><img src="{% static 'alplora/img/logo_black.svg'%}"></a>
|
||||||
|
</div>
|
||||||
|
<!-- Collect the nav links, forms, and other content for toggling -->
|
||||||
|
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||||||
|
<ul class="nav navbar-nav navbar-right">
|
||||||
|
<li>
|
||||||
|
<a href="/alplora#about" data>About</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="/alplora#usecase">Usecase</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="/alplora#why">Why Alplora?</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="/alplora#testimonials">Testimonials</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="/alplora#contact">Contact</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="/alplora#login">Login</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<!-- /.navbar-collapse -->
|
||||||
|
</div>
|
||||||
|
<!-- /.container -->
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
|
||||||
|
<section class="section-login intro-login">
|
||||||
|
<div class="box-login">
|
||||||
|
<img src="{% static 'alplora/img/logo_black.svg'%}">
|
||||||
|
<div class="title">
|
||||||
|
<h1>Login</h1>
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
Welcome
|
||||||
|
</div>
|
||||||
|
<div class="form">
|
||||||
|
<form action="">
|
||||||
|
<div class="form-group">
|
||||||
|
<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="text"><span>By loggin in you agree to our <a href="#">Terms of Service</a></span></div>
|
||||||
|
<div class="btn-login">
|
||||||
|
<button class="submit btn btn-red btn-login btn-round" type="submit">
|
||||||
|
<span>Login</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="text"><span>Forgot Password <a href="#">Find ID/Password</a></span></div>
|
||||||
|
<div class="text"><span>Not a member yet? <a href="#">Sign up</a> now</span></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
<!-- Header -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-6">
|
||||||
|
|
||||||
|
<h3>Alplora </h3>
|
||||||
|
<p><i class="fa fa-envelope-o"></i> info@alplora.ch</p>
|
||||||
|
<p>In der Au 7 Schwanden 8762</p>
|
||||||
|
<p>Switzerland</p>
|
||||||
|
|
||||||
|
|
||||||
|
<ul class="list-inline">
|
||||||
|
<li>
|
||||||
|
<a href="#">Home</a>
|
||||||
|
</li>
|
||||||
|
<li class="footer-menu-divider">⋅</li>
|
||||||
|
<li>
|
||||||
|
<a href="#about">About</a></li>
|
||||||
|
<li class="footer-menu-divider">⋅</li>
|
||||||
|
<li>
|
||||||
|
<a href="#about">Usecase</a></li>
|
||||||
|
<li>⋅</li>
|
||||||
|
<li>
|
||||||
|
<a href="#about">Why Alplora?</a></li>
|
||||||
|
<li class="footer-menu-divider">⋅</li>
|
||||||
|
<li>
|
||||||
|
<a href="#services">Testimonials</a>
|
||||||
|
</li>
|
||||||
|
<li class="footer-menu-divider">⋅</li>
|
||||||
|
<li>
|
||||||
|
<a href="#contact">Contact</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6 footer-links">
|
||||||
|
|
||||||
|
<a href="http://www.ungleich.ch" target="_blank"><img src="{% static 'alplora/img/ungleich_logo.svg'%}"></a>
|
||||||
|
<a href="http://www.digitalglarus.ch" target="_blank"> <img src="{% static 'alplora/img/digitalglarus_logo.svg'%}"></a>
|
||||||
|
<a href="https://www.adnexo.ch" target="_blank"> <img src="{% static 'alplora/img/adnexo_logo.svg'%}"></a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<p class="copyright text-muted small">Copyright © Alplora 2017. All Rights Reserved</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Lodash -->
|
||||||
|
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/4.11.1/lodash.min.js"></script>
|
||||||
|
|
||||||
|
<!-- jQuery -->
|
||||||
|
<script src="{% static 'alplora/js/jquery.js' %}"></script>
|
||||||
|
|
||||||
|
<!-- Pricing -->
|
||||||
|
<script src="{% static 'alplora/js/pricing.js' %}"></script>
|
||||||
|
|
||||||
|
<!-- Images loaded -->
|
||||||
|
<script type="text/javascript" src="{% static 'alplora/js/imagesloaded.pkgd.min.js' %}"></script>
|
||||||
|
|
||||||
|
<!-- Bootstrap Core JavaScript -->
|
||||||
|
<script src="{% static 'alplora/js/bootstrap.min.js' %}"></script>
|
||||||
|
|
||||||
|
<script src="{% static 'alplora/js/main.js' %}"></script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -1,10 +1,11 @@
|
||||||
from django.conf.urls import url
|
from django.conf.urls import url
|
||||||
|
|
||||||
from .views import IndexView
|
from .views import IndexView, LoginView
|
||||||
|
|
||||||
|
|
||||||
urlpatterns = [
|
urlpatterns = [
|
||||||
url(r'^/?$', IndexView.as_view(), name='index'),
|
url(r'^/?$', IndexView.as_view(), name='index'),
|
||||||
|
url(r'/login/', LoginView.as_view(), name='login'),
|
||||||
# url(r'^/beta-program/?$', BetaProgramView.as_view(), name='beta'),
|
# url(r'^/beta-program/?$', BetaProgramView.as_view(), name='beta'),
|
||||||
# url(r'^/landing/?$', LandingProgramView.as_view(), name='landing'),
|
# url(r'^/landing/?$', LandingProgramView.as_view(), name='landing'),
|
||||||
]
|
]
|
||||||
|
|
|
||||||
|
|
@ -3,3 +3,6 @@ from django.views.generic import TemplateView
|
||||||
|
|
||||||
class IndexView(TemplateView):
|
class IndexView(TemplateView):
|
||||||
template_name = "alplora/index.html"
|
template_name = "alplora/index.html"
|
||||||
|
|
||||||
|
class LoginView(TemplateView):
|
||||||
|
template_name = "alplora/login.html"
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -1,55 +1,55 @@
|
||||||
(function($){
|
(function($){
|
||||||
'use strict'; // Start of use strict
|
'use strict'; // Start of use strict
|
||||||
|
|
||||||
$(document).ready(function(){
|
|
||||||
|
|
||||||
init_options_interested();
|
|
||||||
init_nav();
|
$(document).ready(function(){
|
||||||
change_values();
|
verifiedUrl();
|
||||||
form_submit();
|
init_options_interested();
|
||||||
|
init_nav();
|
||||||
|
change_values();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
function verifiedUrl(){
|
||||||
|
if(window.location.href.indexOf('#success') > -1){
|
||||||
|
form_success();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function init_options_interested(){
|
function init_options_interested(){
|
||||||
$('.row-vms').click(function(){
|
$('.row-vms').click(function(){
|
||||||
$('.row-vms').removeClass('row-vms__active');
|
$('.row-vms').removeClass('row-vms__active');
|
||||||
$(this).addClass('row-vms__active');
|
$(this).addClass('row-vms__active');
|
||||||
var number = $('.row-vms__active input').val();
|
var number = $('.row-vms__active input').val();
|
||||||
var price = $('.row-vms__active input').data('price');
|
var price = $('.row-vms__active input').data('price');
|
||||||
_calculate(number, price);
|
_calculate(number, price);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function init_nav(){
|
function init_nav(){
|
||||||
|
|
||||||
$('.nav-local').click(function(){
|
$('.nav-local').click(function(){
|
||||||
$('html, body').animate({
|
$('html, body').animate({
|
||||||
scrollTop: $('#'+$(this).data('href')).offset().top
|
scrollTop: $('#'+$(this).data('href')).offset().top
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function change_values(){
|
function change_values(){
|
||||||
$('.number-vms').keyup(function () {
|
$('.number-vms').keyup(function () {
|
||||||
var number = $(this).val();
|
var number = $(this).val();
|
||||||
var price = $(this).data('price');
|
var price = $(this).data('price');
|
||||||
_calculate(number, price);
|
_calculate(number, price);
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
function form_submit(){
|
function form_success(){
|
||||||
// $('#submit').click(function(){
|
$('#sucessModal').modal('show');
|
||||||
// $('.contain-form').fadeOut();
|
}
|
||||||
// $('.loading').fadeIn();
|
|
||||||
// setTimeout(function(){
|
|
||||||
// $('.loading').fadeOut();
|
|
||||||
// $('.succes-message').fadeIn();
|
|
||||||
// }, 3000);
|
|
||||||
// });
|
|
||||||
}
|
|
||||||
function _calculate(numbers, price){
|
function _calculate(numbers, price){
|
||||||
$('#valueTotal').text(numbers*price*31);
|
$('#valueTotal').text(numbers*price*31);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
})(jQuery); // End of use strict
|
})(jQuery); // End of use strict
|
||||||
|
|
|
||||||
1
datacenterlight/static/datacenterlight/js/plugin.js
Normal file
1
datacenterlight/static/datacenterlight/js/plugin.js
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -8,6 +8,7 @@
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
|
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
|
||||||
<title>landings</title>
|
<title>landings</title>
|
||||||
<link rel="apple-touch-icon" href="apple-touch-icon.png">
|
<link rel="apple-touch-icon" href="apple-touch-icon.png">
|
||||||
|
<link rel="shortcut icon" href="{% static 'datacenterlight/img/favicon.ico' %}" type="image/x-icon" />
|
||||||
<link rel="stylesheet" href="{% static 'datacenterlight/css/main.css' %}">
|
<link rel="stylesheet" href="{% static 'datacenterlight/css/main.css' %}">
|
||||||
<script src="{% static 'datacenterlight/js/vendor/modernizr.js' %}"></script>
|
<script src="{% static 'datacenterlight/js/vendor/modernizr.js' %}"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
@ -61,16 +62,31 @@
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="loading"><img src="{% static 'datacenterlight/img/loading.gif' %}" alt=""></div>
|
|
||||||
<div class="succes-message">
|
|
||||||
<div class="title">
|
|
||||||
<h1>Thank You</h1></div>
|
|
||||||
<div class="container" style="margin-top:3rem">
|
|
||||||
<p>Thanks for letting us know about your interest! We will come back to you as soon as our beta program starts!</p>
|
|
||||||
<p>Meanwhile, you can checkout news about it on <a href="#">Twitter</a>, <a href="#">Facebook</a> and <a href="#">Instagram</a></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
</section>
|
||||||
|
<div class="modal fade" id="sucessModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
|
||||||
|
<div class="modal-dialog" role="document">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h5 class="modal-title" id="exampleModalLongTitle">Thank You</h5>
|
||||||
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||||
|
<span aria-hidden="true">×</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<div class="success-message">
|
||||||
|
<div class="title">
|
||||||
|
<h1>Thank You</h1>
|
||||||
|
</div>
|
||||||
|
<div class="container" style="margin-top: 3rem">
|
||||||
|
<p>Thanks for letting us know about your interest! We will come back to you as soon as our beta program starts!</p>
|
||||||
|
<p>Meanwhile, you can checkout news about it on <a href="#" >Twitter</a>, <a href="#" >Facebook</a> and <a href="#" >Instagram</a> </p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<script>
|
<script>
|
||||||
! function(e, t, a, n, c, o) {
|
! function(e, t, a, n, c, o) {
|
||||||
e.GoogleAnalyticsObject = n, e[n] || (e[n] = function() {
|
e.GoogleAnalyticsObject = n, e[n] || (e[n] = function() {
|
||||||
|
|
@ -79,6 +95,7 @@
|
||||||
}(window, document, "script", "ga"), ga("create", "UA-XXXXX-X"), ga("send", "pageview")
|
}(window, document, "script", "ga"), ga("create", "UA-XXXXX-X"), ga("send", "pageview")
|
||||||
</script>
|
</script>
|
||||||
<script src="{% static 'datacenterlight/js/vendor.js' %}"></script>
|
<script src="{% static 'datacenterlight/js/vendor.js' %}"></script>
|
||||||
|
<script src="{% static 'datacenterlight/js/plugin.js' %}"></script>
|
||||||
<script src="{% static 'datacenterlight/js/main.js' %}"></script>
|
<script src="{% static 'datacenterlight/js/main.js' %}"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -9,6 +9,7 @@
|
||||||
<title>landings</title>
|
<title>landings</title>
|
||||||
<link rel="apple-touch-icon" href="apple-touch-icon.png">
|
<link rel="apple-touch-icon" href="apple-touch-icon.png">
|
||||||
<link rel="stylesheet" href="{% static 'datacenterlight/css/main.css' %}">
|
<link rel="stylesheet" href="{% static 'datacenterlight/css/main.css' %}">
|
||||||
|
<link rel="shortcut icon" href="{% static 'datacenterlight/img/favicon.ico' %}" type="image/x-icon" />
|
||||||
<script src="{% static 'datacenterlight/js/vendor/modernizr.js' %}"></script>
|
<script src="{% static 'datacenterlight/js/vendor/modernizr.js' %}"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
|
@ -26,30 +27,50 @@
|
||||||
<div class="form-interested">
|
<div class="form-interested">
|
||||||
<h2>Details about the offer..<ul><li><span>2 GB RAM</span></li><li><span>1 CPU</span></li><li><span>10 GB Dus</span></li></ul><h2>I am interested in running</h2>
|
<h2>Details about the offer..<ul><li><span>2 GB RAM</span></li><li><span>1 CPU</span></li><li><span>10 GB Dus</span></li></ul><h2>I am interested in running</h2>
|
||||||
<form action="">
|
<form action="">
|
||||||
<div class="row-vms d-flex align-items-center justify-content-between row-vms__active">
|
<div class="row-vms d-flex align-items-center justify-content-between row-vms__active">
|
||||||
<div class="form-group">
|
<div class="form-group ">
|
||||||
<input type="number" class="form-control number-vms" value="1" data-price="0.5">
|
<input type="number" class="form-control number-vms" value='1' data-price="0.5">
|
||||||
<div class="text"><span>number of VMs</span></div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="submit">
|
<div class="text text__landing">
|
||||||
<button type="button" id="submit" class="btn btn-block btn-success">Submit</button>
|
<span>number of VMs </span>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="form-group form-group__email">
|
||||||
|
<input class="form-control" type="email" placeholder="email" id="example-email-input">
|
||||||
|
</div>
|
||||||
|
<div class="submit">
|
||||||
|
<button type="button" id="submit" class="btn btn-block btn-success">Submit</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<p>Interested in other offers? <a href="index.html">Checkout our beta program offers!</a></p>
|
<p >Interested in other offers? <a href="index.html">Checkout our beta program offers!</a></p>
|
||||||
</form>
|
</form>
|
||||||
</h2>
|
</h2>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="loading"><img src="{% static 'datacenterlight/img/loading.gif' %}" alt=""></div>
|
|
||||||
<div class="succes-message">
|
|
||||||
<div class="title">
|
|
||||||
<h1>Thank You</h1></div>
|
|
||||||
<div class="container" style="margin-top:3rem">
|
|
||||||
<p>Thanks for letting us know about your interest! We will come back to you as soon as our beta program starts!</p>
|
|
||||||
<p>Meanwhile, you can checkout news about it on <a href="#">Twitter</a>, <a href="#">Facebook</a> and <a href="#">Instagram</a></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
</section>
|
||||||
|
<div class="modal fade" id="sucessModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
|
||||||
|
<div class="modal-dialog" role="document">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h5 class="modal-title" id="exampleModalLongTitle">Thank You</h5>
|
||||||
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||||
|
<span aria-hidden="true">×</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<div class="success-message">
|
||||||
|
<div class="title">
|
||||||
|
<h1>Thank You</h1>
|
||||||
|
</div>
|
||||||
|
<div class="container" style="margin-top: 3rem">
|
||||||
|
<p>Thanks for letting us know about your interest! We will come back to you as soon as our beta program starts!</p>
|
||||||
|
<p>Meanwhile, you can checkout news about it on <a href="#" >Twitter</a>, <a href="#" >Facebook</a> and <a href="#" >Instagram</a> </p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<script>
|
<script>
|
||||||
! function(e, t, a, n, c, o) {
|
! function(e, t, a, n, c, o) {
|
||||||
e.GoogleAnalyticsObject = n, e[n] || (e[n] = function() {
|
e.GoogleAnalyticsObject = n, e[n] || (e[n] = function() {
|
||||||
|
|
@ -58,6 +79,7 @@
|
||||||
}(window, document, "script", "ga"), ga("create", "UA-XXXXX-X"), ga("send", "pageview")
|
}(window, document, "script", "ga"), ga("create", "UA-XXXXX-X"), ga("send", "pageview")
|
||||||
</script>
|
</script>
|
||||||
<script src="{% static 'datacenterlight/js/vendor.js' %}"></script>
|
<script src="{% static 'datacenterlight/js/vendor.js' %}"></script>
|
||||||
|
<script src="{% static 'datacenterlight/js/plugin.js' %}"></script>
|
||||||
<script src="{% static 'datacenterlight/js/main.js' %}"></script>
|
<script src="{% static 'datacenterlight/js/main.js' %}"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue