Attempted manual merge to avoid conflicts
This commit is contained in:
parent
96272ffd44
commit
cd524350d8
7 changed files with 328 additions and 121 deletions
|
@ -289,6 +289,10 @@ h6 {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
.intro-pricing.success-pricing{
|
||||||
|
height: 100vh;
|
||||||
|
max-height: 100vh;
|
||||||
|
}
|
||||||
.intro-pricing::before{
|
.intro-pricing::before{
|
||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -296,7 +300,7 @@ h6 {
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
background: rgba(90, 116, 175, 0.8);
|
background: rgba(90, 116, 175, 0.7);
|
||||||
}
|
}
|
||||||
.intro-pricing .intro-message .section-heading{
|
.intro-pricing .intro-message .section-heading{
|
||||||
font-size: 45px;
|
font-size: 45px;
|
||||||
|
@ -578,8 +582,8 @@ h6 {
|
||||||
}
|
}
|
||||||
.price-calc-section .text .section-heading{
|
.price-calc-section .text .section-heading{
|
||||||
font-family: 'Montserrat-Bold';
|
font-family: 'Montserrat-Bold';
|
||||||
font-size: 48px;
|
font-size: 50px;
|
||||||
line-height: 48px;
|
line-height: 50px;
|
||||||
padding-bottom: 25px;
|
padding-bottom: 25px;
|
||||||
color: #3a3a3a;
|
color: #3a3a3a;
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
|
@ -636,24 +640,22 @@ h6 {
|
||||||
border-bottom: 1px solid rgba(128, 128, 128, 0.3);
|
border-bottom: 1px solid rgba(128, 128, 128, 0.3);
|
||||||
position: relative;
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: space-around;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.price-calc-section .card .description span{
|
.price-calc-section .card .description span {
|
||||||
font-size: 20px;
|
font-size: 16px;
|
||||||
margin-left: 4px;
|
margin-left: 4px;
|
||||||
|
margin-left: 0px;
|
||||||
|
/* justify-self: start; */
|
||||||
|
width: 30%;
|
||||||
|
text-align: left;
|
||||||
}
|
}
|
||||||
.price-calc-section .card .description input{
|
.price-calc-section .card .description input{
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
width: 70px;
|
width: 60px;
|
||||||
}
|
|
||||||
.price-calc-section .card .description #coreValue{
|
|
||||||
width: 50px;
|
|
||||||
}
|
|
||||||
.price-calc-section .card .description #ramValue{
|
|
||||||
width: 50px;
|
|
||||||
}
|
}
|
||||||
.price-calc-section .card .description i{
|
.price-calc-section .card .description i{
|
||||||
color: #29427A;
|
color: #29427A;
|
||||||
|
@ -684,12 +686,32 @@ h6 {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
width: 200px;
|
width: 200px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 18px;
|
font-size: 16px;
|
||||||
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
.price-calc-section .card .check-ip{
|
.price-calc-section .card .check-ip{
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
}
|
}
|
||||||
|
.price-calc-section .card .description.input{
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.price-calc-section .card .description.input label{
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 800;
|
||||||
|
font-family: 'Montserrat-Regular';
|
||||||
|
margin-bottom: 0;
|
||||||
|
width: 40px;
|
||||||
|
}
|
||||||
|
.price-calc-section .card .description.input input{
|
||||||
|
width: 200px;
|
||||||
|
font-size: 14px;
|
||||||
|
text-align: left;
|
||||||
|
padding: 5px 10px;
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #d0d0d0;
|
||||||
|
background: #fff;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
.price-calc-section .card .check-ip input[type=checkbox]{
|
.price-calc-section .card .check-ip input[type=checkbox]{
|
||||||
font-size: 17px;
|
font-size: 17px;
|
||||||
margin: 0 8px;
|
margin: 0 8px;
|
||||||
|
@ -814,6 +836,10 @@ h6 {
|
||||||
transform: translate(-50%, 0);
|
transform: translate(-50%, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.intro-pricing .intro-message .section-heading {
|
||||||
|
font-size: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
.price-calc-section{
|
.price-calc-section{
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding: 60px 10px !important;
|
padding: 60px 10px !important;
|
||||||
|
@ -842,6 +868,14 @@ h6 {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.price-calc-section .card .description input {
|
||||||
|
font-size: 17px;
|
||||||
|
text-align: center;
|
||||||
|
width: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media(max-width:540px) {
|
@media(max-width:540px) {
|
||||||
|
@ -858,13 +892,13 @@ h6 {
|
||||||
.intro-message > h1 {
|
.intro-message > h1 {
|
||||||
font-size: 2em;
|
font-size: 2em;
|
||||||
}
|
}
|
||||||
.price-calc-section .text .section-heading {
|
.price-calc-section .text .section-heading {
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
line-height: 25px;
|
line-height: 25px;
|
||||||
}
|
}
|
||||||
.price-calc-section .card .description span {
|
.price-calc-section .card .description span {
|
||||||
font-size: 17px;
|
font-size: 15px;
|
||||||
margin-left: 4px;
|
margin-left: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -960,3 +994,7 @@ a#forgotpassword {
|
||||||
.form-300{
|
.form-300{
|
||||||
width: 300px;
|
width: 300px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.error-message-box{
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
|
@ -18,7 +18,7 @@
|
||||||
<span style="color: white">{{ form.email.errors|striptags}}</span>
|
<span style="color: white">{{ form.email.errors|striptags}}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<button type="submit" class="btn btn-default btn-transparent btn-lg">{% trans "Request Newsletter" %}</button>
|
<button type="submit" class="btn btn-default btn-transparent btn-lg">{% trans "Request Beta Access" %}</button>
|
||||||
</form>
|
</form>
|
||||||
<script>
|
<script>
|
||||||
$('#beta_access').ajaxForm({
|
$('#beta_access').ajaxForm({
|
||||||
|
|
|
@ -260,7 +260,7 @@
|
||||||
<p>{% trans "10 GB Storage (SSD)" %}</p>
|
<p>{% trans "10 GB Storage (SSD)" %}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<a href="{% url 'datacenterlight:pricing' %}" class="btn btn-primary">{% trans "Order Now!" %}</a>
|
<a href="{% url 'datacenterlight:order' %}" class="btn btn-primary">{% trans "Order Now!" %}</a>
|
||||||
</div>
|
</div>
|
||||||
<img class="img-beta" src="{% static 'datacenterlight/img/beta-img.png' %}" alt="">
|
<img class="img-beta" src="{% static 'datacenterlight/img/beta-img.png' %}" alt="">
|
||||||
</div>
|
</div>
|
||||||
|
@ -276,7 +276,7 @@
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-6 col-md-6">
|
<div class="col-sm-6 col-md-6">
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<h2>{% trans "Want to know more? Subscribe to our newsletter!" %}</h2>
|
<h2>{% trans "I want to have it!" %}</h2>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-6 col-md-6">
|
<div class="col-sm-6 col-md-6">
|
||||||
|
|
|
@ -1,5 +1,7 @@
|
||||||
|
{% load staticfiles i18n%}
|
||||||
|
{% get_current_language as LANGUAGE_CODE %}
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="{{LANGUAGE_CODE}}">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
|
|
||||||
|
@ -9,19 +11,24 @@
|
||||||
<meta name="description" content="">
|
<meta name="description" content="">
|
||||||
<meta name="author" content="">
|
<meta name="author" content="">
|
||||||
|
|
||||||
<title>Rails Hosting.ch - Ruby on Rails as easy as possible</title>
|
<title>datacenterlight.ch - Featherlight Swiss VM</title>
|
||||||
|
|
||||||
<!-- Bootstrap Core CSS -->
|
<!-- Bootstrap Core CSS -->
|
||||||
<link href="css/bootstrap.min.css" rel="stylesheet">
|
<link href="{% static 'datacenterlight/css/bootstrap.min.css' %}" rel="stylesheet">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- Custom CSS -->
|
|
||||||
<link href="css/landing-page.css" rel="stylesheet">
|
|
||||||
|
|
||||||
<!-- Custom Fonts -->
|
<!-- Custom Fonts -->
|
||||||
<link href='http://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
|
<!--Import Google Icon Font-->
|
||||||
<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
|
<link href="//fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||||
<link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
|
<link href="{% static 'datacenterlight/font-awesome/css/font-awesome.min.css' %}" rel="stylesheet" type="text/css">
|
||||||
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon" />
|
<link href="//fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
|
||||||
|
<link rel="shortcut icon" href="{% static 'datacenterlight/img/favicon.ico' %}" type="image/x-icon" />
|
||||||
|
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.5.4/bootstrap-select.min.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Custom CSS -->
|
||||||
|
<link href="{% static 'datacenterlight/css/landing-page.css' %}" rel="stylesheet">
|
||||||
|
|
||||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
<!-- 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:// -->
|
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||||
|
@ -36,7 +43,7 @@
|
||||||
|
|
||||||
<!-- Navigation -->
|
<!-- Navigation -->
|
||||||
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
|
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
|
||||||
<div class="container topnav">
|
<div class="topnav">
|
||||||
<!-- Brand and toggle get grouped for better mobile display -->
|
<!-- Brand and toggle get grouped for better mobile display -->
|
||||||
<div class="navbar-header">
|
<div class="navbar-header">
|
||||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
|
||||||
|
@ -45,109 +52,142 @@
|
||||||
<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="#"><img src="img/logo_black.svg"></a>
|
<a id="logoBlack" class="navbar-brand topnav url" href="{% url 'datacenterlight:index' %}" ><img src="{% static 'datacenterlight/img/logo_black.svg' %}"></a>
|
||||||
|
<a id="logoWhite" class="navbar-brand topnav url" href="{% url 'datacenterlight:index' %}" ><img src="{% static 'datacenterlight/img/logo_white.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">How it works</a>
|
<a class="url" href="javascript:void(0)" data-url="#how" >{% trans "What is it" %}</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#your">Your infrastructure</a>
|
<a class="url" href="javascript:void(0)" data-url="#your" >{% trans "Scale out" %}</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#our">Our inftrastructure</a>
|
<a class="url" href="javascript:void(0)" data-url="#our">{% trans "Reliable and light" %}</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#price">Pricing</a>
|
<a class="url" href="javascript:void(0)" data-url="#price" >{% trans "Buy VM" %}</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#contact">Contact</a>
|
<a class="url" href="javascript:void(0)" data-url="#contact" >{% trans "Contact" %}</a>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-language">
|
||||||
|
<div class="select-language">
|
||||||
|
{% if LANGUAGE_CODE == 'en-us'%}
|
||||||
|
<span>English</span>
|
||||||
|
{% else %}
|
||||||
|
<span>Deutsch</span>
|
||||||
|
{% endif %}
|
||||||
|
<i class="fa fa-globe" aria-hidden="true"></i>
|
||||||
|
</div>
|
||||||
|
<div class="drop-language">
|
||||||
|
{% if LANGUAGE_CODE == 'en-us'%}
|
||||||
|
<a class="url" href="{{base_url}}/de/datacenterlight/order" >Deutsch</a>
|
||||||
|
{% else %}
|
||||||
|
<a class="url" href="{{base_url}}/en-us/datacenterlight/order" >English</a>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
</div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- /.navbar-collapse -->
|
<!-- /.navbar-collapse -->
|
||||||
</div>
|
</div>
|
||||||
<!-- /.container -->
|
<!-- /.container -->
|
||||||
</nav>
|
</nav>
|
||||||
|
<div class="intro-pricing">
|
||||||
|
|
||||||
|
<div class="intro-message">
|
||||||
|
<h2 class="section-heading">{% trans "We are cutting down the costs significantly!" %}</h2>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- Header -->
|
</div>
|
||||||
<a name="about"></a>
|
|
||||||
<div class="intro-header">
|
|
||||||
<div class="container">
|
|
||||||
<div class="col-md-4"> </div><div class="col-md-4">
|
|
||||||
|
|
||||||
<div class="intro-message">
|
<div class="price-calc-section">
|
||||||
<p><img class="responsive" src="img/Beta.png"></p>
|
<div class="card">
|
||||||
<h2>Order Now </h2>
|
<img class="img-beta" src="{% static 'datacenterlight/img/beta-img.png' %}" alt="">
|
||||||
<p> </p>
|
<div class="caption">
|
||||||
<!--Location button-->
|
<form id="order_form" method="POST" action="">
|
||||||
<div class="form-group">
|
{% csrf_token %}
|
||||||
<label for="button">Loation<br></label>
|
|
||||||
<div class="btn-group">
|
|
||||||
<button type="button" class="btn btn-default">Switzerland</button>
|
|
||||||
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
||||||
<span class="caret"></span>
|
|
||||||
<span class="sr-only">Location</span>
|
|
||||||
</button>
|
|
||||||
<ul class="dropdown-menu">
|
|
||||||
<li><a href="#">Germany</a></li>
|
|
||||||
<li><a href="#">Switzerland</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<!--/Location button-->
|
|
||||||
<p> </p>
|
|
||||||
<!--Configuration button-->
|
|
||||||
<form>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="button">Configuration<br></label>
|
|
||||||
<div class="btn-group">
|
|
||||||
<button type="button" class="btn btn-default">Ruby On Rails on Debian 7</button>
|
|
||||||
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
||||||
<span class="caret"></span>
|
|
||||||
<span class="sr-only">Configuration</span>
|
|
||||||
</button>
|
|
||||||
<ul class="dropdown-menu">
|
|
||||||
<li><a href="#">Ruby On Rails on Debian 7</a></li>
|
|
||||||
<li><a href="#">Ubuntu 14.04</a></li>
|
|
||||||
<li><a href="#">Debian 7</a></li>
|
|
||||||
<li><a href="#">CentOS 7</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<p>VM size sliders to be inserted</p>
|
|
||||||
<!--/Configuration button-->
|
|
||||||
<form>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleInputEmail1"><br>
|
|
||||||
Email address</label>
|
|
||||||
<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleInputPassword1">Password</label>
|
|
||||||
<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
|
|
||||||
</div>
|
|
||||||
<div class>
|
|
||||||
<p><a href="#" id="forgotpassword">
|
|
||||||
Forgot password?</a>
|
|
||||||
</p>
|
|
||||||
<p> </p>
|
|
||||||
</div>
|
|
||||||
<button type="submit" class="btn btn-default">Order</button>
|
|
||||||
</form></p>
|
|
||||||
<ul class="list-inline intro-social-buttons">
|
|
||||||
|
|
||||||
</ul></div> <div class="col-md-4"></div>
|
<div class="title">
|
||||||
</div>
|
<h3>{% trans "VM hosting" %} </h3>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="price">
|
||||||
|
<span id="total">15</span>
|
||||||
|
<span>CHF</span>
|
||||||
|
</div>
|
||||||
|
<div class="descriptions">
|
||||||
|
<div class="description">
|
||||||
|
<p>{% trans "Hosted in Switzerland" %}</p>
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<i class="fa fa-minus-circle left" data-minus="cpu" aria-hidden="true"></i>
|
||||||
|
<input class="input-price" type="number" min="1" max="42" id="coreValue" name="cpu">
|
||||||
|
<span> Core</span>
|
||||||
|
<i class="fa fa-plus-circle right" data-plus="cpu" aria-hidden="true"></i>
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<i class="fa fa-minus-circle left" data-minus="ram" aria-hidden="true"></i>
|
||||||
|
<input id="ramValue" class="input-price" type="number" min="2" max="200" name="ram">
|
||||||
|
<span> GB RAM</span>
|
||||||
|
<i class="fa fa-plus-circle right" data-plus="ram" aria-hidden="true"></i>
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<i class="fa fa-minus-circle left" data-minus="storage" aria-hidden="true"></i>
|
||||||
|
<input id="storageValue" class="input-price" type="number" min="10" max="500" step="10" name="storage">
|
||||||
|
<span>{% trans "GB Storage (SSD)" %}</span>
|
||||||
|
<i class="fa fa-plus-circle right" data-plus="storage" aria-hidden="true"></i>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
|
||||||
<!-- /.container -->
|
|
||||||
|
|
||||||
</div>
|
<div class="description select-configuration input">
|
||||||
<!-- /.intro-header -->
|
<label for="config">OS</label>
|
||||||
|
<select name="config" id="">
|
||||||
|
{% for template in templates %}
|
||||||
|
<option value="{{template.id}}">{{template.name}} </option>
|
||||||
|
{% endfor %}
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<input type="hidden" name="total">
|
||||||
|
<!--<div class="description check-ip">
|
||||||
|
<input type="checkbox" name="ipv6"> Ipv6 Only<br>
|
||||||
|
</div>-->
|
||||||
|
|
||||||
|
<div class="description input">
|
||||||
|
<label for="name">Name</label>
|
||||||
|
<input type="text" name="name" placeholder="Your Name">
|
||||||
|
</div>
|
||||||
|
<div class="description input">
|
||||||
|
<label for="email">Email</label>
|
||||||
|
<input type="email" name="email" placeholder="Your Email">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<input type="submit" class="btn btn-primary" value="{% trans 'Order Now!' %}"></input>
|
||||||
|
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div id="error_message_box" class="error-message-box"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="text">
|
||||||
|
<h2 class="section-heading">{% trans "Simple and affordable: Try our virtual machine with featherlight price." %}</h2>
|
||||||
|
|
||||||
|
<div class="description">
|
||||||
|
<p>{% trans "Our VMs are hosted in Glarus, Switzerland, and our website is currently running in BETA mode. If you want more information that you did not find on our website, or if your order is more detailed, or if you encounter any technical hiccups, please contact us at support@datacenterlight.ch, our team will get in touch with you asap." %}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- /.banner -->
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer>
|
<footer>
|
||||||
|
@ -156,37 +196,84 @@
|
||||||
<div class="col-lg-12">
|
<div class="col-lg-12">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<a href="#">Home</a>
|
<a href="#">{% trans "Home" %}</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="footer-menu-divider">⋅</li>
|
<li class="footer-menu-divider">⋅</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#about">How it works</a></li>
|
<a href="#about">{% trans "What is it" %}</a></li>
|
||||||
<li class="footer-menu-divider">⋅</li>
|
<li class="footer-menu-divider">⋅</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#about">Your infrastructure</a></li>
|
<a href="#about">{% trans "Scale out" %}</a></li>
|
||||||
<li>⋅</li>
|
<li>⋅</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#about">Our infrastructure</a></li>
|
<a href="#about">{% trans "Reliable and light" %}</a></li>
|
||||||
<li class="footer-menu-divider">⋅</li>
|
<li class="footer-menu-divider">⋅</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#services">Pricing</a>
|
<a href="#services">{% trans "Pricing" %}</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="footer-menu-divider">⋅</li>
|
<li class="footer-menu-divider">⋅</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#contact">Contact</a>
|
<a href="#contact">{% trans "Contact" %}</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<p class="copyright text-muted small">Copyright © ungleich GmbH 2015. All Rights Reserved</p>
|
<p class="copyright text-muted small">Copyright © ungleich GmbH {% now "Y" %}. All Rights Reserved</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<!-- jQuery -->
|
<!-- jQuery -->
|
||||||
<script src="js/jquery.js"></script>
|
<script src="{% static 'datacenterlight/js/jquery.js' %}"></script>
|
||||||
|
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.5.4/bootstrap-select.js"></script>
|
||||||
|
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
|
||||||
|
<script type="text/javascript">
|
||||||
|
$(document).ready(function(){
|
||||||
|
$.validator.setDefaults({
|
||||||
|
ignore: []
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#order_form').validate({
|
||||||
|
wrapper: 'div',
|
||||||
|
errorLabelContainer: "#error_message_box",
|
||||||
|
rules: {
|
||||||
|
name: {
|
||||||
|
required: true,
|
||||||
|
minlength: 3
|
||||||
|
},
|
||||||
|
email: {
|
||||||
|
required: true,
|
||||||
|
email: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
messages: {
|
||||||
|
name: "Please enter your name",
|
||||||
|
email: "Please enter a valid email address"
|
||||||
|
},
|
||||||
|
submitHandler: function (form) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
window.onload=function(){
|
||||||
|
$('.selectpicker').selectpicker({
|
||||||
|
style: 'btn-link',
|
||||||
|
windowPadding: 10,
|
||||||
|
});
|
||||||
|
|
||||||
|
var hash = window.location.hash.substr(1);
|
||||||
|
console.log(hash);
|
||||||
|
if (hash == 'requestform'){
|
||||||
|
$('#reques-success-message').modal('show');
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.5.4/bootstrap-select.js"></script>
|
||||||
|
|
||||||
<!-- Bootstrap Core JavaScript -->
|
<!-- Bootstrap Core JavaScript -->
|
||||||
<script src="js/bootstrap.min.js"></script>
|
<script src="{% static 'datacenterlight/js/bootstrap.min.js' %}"></script>
|
||||||
|
<script src="{% static 'datacenterlight/js/main.js' %}"></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{% load staticfiles i18n%}
|
{% load staticfiles i18n%}
|
||||||
{% get_current_language as LANGUAGE_CODE %}
|
{% get_current_language as LANGUAGE_CODE %}
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="{{LANGUAGE_CODE}}">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
from django.conf.urls import url
|
from django.conf.urls import url
|
||||||
|
|
||||||
from .views import IndexView, BetaProgramView, LandingProgramView, BetaAccessView, PricingView
|
from .views import IndexView, BetaProgramView, LandingProgramView, BetaAccessView, PricingView, SuccessView, OrderView
|
||||||
|
|
||||||
|
|
||||||
urlpatterns = [
|
urlpatterns = [
|
||||||
|
@ -8,5 +8,7 @@ urlpatterns = [
|
||||||
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'),
|
||||||
url(r'^/pricing/?$', PricingView.as_view(), name='pricing'),
|
url(r'^/pricing/?$', PricingView.as_view(), name='pricing'),
|
||||||
|
url(r'^/order/?$', OrderView.as_view(), name='order'),
|
||||||
|
url(r'^/order-success/?$', SuccessView.as_view(), name='order_success'),
|
||||||
url(r'^/beta_access?$', BetaAccessView.as_view(), name='beta_access'),
|
url(r'^/beta_access?$', BetaAccessView.as_view(), name='beta_access'),
|
||||||
]
|
]
|
||||||
|
|
|
@ -7,6 +7,8 @@ from django.core.urlresolvers import reverse_lazy, reverse
|
||||||
from utils.mailer import BaseEmail
|
from utils.mailer import BaseEmail
|
||||||
from django.shortcuts import render
|
from django.shortcuts import render
|
||||||
from django.shortcuts import redirect
|
from django.shortcuts import redirect
|
||||||
|
from django import forms
|
||||||
|
from django.core.exceptions import ValidationError
|
||||||
|
|
||||||
from opennebula_api.models import OpenNebulaManager
|
from opennebula_api.models import OpenNebulaManager
|
||||||
from opennebula_api.serializers import VirtualMachineTemplateSerializer
|
from opennebula_api.serializers import VirtualMachineTemplateSerializer
|
||||||
|
@ -14,6 +16,9 @@ from opennebula_api.serializers import VirtualMachineTemplateSerializer
|
||||||
class LandingProgramView(TemplateView):
|
class LandingProgramView(TemplateView):
|
||||||
template_name = "datacenterlight/landing.html"
|
template_name = "datacenterlight/landing.html"
|
||||||
|
|
||||||
|
class SuccessView(TemplateView):
|
||||||
|
template_name = "datacenterlight/success.html"
|
||||||
|
|
||||||
class PricingView(TemplateView):
|
class PricingView(TemplateView):
|
||||||
template_name = "datacenterlight/pricing.html"
|
template_name = "datacenterlight/pricing.html"
|
||||||
|
|
||||||
|
@ -63,6 +68,81 @@ class PricingView(TemplateView):
|
||||||
return redirect(reverse('hosting:payment'))
|
return redirect(reverse('hosting:payment'))
|
||||||
|
|
||||||
|
|
||||||
|
class OrderView(TemplateView):
|
||||||
|
template_name = "datacenterlight/order.html"
|
||||||
|
|
||||||
|
def get(self, request, *args, **kwargs):
|
||||||
|
try:
|
||||||
|
manager = OpenNebulaManager()
|
||||||
|
templates = manager.get_templates()
|
||||||
|
|
||||||
|
context = {
|
||||||
|
'templates': VirtualMachineTemplateSerializer(templates, many=True).data,
|
||||||
|
}
|
||||||
|
except:
|
||||||
|
messages.error( request,
|
||||||
|
'We have a temporary problem to connect to our backend. \
|
||||||
|
Please try again in a few minutes'
|
||||||
|
)
|
||||||
|
context = {
|
||||||
|
'error' : 'connection'
|
||||||
|
}
|
||||||
|
|
||||||
|
return render(request, self.template_name, context)
|
||||||
|
|
||||||
|
def post(self, request):
|
||||||
|
|
||||||
|
cores = request.POST.get('cpu')
|
||||||
|
memory = request.POST.get('ram')
|
||||||
|
storage = request.POST.get('storage')
|
||||||
|
price = request.POST.get('total')
|
||||||
|
template_id = int(request.POST.get('config'))
|
||||||
|
manager = OpenNebulaManager()
|
||||||
|
template = manager.get_template(template_id)
|
||||||
|
template_data = VirtualMachineTemplateSerializer(template).data
|
||||||
|
|
||||||
|
name = request.POST.get('name')
|
||||||
|
email = request.POST.get('email')
|
||||||
|
name_field = forms.CharField()
|
||||||
|
email_field = forms.EmailField()
|
||||||
|
try:
|
||||||
|
name = name_field.clean(name)
|
||||||
|
except ValidationError as err:
|
||||||
|
messages.add_message(self.request, messages.ERROR, '%(value) is not a proper name.'.format(name))
|
||||||
|
return HttpResponseRedirect(reverse('datacenterlight:order'))
|
||||||
|
|
||||||
|
try:
|
||||||
|
email = email_field.clean(email)
|
||||||
|
except ValidationError as err:
|
||||||
|
messages.add_message(self.request, messages.ERROR, '%(value) is not a proper email.'.format(email))
|
||||||
|
return HttpResponseRedirect(reverse('datacenterlight:order'))
|
||||||
|
|
||||||
|
# We have valid email and name of the customer, hence send an
|
||||||
|
# email to the admin
|
||||||
|
|
||||||
|
context = {
|
||||||
|
'base_url': "{0}://{1}".format(self.request.scheme, self.request.get_host()),
|
||||||
|
'name': name,
|
||||||
|
'email': email,
|
||||||
|
'cores': cores,
|
||||||
|
'memory': memory,
|
||||||
|
'storage': storage,
|
||||||
|
'price': price,
|
||||||
|
'template': template_data['name'],
|
||||||
|
}
|
||||||
|
email_data = {
|
||||||
|
'subject': 'New Order Received',
|
||||||
|
'to': 'info@ungleich.ch',
|
||||||
|
'context': context,
|
||||||
|
'template_name': 'new_order_notification',
|
||||||
|
'template_path': 'datacenterlight/emails/'
|
||||||
|
}
|
||||||
|
email = BaseEmail(**email_data)
|
||||||
|
email.send()
|
||||||
|
|
||||||
|
return HttpResponseRedirect(reverse('datacenterlight:order_success'))
|
||||||
|
|
||||||
|
|
||||||
class BetaAccessView(FormView):
|
class BetaAccessView(FormView):
|
||||||
template_name = "datacenterlight/beta_access.html"
|
template_name = "datacenterlight/beta_access.html"
|
||||||
form_class = BetaAccessForm
|
form_class = BetaAccessForm
|
||||||
|
|
Loading…
Reference in a new issue