diff --git a/datacenterlight/static/datacenterlight/css/landing-page.css b/datacenterlight/static/datacenterlight/css/landing-page.css index d943a8e9..c9fd76aa 100755 --- a/datacenterlight/static/datacenterlight/css/landing-page.css +++ b/datacenterlight/static/datacenterlight/css/landing-page.css @@ -20,7 +20,7 @@ h3, h4, h5, h6 { - font-family: 'Lato-Regular', sans-serif; + font-family: 'Lato', sans-serif; font-weight: 300; } /*blue light #5A74AF*/ @@ -108,10 +108,12 @@ h6 { } .navbar-default .navbar-nav>li>a { cursor: pointer; + font-family: 'Lato-Regular', sans-serif; } .navbar-transparent .navbar-nav>li>a { color: #fff; cursor: pointer; + font-family: 'Lato-Regular', sans-serif; } .navbar-transparent .navbar-nav>li>a:hover { color: #fff; @@ -145,11 +147,13 @@ h6 { } .navbar-transparent .nav-language .select-language{ color: #fff; + font-family: 'Lato-Regular', sans-serif; } .nav-language .select-language span{ margin-left: 5px; margin-right: 5px; + font-family: 'Lato-Regular', sans-serif; } .nav-language .drop-language{ @@ -171,6 +175,7 @@ h6 { } .nav-language .drop-language a{ cursor: pointer; + font-family: 'Lato-Regular', sans-serif; } .navbar-transparent .nav-language .drop-language{ background: transparent; @@ -178,6 +183,7 @@ h6 { } .navbar-transparent .nav-language .drop-language a{ color: #fff; + font-family: 'Lato-Regular', sans-serif; } .nav-language:hover .drop-language{ display: block; @@ -444,7 +450,8 @@ h6 { text-align: left; } .pricing-section .text .section-heading{ - font-size: 50px; + /*font-size: 50px;*/ + font-size: 48px; line-height: 50px; padding-bottom: 25px; color: #3a3a3a; @@ -570,6 +577,138 @@ h6 { width: 70px; right: 0; } +/*Why DCL*/ +.full-whydcl-sec { + color: #fff; + text-align: center; + background-image: -ms-linear-gradient(right, #29427A 50%, #4F6699 100%); + background-image: -moz-linear-gradient(right, #29427A 50%, #4F6699 100%); + background-image: -o-linear-gradient(right, #29427A 50%, #4F6699 100%); + background-image: -webkit-gradient(linear, right top, left top, color-stop(50, #29427A), color-stop(100, #4F6699)); + background-image: -webkit-linear-gradient(right, #29427A 50%, #4F6699 100%); + background-image: linear-gradient(to left, #29427A 50%, #4F6699 100%); +} +.whydcl-header { + padding: 150px 0 150px 0; + text-align: center; + color: #f8f8f8; + background: url(../img/pattern.jpg) no-repeat center center; + background-size: cover; + position: relative; + background-attachment: fixed; +} +.whydcl-header::before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: rgba(90, 116, 175,0.85); + /*background: rgba(45,70,122,0.8);*/ +} +.single-heading h2 { + font-size: 65px; + margin: 0; + padding: 0; +} +#tech_stack { + background: #fff; +} +#tech_stack h3 { + font-size: 42px; + width: 70%; +} +hr.thick-divider { + border-top: 3px solid #eee !important; +} +.space { + padding: 50px 0; +} +tech-sub-sec h2 { + font-size: 45px; + line-height: 60px; + padding-bottom: 25px; + color: #3a3a3a; + letter-spacing: 1px; +} +.logo-wrap { + text-align: center; + min-height: 140px; + padding: 20px 40px 30px 40px; +} +.btm-space{ + padding-bottom: 8px; +} +.percent-text { + font-size: 50px; + color: #999; +} +.tech-sub-sec h2 { + font-size: 40px; + line-height: 55px; +} +.space-middle{ + padding: 45px 0; +} +.padding-vertical{ + padding: 35px 0; +} +.percent-text img { + margin-left:20px; +} +.space-block { + padding: 30px 0; +} +.dropdown-menu { + border: 1px solid #fff; + -webkit-box-shadow: -8px 13px 31px -8px rgba(77,77,77,1); + -moz-box-shadow: -8px 13px 31px -8px rgba(77,77,77,1); + box-shadow: -8px 13px 31px -8px rgba(77,77,77,1); + display: none; + text-align: center; + border-radius: 4px !important; + padding: 5px !important; +} +.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover { + background: transparent; + text-decoration: underline !important; +} +.logo-wrap .logo-caption { + padding-top: 20px; + display: inline-block; + color: #999 !important; +} +.lead-light { + color: #999 !important; + line-height: 32px !important; +} +.logo-wrap-1 { + padding-top: 50px; +} +.dropdown-menu > li > a { + padding: 1px 10px !important; +} +.dropdown-menu{ + left: 0 !important; + min-width: 155px; + text-align: left; + margin-left: 15px; +} +.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover { + background: transparent; + color: #fff; +} +.dropdown-menu > li > a { + font-size: 13px; + font-weight: 300; + font-family: 'Lato-Regular', sans-serif; +} +.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover { + background: #2D457A; + color: #fff; + border-radius: 6px; +} /*Pricing page*/ @@ -578,6 +717,7 @@ h6 { background: -webkit-linear-gradient(top, #f0f4f7, #fff) no-repeat; background: linear-gradient(to bottom, #f0f4f7, #fff) no-repeat; display: flex; + font-family: 'Lato-Regular', sans-serif; } .price-calc-section .text{ width: 50%; @@ -633,6 +773,7 @@ h6 { padding: 15px 40px; } .price-calc-section .card .title h3{ + font-family: 'Lato-Regular', sans-serif; } .price-calc-section .card .price{ background: #5A74AF; @@ -737,7 +878,62 @@ color: #eb4d5c; margin: 0; border-bottom: 1px solid rgba(128, 128, 128, 0.3); } +@media(max-width:767px) { + .percent-text { + font-size: 50px; + } + #tech_stack h3 { + font-size: 30px; + line-height: 40px; + width: 100%; + } + .navbar-nav .open .dropdown-menu { + text-align: left; + font-size: 12px; + } + .visible-mobile { + display:block; + } + .visible-desktop { + display:none !important; + } + .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover { + background: transparent; + color: #777 !important; +} +} +@media screen and (min-device-width: 480px) and (max-device-width: 767px) { +.logo-wrap { + width: 50%; + padding: 15px 30px !important; + min-height: 179px; +} +.logo-wrap-1 { + width: 50%; + padding: 15px 30px !importantx; + min-height: 179px; +} +.landscape-xs-6{ + width: 50%; +} +.landscape-xs-8{ + width: 66.66666667%; +} +.landscape-xs-4{ + width: 33.33333333%; +} + +} +@media(min-width:768px) { + .visible-mobile { + display:none !important; + } + .visible-desktop { + display:block; + } + +} @media(max-width:990px) { .pricing-section .text { text-align: center; @@ -753,6 +949,22 @@ color: #eb4d5c; } @media(max-width:768px) { +.percent-text { + font-size: 43px; +} + .tech-sub-sec h2 { + font-size: 30px; +line-height: 40px; +} +.single-heading h2 { + font-size: 50px; + } +.logo-wrap { + padding: 10px; +} +.navbar-transparent li a { + color: #777 !important; +} .intro-message { padding-bottom: 15%; } @@ -794,7 +1006,7 @@ color: #eb4d5c; display: none; } .navbar-transparent .navbar-nav>li>a { - font-size: 15px; + font-size: 14px; color: #777; } .nav-language:hover{ @@ -931,6 +1143,12 @@ color: #eb4d5c; } @media(max-width:540px) { +.logo-wrap { + padding: 30px; +} +.percent-text { + text-align: center; +} .pricing-section .card { width: 90%; } @@ -952,6 +1170,14 @@ color: #eb4d5c; font-size: 15px; margin-left: 0px; } + .pull-left.space-middle { + width: 67%; + padding: 20px 0px; + text-align: left; +} +.pull-left.ssdimg { + width: 30%; +} } @@ -995,9 +1221,11 @@ color: #eb4d5c; margin-top: 15px; } } - - - +@media(min-width:1200px) { +.container-small{ + width:980px; +} +} footer { padding: 50px 0; diff --git a/datacenterlight/static/datacenterlight/img/Ceph_Logo.png b/datacenterlight/static/datacenterlight/img/Ceph_Logo.png new file mode 100644 index 00000000..44046920 Binary files /dev/null and b/datacenterlight/static/datacenterlight/img/Ceph_Logo.png differ diff --git a/datacenterlight/static/datacenterlight/img/cdistbyungleich.png b/datacenterlight/static/datacenterlight/img/cdistbyungleich.png new file mode 100644 index 00000000..433db7d5 Binary files /dev/null and b/datacenterlight/static/datacenterlight/img/cdistbyungleich.png differ diff --git a/datacenterlight/static/datacenterlight/img/devuan.png b/datacenterlight/static/datacenterlight/img/devuan.png new file mode 100644 index 00000000..102dd476 Binary files /dev/null and b/datacenterlight/static/datacenterlight/img/devuan.png differ diff --git a/datacenterlight/static/datacenterlight/img/django.png b/datacenterlight/static/datacenterlight/img/django.png new file mode 100644 index 00000000..a89b6c76 Binary files /dev/null and b/datacenterlight/static/datacenterlight/img/django.png differ diff --git a/datacenterlight/static/datacenterlight/img/opennebula.png b/datacenterlight/static/datacenterlight/img/opennebula.png new file mode 100644 index 00000000..da2ce1c6 Binary files /dev/null and b/datacenterlight/static/datacenterlight/img/opennebula.png differ diff --git a/datacenterlight/static/datacenterlight/img/prometheus.png b/datacenterlight/static/datacenterlight/img/prometheus.png new file mode 100644 index 00000000..e7cca8e3 Binary files /dev/null and b/datacenterlight/static/datacenterlight/img/prometheus.png differ diff --git a/datacenterlight/static/datacenterlight/img/python-logo.png b/datacenterlight/static/datacenterlight/img/python-logo.png new file mode 100644 index 00000000..192f83f0 Binary files /dev/null and b/datacenterlight/static/datacenterlight/img/python-logo.png differ diff --git a/datacenterlight/static/datacenterlight/img/ssd.jpg b/datacenterlight/static/datacenterlight/img/ssd.jpg new file mode 100644 index 00000000..1a0cdfe9 Binary files /dev/null and b/datacenterlight/static/datacenterlight/img/ssd.jpg differ diff --git a/datacenterlight/static/datacenterlight/img/tayga.png b/datacenterlight/static/datacenterlight/img/tayga.png new file mode 100644 index 00000000..07b9e092 Binary files /dev/null and b/datacenterlight/static/datacenterlight/img/tayga.png differ diff --git a/datacenterlight/static/datacenterlight/js/main.js b/datacenterlight/static/datacenterlight/js/main.js index 26688e8e..bfe92631 100644 --- a/datacenterlight/static/datacenterlight/js/main.js +++ b/datacenterlight/static/datacenterlight/js/main.js @@ -53,6 +53,16 @@ /* --------------------------------------------- Nav panel classic --------------------------------------------- */ + if (window.matchMedia("(min-width: 767px)").matches) { + $('ul.nav li.dropdown').hover(function() { + $(this).find('.dropdown-menu').stop(true, true).delay(200).fadeIn(500); + }, function() { + $(this).find('.dropdown-menu').stop(true, true).delay(200).fadeOut(500); + }); +} else { + /* the viewport is less than 400 pixels wide */ +} + function _initScroll(){ @@ -66,9 +76,13 @@ if($(window).scrollTop() > 10 ){ $(".navbar").removeClass("navbar-transparent"); $(".navbar-default .btn-link").css("color", "#777"); + $(".dropdown-menu").removeClass("navbar-transparent"); + $(".dropdown-menu > li > a").css("color", "#777"); }else{ $(".navbar").addClass("navbar-transparent"); $(".navbar-default .btn-link").css("color", "#fff"); + $(".dropdown-menu").addClass("navbar-transparent"); + $(".dropdown-menu > li > a").css("color", "#fff"); } } function _initNavUrl(){ diff --git a/datacenterlight/templates/datacenterlight/includes/_navbar.html b/datacenterlight/templates/datacenterlight/includes/_navbar.html index 0d2f43f1..cb1a7180 100644 --- a/datacenterlight/templates/datacenterlight/includes/_navbar.html +++ b/datacenterlight/templates/datacenterlight/includes/_navbar.html @@ -1,67 +1,64 @@ {% load staticfiles i18n%} {% get_current_language as LANGUAGE_CODE %} {% load custom_tags %} - diff --git a/datacenterlight/templates/datacenterlight/whydatacenterlight.html b/datacenterlight/templates/datacenterlight/whydatacenterlight.html new file mode 100644 index 00000000..fa85721c --- /dev/null +++ b/datacenterlight/templates/datacenterlight/whydatacenterlight.html @@ -0,0 +1,254 @@ +{% extends "datacenterlight/base.html" %} +{% load staticfiles i18n%} +{% get_current_language as LANGUAGE_CODE %} + +{% block content %} + + + +
+
+
+
+
+
+

{% trans "Why Data Center Light?" %}

+
+
+
+
+
+
+
+
+
+
+
+
+
+

{% trans "Tech Stack" %}

+
+
+

{% trans "We are seriously open source." %}

+

{% blocktrans %} Our full software stack is open source – We don't use anything that isn't open source.
Yes, we are that cool. {% endblocktrans %}

+
+
+
+
+
+ Devuan + {% trans "Our services run on" %} +
+
+ Prometheus + {% trans "Our monitoring" %} +
+
+ Ceph + {% trans "Our storage layer" %} +
+
+ Django + {% trans "Our web frontend" %} +
+
+ Opennebula + {% trans "Our cloud" %} +
+
+ Cdist by ungleich + {% trans "Our configuration management system" %} +
+
+ Python + {% trans "Our awesome juice" %} +
+
+ Tayga + {% trans "Our NAT64 gateway" %} +
+ +
+
+
+
+ +
+
+
+
+
+
+ Opennebula +
+
+ Cdist byu ngleich +
+
+ Prometheus +
+
+
+
+

{% trans "We believe in giving back to the FOSS community." %}

+

{% blocktrans %}Data Center Light is the child of free and open source software (FOSS).
We grew up with it, live by it, and believe in it.
The more we work on our data center,
the more we contribute back to the FOSS community.{% endblocktrans %}

+
+
+
+
+
+ +
+
+
+
+
+
+

{% trans "We bring the future to you." %}

+
+
+

{% blocktrans %} Data Center Light uses the most modern technologies out there.
+ Your VM needs only IPv6. Data Center Light provides
transparent two-way IPv6/IPv4 translation. + {% endblocktrans %}

+
+
+ 100% IPv6 +
+
+
+
+
+ 100% SSD SSD +
+
+
+

{% blocktrans %} No more spinning metal plates! Data Center Light uses only SSDs. We keep things faster and lighter. {% endblocktrans %}

+
+
+
+ + + +
+
+
+ +
+ +
+ +
+ +
+
+

{% trans "Starting from only 15CHF per month. Try now." %}

+

{% trans "Actions speak louder than words. Let's do it, try our VM now." %}

+
+ +
+
+
+ +
+
+ {% csrf_token %} +
+

{% trans "VM hosting" %}

+
+
+ 15 + CHF/{% trans "month" %} +
+

{% trans "VAT included" %}

+
+
+
+
+

{% trans "Hosted in Switzerland" %}

+
+
+
+ + + Core + +
+
+
+
+
+ + + GB RAM + +
+
+
+
+
+ + + {% trans "GB Storage (SSD)" %} + +
+
+
+
+ + +
+ + +
+
+ + +
+
+ {% for message in messages %} + {% if 'name' in message.tags %} +
  • + {{ message|safe }} +
+ {% endif %} + {% endfor %} +
+
+
+
+ + +
+
+ {% for message in messages %} + {% if 'email' in message.tags %} +
  • + {{ message|safe }} +
+ {% endif %} + {% endfor %} +
+
+
+ +
+
+
+
+ +
+
+
+ +
+ + + + + {% endblock %} diff --git a/datacenterlight/urls.py b/datacenterlight/urls.py index ca844278..33ea644e 100644 --- a/datacenterlight/urls.py +++ b/datacenterlight/urls.py @@ -1,10 +1,11 @@ from django.conf.urls import url -from .views import IndexView, BetaProgramView, LandingProgramView, BetaAccessView, PricingView, SuccessView, PaymentOrderView, OrderConfirmationView +from .views import IndexView, BetaProgramView, LandingProgramView, BetaAccessView, PricingView, SuccessView, PaymentOrderView, OrderConfirmationView, WhyDataCenterLightView urlpatterns = [ url(r'^/?$', IndexView.as_view(), name='index'), + url(r'^/whydatacenterlight/?$', WhyDataCenterLightView.as_view(), name='whydatacenterlight'), url(r'^/beta-program/?$', BetaProgramView.as_view(), name='beta'), url(r'^/landing/?$', LandingProgramView.as_view(), name='landing'), url(r'^/pricing/?$', PricingView.as_view(), name='pricing'), diff --git a/datacenterlight/views.py b/datacenterlight/views.py index b7c08a63..51256053 100644 --- a/datacenterlight/views.py +++ b/datacenterlight/views.py @@ -185,7 +185,6 @@ class BetaProgramView(CreateView): messages.add_message(self.request, messages.SUCCESS, self.success_message) return HttpResponseRedirect(self.get_success_url()) - class IndexView(CreateView): template_name = "datacenterlight/index.html" model = BetaAccess @@ -307,6 +306,27 @@ class IndexView(CreateView): messages.add_message(self.request, messages.SUCCESS, self.success_message) return super(IndexView, self).form_valid(form) +class WhyDataCenterLightView(IndexView): + template_name = "datacenterlight/whydatacenterlight.html" + model = BetaAccess + + @cache_control(no_cache=True, must_revalidate=True, no_store=True) + 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) class PaymentOrderView(FormView): template_name = 'hosting/payment.html'