From fa277af33f75ec73636eeb6e898c5667affa9dc2 Mon Sep 17 00:00:00 2001 From: Miguel Cardenas Date: Tue, 11 Jul 2017 20:04:32 -0500 Subject: [PATCH 01/25] prevent blink after click of menu elements --- .../datacenterlight/css/landing-page.css | 2114 +++++++++-------- .../static/datacenterlight/js/main.js | 307 +-- .../datacenterlight/includes/_navbar.html | 16 +- 3 files changed, 1305 insertions(+), 1132 deletions(-) diff --git a/datacenterlight/static/datacenterlight/css/landing-page.css b/datacenterlight/static/datacenterlight/css/landing-page.css index 077faef7..d407fffa 100755 --- a/datacenterlight/static/datacenterlight/css/landing-page.css +++ b/datacenterlight/static/datacenterlight/css/landing-page.css @@ -3,14 +3,16 @@ * Code licensed under the Apache License v2.0. * For details, see http://www.apache.org/licenses/LICENSE-2.0. */ + @font-face { - font-family: 'Lato-Regular'; - src: url('../fonts/Lato/Lato-Regular.ttf'); + font-family: 'Lato-Regular'; + src: url('../fonts/Lato/Lato-Regular.ttf'); } + body, html { - width: 100%; - height: 100%; + width: 100%; + height: 100%; } body, @@ -20,1245 +22,1403 @@ h3, h4, h5, h6 { - font-family: 'Lato', sans-serif; - font-weight: 300; + font-family: 'Lato', sans-serif; + font-weight: 300; } + + /*blue light #5A74AF*/ + + /*blue dark #29427A*/ + .topnav { - font-size: 14px; + font-size: 14px; +} + +.menu-url { + cursor: pointer; } .lead { - font-size: 18px; - font-weight: 400; + font-size: 18px; + font-weight: 400; } -.btn{ - box-shadow: 0 1px 4px rgba(0, 0, 0, .6); + +.btn { + box-shadow: 0 1px 4px rgba(0, 0, 0, .6); } + .fa-li.fa-lg { - color: #29427A; - margin-top: 6px; + color: #29427A; + margin-top: 6px; } -.btn-transparent{ - background: transparent; - border: 2px solid #fff; - color: #fff; - transition: all .2s ease-in; + +.btn-transparent { + background: transparent; + border: 2px solid #fff; + color: #fff; + transition: all .2s ease-in; } -.btn-primary{ - background: #29427A; - border-color: #29427A; - color: #fff; - width: auto; + +.btn-primary { + background: #29427A; + border-color: #29427A; + color: #fff; + width: auto; } -.btn-primary:hover{ - background: rgba(41, 66, 122, 0.8); - border-color: #29427A; + +.btn-primary:hover { + background: rgba(41, 66, 122, 0.8); + border-color: #29427A; } -.btn-transparent:hover{ - background: #fff; - border: 2px solid #fff; - color: #000; - transition: all .2s ease-in; + +.btn-transparent:hover { + background: #fff; + border: 2px solid #fff; + color: #000; + transition: all .2s ease-in; } + .btn-info { - color: #fff; - background-color: #5A74AF; - border-color: #5A74AF; + color: #fff; + background-color: #5A74AF; + border-color: #5A74AF; } + .btn-info:hover { - color: #fff; - background-color: rgba(90, 116, 175, 0.8); - border-color: #5A74AF; + color: #fff; + background-color: rgba(90, 116, 175, 0.8); + border-color: #5A74AF; } + .btn-info:focus { - color: #fff; - background-color: rgba(90, 116, 175, 0.8); - border-color: #5A74AF; + color: #fff; + background-color: rgba(90, 116, 175, 0.8); + border-color: #5A74AF; } -.btn-lg{ - min-width: 180px; + +.btn-lg { + min-width: 180px; } -#logoWhite{ - display: none; + +#logoWhite { + display: none; } -#logoBlack{ - display: block; + +#logoBlack { + display: block; } -.navbar{ - transition: all .3s ease-in; + +.navbar { + transition: all .3s ease-in; } -.navbar-default{ - background: #fff; - border: none; - padding: 5px; + +.navbar-default { + background: #fff; + border: none; + padding: 5px; } -.navbar-transparent{ - background: transparent; - border: none; - padding: 20px; + +.navbar-transparent { + background: transparent; + border: none; + padding: 20px; } -.navbar-transparent #logoBlack{ - display: none; + +.navbar-transparent #logoBlack { + display: none; } -.navbar-transparent #logoWhite{ - display: block; - width: 220px; + +.navbar-transparent #logoWhite { + display: block; + width: 220px; } + .navbar-default .navbar-nav>li>a { - cursor: pointer; - font-family: 'Lato-Regular', sans-serif; + cursor: pointer; + font-family: 'Lato-Regular', sans-serif; } + .navbar-transparent .navbar-nav>li>a { - color: #fff; - cursor: pointer; - font-family: 'Lato-Regular', sans-serif; + color: #fff; + cursor: pointer; + font-family: 'Lato-Regular', sans-serif; } + .navbar-transparent .navbar-nav>li>a:hover { - color: #fff; + color: #fff; } -.navbar-transparent .navbar-nav>li>a:focus, .navbar-transparent .navbar-nav>li>a:hover { - color: #fff; - background-color: transparent; + +.navbar-transparent .navbar-nav>li>a:focus, +.navbar-transparent .navbar-nav>li>a:hover { + color: #fff; + background-color: transparent; } + .navbar-default .btn-link { - box-shadow: none; + box-shadow: none; } + .navbar-brand { - padding: 10px 15px; - cursor: pointer; + padding: 10px 15px; + cursor: pointer; } + .navbar-right { - margin-right: 10px; + margin-right: 10px; } + .navbar-default .btn-link { - color: #fff; + color: #fff; } + .navbar-default .btn-link:hover { - color: #fff !important; -} -.nav-language{ - position: relative; -} -.nav-language .select-language{ - padding: 15px 10px; - color: #777; -} -.navbar-transparent .nav-language .select-language{ - color: #fff; - font-family: 'Lato-Regular', sans-serif; + color: #fff !important; } -.nav-language .select-language span{ - margin-left: 5px; - margin-right: 5px; - font-family: 'Lato-Regular', sans-serif; +.nav-language { + position: relative; +} +.nav-language .select-language { + padding: 15px 10px; + color: #777; } -.nav-language .drop-language{ - position: absolute; - top: 45px; - left: -8px; - background: #fff; - width: 100px; - height: 40px; - padding: 9px 10px; - -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; - z-index: 100; - /* margin-left: 10px; */ - text-align: center; - border-radius: 4px; + +.navbar-transparent .nav-language .select-language { + color: #fff; + font-family: 'Lato-Regular', sans-serif; } -.nav-language .drop-language a{ - cursor: pointer; - font-family: 'Lato-Regular', sans-serif; + +.nav-language .select-language span { + margin-left: 5px; + margin-right: 5px; + font-family: 'Lato-Regular', sans-serif; } -.navbar-transparent .nav-language .drop-language{ - background: transparent; - border: 1px solid #fff; + +.nav-language .drop-language { + position: absolute; + top: 45px; + left: -8px; + background: #fff; + width: 100px; + height: 40px; + padding: 9px 10px; + -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; + z-index: 100; + /* margin-left: 10px; */ + text-align: center; + border-radius: 4px; } -.navbar-transparent .nav-language .drop-language a{ - color: #fff; - font-family: 'Lato-Regular', sans-serif; + +.nav-language .drop-language a { + cursor: pointer; + font-family: 'Lato-Regular', sans-serif; } -.nav-language:hover .drop-language{ - display: block; + +.navbar-transparent .nav-language .drop-language { + background: transparent; + border: 1px solid #fff; } + +.navbar-transparent .nav-language .drop-language a { + color: #fff; + font-family: 'Lato-Regular', sans-serif; +} + +.nav-language:hover .drop-language { + display: block; +} + .intro-header { - height: 100vh; - text-align: center; - color: #fff; - background: url(../img/configure.jpg) no-repeat center center; - background-size: cover; - position: relative; - display: flex; - justify-content: center; - align-items: center; + height: 100vh; + text-align: center; + color: #fff; + background: url(../img/configure.jpg) no-repeat center center; + background-size: cover; + position: relative; + display: flex; + justify-content: center; + align-items: center; } -.intro-header::before{ - content: ""; - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; - background: rgba(90, 116, 175, 0.7); +.intro-header::before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: rgba(90, 116, 175, 0.7); } + .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-bottom: 50px; - text-align: center; - color: #fff; - background: url(../img/configure.jpg) no-repeat center center; - background-size: cover; - position: relative; + 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-bottom: 50px; + text-align: center; + color: #fff; + background: url(../img/configure.jpg) no-repeat center center; + background-size: cover; + position: relative; } -.intro-header-1::before{ - content: ""; - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; - background: rgba(90, 116, 175, 0.36); + +.intro-header-1::before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: rgba(90, 116, 175, 0.36); } + .intro-header-2 { - 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-bottom: 50px; - text-align: center; - color: #f8f8f8; - background: url(../img/banner-bg.jpg) no-repeat center center; - background-size: cover; - position: relative; + 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-bottom: 50px; + text-align: center; + color: #f8f8f8; + background: url(../img/banner-bg.jpg) no-repeat center center; + background-size: cover; + position: relative; } -.intro-header-2::before{ - content: ""; - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; - background: rgba(41, 66, 122, 0.59); + +.intro-header-2::before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: rgba(41, 66, 122, 0.59); } + .intro-message { - position: relative; - width: 80%; - margin: 0 auto; - + position: relative; + width: 80%; + margin: 0 auto; } + .intro-signup { - position: relative; - padding-top: 20%; - padding-bottom: 20%; + position: relative; + padding-top: 20%; + padding-bottom: 20%; } -.intro-message > h1 { - margin: 0; - font-weight: 400; - font-size: 6em; +.intro-message>h1 { + margin: 0; + font-weight: 400; + font-size: 6em; } .intro-divider { - width: 400px; - border-top: 1px solid #f8f8f8; - border-bottom: 1px solid rgba(0,0,0,0.2); + width: 400px; + border-top: 1px solid #f8f8f8; + border-bottom: 1px solid rgba(0, 0, 0, 0.2); } -.intro-message > h3 { - font-weight: 300; - +.intro-message>h3 { + font-weight: 300; } -.intro-pricing{ - text-align: center; - color: #fff; - background: url(../img/pattern.jpg) no-repeat center center; - background-size: cover; - height: 70vh; - max-height: 400px; - display: flex; - justify-content: center; - align-items: center; - position: relative; +.intro-pricing { + text-align: center; + color: #fff; + background: url(../img/pattern.jpg) no-repeat center center; + background-size: cover; + height: 70vh; + max-height: 400px; + display: flex; + justify-content: center; + align-items: center; + position: relative; } -.intro-pricing.success-pricing{ - height: 100vh; - max-height: 100vh; + +.intro-pricing.success-pricing { + height: 100vh; + max-height: 100vh; } -.intro-pricing::before{ - content: ""; - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; - background: rgba(90, 116, 175, 0.7); + +.intro-pricing::before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: rgba(90, 116, 175, 0.7); } -.intro-pricing .intro-message .section-heading{ - font-size: 45px; - width: 80%; - margin: 0 auto; + +.intro-pricing .intro-message .section-heading { + font-size: 45px; + width: 80%; + margin: 0 auto; } + .split-section { - padding: 70px 0; + padding: 70px 0; } -.split-section .icon-section{ - position: relative; - min-height: 330px; + +.split-section .icon-section { + position: relative; + min-height: 330px; } -.split-section .icon-section i{ - position: absolute; - left: 50%; - top: 50%; - transform: translate(-50%, -50%); - font-size: 216px; - color: #5A74AF; + +.split-section .icon-section i { + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + font-size: 216px; + color: #5A74AF; } -.split-section .split-text .lead{ - font-size: 21px; - color: #3a3a3a; + +.split-section .split-text .lead { + font-size: 21px; + color: #3a3a3a; } -.split-section .split-text .split-title{ - position: relative; - margin-bottom: 25px; + +.split-section .split-text .split-title { + position: relative; + margin-bottom: 25px; } -.split-section .split-text .split-title h2{ - font-size: 50px; - line-height: 50px; - padding-bottom: 25px; - color: #3a3a3a; - letter-spacing: 3px; + +.split-section .split-text .split-title h2 { + font-size: 50px; + line-height: 50px; + padding-bottom: 25px; + color: #3a3a3a; + letter-spacing: 3px; } -.split-section.left{ + +.split-section.left { background: -webkit-linear-gradient(#f0f4f7, #fff) no-repeat; background: -o-linear-gradient(#f0f4f7, #fff) no-repeat; - background: linear-gradient(#f0f4f7, #fff) no-repeat; + background: linear-gradient(#f0f4f7, #fff) no-repeat; } -.split-section.left .split-description{ - width: 90%; - margin-right: auto; +.split-section.left .split-description { + width: 90%; + margin-right: auto; } -.split-section.right .split-description{ - width: 90%; - margin-left: auto; -} -.split-section.right .split-description.title p{ - font-size: 27px; - margin-bottom: 10px; - text-align: left; +.split-section.right .split-description { + width: 90%; + margin-left: auto; } + +.split-section.right .split-description.title p { + font-size: 27px; + margin-bottom: 10px; + text-align: left; +} + .split-section.right .split-text { - text-align: right; + text-align: right; } -.split-section.right .split-text ul{ - text-align: left; + +.split-section.right .split-text ul { + text-align: left; } + .split-section.left .split-text { - text-align: left; + text-align: left; } -.split-section.right .split-text .split-title h2{ - text-align: right; -} -.split-section.left .split-text .split-title h2{ - text-align: left; -} -.split-section.right .split-text .split-title::before{ - content: ""; - position: absolute; - bottom: 0; - background: #29427A; - height: 7px; - width: 70px; - right: 0; -} -.split-section.left .split-text .split-title::before{ - content: ""; - position: absolute; - bottom: 0; - background: #29427A; - height: 7px; - width: 70px; - left: 0; +.split-section.right .split-text .split-title h2 { + text-align: right; } -.split-section.what .icon-section{ - position: relative; - min-height: 500px; +.split-section.left .split-text .split-title h2 { + text-align: left; } + +.split-section.right .split-text .split-title::before { + content: ""; + position: absolute; + bottom: 0; + background: #29427A; + height: 7px; + width: 70px; + right: 0; +} + +.split-section.left .split-text .split-title::before { + content: ""; + position: absolute; + bottom: 0; + background: #29427A; + height: 7px; + width: 70px; + left: 0; +} + +.split-section.what .icon-section { + position: relative; + min-height: 500px; +} + .split-section.what .split-text .lead { - font-size: 19px; - color: #3a3a3a; - margin-bottom: 5px; - line-height: 29px; -} -.split-section.what .fa-li.fa-lg{ - font-size: 17px; -} -.pricing-section{ - padding: 80px 0 !important; - background: -webkit-linear-gradient(top, #f0f4f7, #fff) no-repeat; - background: linear-gradient(to bottom, #f0f4f7, #fff) no-repeat; + font-size: 19px; + color: #3a3a3a; + margin-bottom: 5px; + line-height: 29px; } -.pricing-section .card{ - width: 350px; - margin: 0 auto; - background: #fff; - box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); - padding-bottom: 40px; - border-radius: 7px; - position: relative; +.split-section.what .fa-li.fa-lg { + font-size: 17px; } -.pricing-section .card .img-beta{ - position: absolute; - top: 5px; - width: 60px; - left: 3px; -} -.pricing-section .card .title{ - padding: 15px 40px; -} -.pricing-section .card .title h3{ -} -.pricing-section .card .price{ - background: #5A74AF; - padding: 22px; - color: #fff; - font-size: 32px; -} -.pricing-section .card .description{ - padding: 12px; -} -.pricing-section .card .descriptions{ - padding: 10px 30px; -} -.pricing-section .card .description p{ - margin: 0; -} -.pricing-section .card .btn{ - margin-top: 20px; -} -.pricing-section .text{ - text-align: left; -} -.pricing-section .text .section-heading{ - /*font-size: 50px;*/ - font-size: 48px; - line-height: 50px; - padding-bottom: 25px; - color: #3a3a3a; - letter-spacing: 1px; - position: relative; -} -.pricing-section .text .section-heading::before{ - content: ""; - position: absolute; - bottom: 0; - background: #29427A; - height: 7px; - width: 70px; - left: 0; -} -.request-section{ - 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%); - padding: 70px 0; -} -.request-section .title h2{ - font-size: 45px; - margin: 0; - color: #fff; - padding-bottom: 25px; - position: relative; -} -.request-section .title h2::before{ - content: ""; - position: absolute; - bottom: 0; - background: #fff; - height: 7px; - width: 70px; - left: 0; -} -.request-section .form-beta{ - width: 80%; - margin: 0 auto; - max-width: 350px; - text-align: center; +.pricing-section { + padding: 80px 0 !important; + background: -webkit-linear-gradient(top, #f0f4f7, #fff) no-repeat; + background: linear-gradient(to bottom, #f0f4f7, #fff) no-repeat; } -.request-section .form-beta input{ - height: 50px; + +.pricing-section .card { + width: 350px; + margin: 0 auto; + background: #fff; + box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); + padding-bottom: 40px; + border-radius: 7px; + position: relative; } -.request-section .form-beta input{ - height: 50px; + +.pricing-section .card .img-beta { + position: absolute; + top: 5px; + width: 60px; + left: 3px; } -.request-section .form-beta .btn-lg{ - width: 100%; - font-size: 16px; + +.pricing-section .card .title { + padding: 15px 40px; } + +.pricing-section .card .title h3 {} + +.pricing-section .card .price { + background: #5A74AF; + padding: 22px; + color: #fff; + font-size: 32px; +} + +.pricing-section .card .description { + padding: 12px; +} + +.pricing-section .card .descriptions { + padding: 10px 30px; +} + +.pricing-section .card .description p { + margin: 0; +} + +.pricing-section .card .btn { + margin-top: 20px; +} + +.pricing-section .text { + text-align: left; +} + +.pricing-section .text .section-heading { + /*font-size: 50px;*/ + font-size: 48px; + line-height: 50px; + padding-bottom: 25px; + color: #3a3a3a; + letter-spacing: 1px; + position: relative; +} + +.pricing-section .text .section-heading::before { + content: ""; + position: absolute; + bottom: 0; + background: #29427A; + height: 7px; + width: 70px; + left: 0; +} + +.request-section { + 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%); + padding: 70px 0; +} + +.request-section .title h2 { + font-size: 45px; + margin: 0; + color: #fff; + padding-bottom: 25px; + position: relative; +} + +.request-section .title h2::before { + content: ""; + position: absolute; + bottom: 0; + background: #fff; + height: 7px; + width: 70px; + left: 0; +} + +.request-section .form-beta { + width: 80%; + margin: 0 auto; + max-width: 350px; + text-align: center; +} + +.request-section .form-beta input { + height: 50px; +} + +.request-section .form-beta input { + height: 50px; +} + +.request-section .form-beta .btn-lg { + width: 100%; + font-size: 16px; +} + .banner { - padding: 100px 0; - color: #fff; - background: url(../img/banner-bg.jpg) no-repeat center center; - background-size: cover; - position: relative; + padding: 100px 0; + color: #fff; + background: url(../img/banner-bg.jpg) no-repeat center center; + background-size: cover; + position: relative; } -.full-contact-section{ - 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%); + +.full-contact-section { + 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%); } .contact-section { - padding: 60px 0; - color: #fff; - background-attachment: fixed; + padding: 60px 0; + color: #fff; + background-attachment: fixed; } -.contact-section .card{ - text-align: center; - width: 350px; - margin: 0 auto; - background: #fff; - box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); - padding-bottom: 40px; - border-radius: 7px; - color: #4c4444; - box-sizing: border-box; - padding: 45px; - margin-top: -115px; +.contact-section .card { + text-align: center; + width: 350px; + margin: 0 auto; + background: #fff; + box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); + padding-bottom: 40px; + border-radius: 7px; + color: #4c4444; + box-sizing: border-box; + padding: 45px; + margin-top: -115px; } -.contact-section .card .social a{ - color: #29427A; - font-size: 45px; + +.contact-section .card .social a { + color: #29427A; + font-size: 45px; } -.contact-section .card .subtitle h3{ - font-size: 30px; - margin-bottom: 23px; + +.contact-section .card .subtitle h3 { + font-size: 30px; + margin-bottom: 23px; } -.contact-section .card .social a:hover{ - text-decoration: none; + +.contact-section .card .social a:hover { + text-decoration: none; } + .contact-section .title { - margin-right: auto; - width: 80%; - max-width: 468px; + margin-right: auto; + width: 80%; + max-width: 468px; } -.contact-section .title h2{ - font-size: 65px; - margin: 0; - color: #fff; - padding-bottom: 25px; - position: relative; - text-align: right; + +.contact-section .title h2 { + font-size: 65px; + margin: 0; + color: #fff; + padding-bottom: 25px; + position: relative; + text-align: right; } -.contact-section .title h2::before{ - content: ""; - position: absolute; - bottom: 0; - background: #fff; - height: 7px; - width: 70px; - right: 0; + +.contact-section .title h2::before { + content: ""; + position: absolute; + bottom: 0; + background: #fff; + height: 7px; + 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%); + 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; + 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);*/ + 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; + font-size: 65px; + margin: 0; + padding: 0; } + #tech_stack { - background: #fff; + background: #fff; } + #tech_stack h3 { - font-size: 42px; - width: 70%; + font-size: 42px; + width: 70%; } + hr.thick-divider { - border-top: 3px solid #eee !important; + border-top: 3px solid #eee !important; } + .space { - padding: 50px 0; + padding: 50px 0; } + tech-sub-sec h2 { - font-size: 45px; - line-height: 60px; - padding-bottom: 25px; - color: #3a3a3a; - letter-spacing: 1px; + 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; + text-align: center; + min-height: 140px; + padding: 20px 40px 30px 40px; } -.btm-space{ - padding-bottom: 8px; + +.btm-space { + padding-bottom: 8px; } -.btm-space-tayga{ - padding-bottom: 12px; + +.btm-space-tayga { + padding-bottom: 12px; } + .percent-text { - font-size: 50px; - color: #999; + font-size: 50px; + color: #999; } + .tech-sub-sec h2 { - font-size: 40px; - line-height: 55px; + font-size: 40px; + line-height: 55px; } -.space-middle{ - padding: 45px 0; + +.space-middle { + padding: 45px 0; } -.padding-vertical{ - padding: 35px 0; + +.padding-vertical { + padding: 35px 0; } + .percent-text img { - margin-left:20px; + margin-left: 20px; } + .space-block { - padding: 30px 0; + 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; + 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; + +.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; + padding-top: 20px; + display: inline-block; + color: #999 !important; } + .lead-light { - color: #999 !important; - line-height: 32px !important; + color: #999 !important; + line-height: 32px !important; } + .logo-wrap-1 { - padding-top: 50px; + padding-top: 50px; } -.dropdown-menu > li > a { - padding: 1px 10px !important; + +.dropdown-menu>li>a { + padding: 1px 10px !important; } -.dropdown-menu{ - left: 0 !important; - min-width: 155px; - text-align: left; - margin-left: 15px; + +.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; + +.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; + +.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; + +.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*/ -.price-calc-section{ - padding: 80px 40px !important; - 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%; -} -.price-calc-section .text .section-heading{ - font-size: 48px; - line-height: 48px; - padding-bottom: 27px; - color: #3a3a3a; - letter-spacing: 1px; - position: relative; - text-align: right; -} -.price-calc-section .text .description{ - font-size: 20px; - text-align: right; +.price-calc-section { + padding: 80px 40px !important; + 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 .section-heading::before{ - content: ""; - position: absolute; - bottom: 0; - background: #29427A; - height: 7px; - width: 70px; - right: 0; +.price-calc-section .text { + width: 50%; } -.price-calc-section .card{ - width: 50%; - margin: 0 auto; - background: #fff; - box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); - padding-bottom: 40px; - border-radius: 7px; - text-align: center; - /* margin-right: auto; */ - max-width: 400px; - position: relative; + +.price-calc-section .text .section-heading { + font-size: 48px; + line-height: 48px; + padding-bottom: 27px; + color: #3a3a3a; + letter-spacing: 1px; + position: relative; + text-align: right; } + +.price-calc-section .text .description { + font-size: 20px; + text-align: right; +} + +.price-calc-section .text .section-heading::before { + content: ""; + position: absolute; + bottom: 0; + background: #29427A; + height: 7px; + width: 70px; + right: 0; +} + +.price-calc-section .card { + width: 50%; + margin: 0 auto; + background: #fff; + box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); + padding-bottom: 40px; + border-radius: 7px; + text-align: center; + /* margin-right: auto; */ + max-width: 400px; + position: relative; +} + .price-calc-section .landing { - width: 100% !important; + width: 100% !important; } -.no-padding{ - padding:0 !important; + +.no-padding { + padding: 0 !important; } -.price-calc-section .card .img-beta{ - position: absolute; - top: 5px; - width: 60px; - left: 3px; + +.price-calc-section .card .img-beta { + position: absolute; + top: 5px; + width: 60px; + left: 3px; } -.price-calc-section .card .title{ - padding: 15px 40px; + +.price-calc-section .card .title { + padding: 15px 40px; } -.price-calc-section .card .title h3{ - font-family: 'Lato-Regular', sans-serif; + +.price-calc-section .card .title h3 { + font-family: 'Lato-Regular', sans-serif; } -.price-calc-section .card .price{ - background: #5A74AF; - padding: 22px; - color: #fff; - font-size: 32px; + +.price-calc-section .card .price { + background: #5A74AF; + padding: 22px; + color: #fff; + font-size: 32px; } -.price-calc-section .card .price .price-text{ - font-size: 14px; + +.price-calc-section .card .price .price-text { + font-size: 14px; } -.price-calc-section .card .description{ - padding: 12px; - position: relative; - display: flex; - justify-content: space-around !important; - align-items: center !important; + +.price-calc-section .card .description { + padding: 12px; + position: relative; + display: flex; + justify-content: space-around !important; + align-items: center !important; } .price-calc-section .card .description span { - font-size: 16px; - margin-left: 4px; - margin-left: 0px; - /* justify-self: start; */ - width: 30%; - text-align: left; -} -.price-calc-section .card .description .select-number{ - font-size: 20px; - text-align: center; - width: 60px; -} -.price-calc-section .card .description i{ - color: #29427A; - cursor: pointer; - font-size: 24px; -} -.price-calc-section .card .description .left{ - margin-right: 7px; -} -.price-calc-section .card .description .right{ - margin-left: 7px; -} -.price-calc-section .card .descriptions{ - padding: 10px 30px; -} -.price-calc-section .card .description p{ - margin: 0; -} -.price-calc-section .card .btn{ - margin-top: 20px; - font-size: 20px; - width: 200px; - border: none; -} -.price-calc-section .card .select-configuration select{ - outline: none; - background: #fff; - border-color: #d0d0d0; - height: 40px; - width: 200px; - text-align: center; - font-size: 16px; - margin-left: 10px; -} -.price-calc-section .card .check-ip{ - font-size: 18px; -} -.price-calc-section .card .justify-center{ - justify-content: center !important; -} -.price-calc-section .card .description.input label{ - font-size: 15px; - font-weight: 800; - font-family: 'Lato-Regular'; - margin-bottom: 0; - width: 40px; -} -/*Changed class****.price-calc-section .card .description.input input*/ -.price-calc-section .card .description input{ - width: 200px; - font-size: 14px; - text-align: left; - padding: 5px 10px; - border-radius: 4px; - border: 1px solid #d0d0d0; - background: #fff; - margin-left: 10px; + font-size: 16px; + margin-left: 4px; + margin-left: 0px; + /* justify-self: start; */ + width: 30%; + text-align: left; } -.price-calc-section .card .check-ip input[type=checkbox]{ - font-size: 17px; - margin: 0 8px; +.price-calc-section .card .description .select-number { + font-size: 20px; + text-align: center; + width: 60px; } + +.price-calc-section .card .description i { + color: #29427A; + cursor: pointer; + font-size: 24px; +} + +.price-calc-section .card .description .left { + margin-right: 7px; +} + +.price-calc-section .card .description .right { + margin-left: 7px; +} + +.price-calc-section .card .descriptions { + padding: 10px 30px; +} + +.price-calc-section .card .description p { + margin: 0; +} + +.price-calc-section .card .btn { + margin-top: 20px; + font-size: 20px; + width: 200px; + border: none; +} + +.price-calc-section .card .select-configuration select { + outline: none; + background: #fff; + border-color: #d0d0d0; + height: 40px; + width: 200px; + text-align: center; + font-size: 16px; + margin-left: 10px; +} + +.price-calc-section .card .check-ip { + font-size: 18px; +} + +.price-calc-section .card .justify-center { + justify-content: center !important; +} + +.price-calc-section .card .description.input label { + font-size: 15px; + font-weight: 800; + font-family: 'Lato-Regular'; + margin-bottom: 0; + width: 40px; +} + + +/*Changed class****.price-calc-section .card .description.input input*/ + +.price-calc-section .card .description 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] { + font-size: 17px; + margin: 0 8px; +} + .help-block.with-errors { - text-align: center; - margin: 0; - padding: 0; + text-align: center; + margin: 0; + padding: 0; } -.has-error .checkbox, .has-error .checkbox-inline, .has-error .control-label, .has-error .help-block, .has-error .radio, .has-error .radio-inline, .has-error.checkbox label, .has-error.checkbox-inline label, .has-error.radio label, .has-error.radio-inline label{ -color: #eb4d5c; + +.has-error .checkbox, +.has-error .checkbox-inline, +.has-error .control-label, +.has-error .help-block, +.has-error .radio, +.has-error .radio-inline, +.has-error.checkbox label, +.has-error.checkbox-inline label, +.has-error.radio label, +.has-error.radio-inline label { + color: #eb4d5c; } + .form-group { - margin: 0; - border-bottom: 1px solid rgba(128, 128, 128, 0.3); + 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 { + .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 { + } + .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 { +@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 { + } + .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%; + } + .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; - } - + .visible-mobile { + display: none !important; + } + .visible-desktop { + display: block; + } } + @media(max-width:990px) { - .pricing-section .text { - text-align: center; - margin-bottom: 40px; - } - .navbar-transparent .navbar-nav>li>a { - font-size: 14px; - } - .pricing-section .text .section-heading::before { - left: 50%; - transform: translate(-50%, 0); - } + .pricing-section .text { + text-align: center; + margin-bottom: 40px; + } + .navbar-transparent .navbar-nav>li>a { + font-size: 14px; + } + .pricing-section .text .section-heading::before { + left: 50%; + transform: translate(-50%, 0); + } } @media(max-width:768px) { -.percent-text { + .percent-text { font-size: 43px; -} - .tech-sub-sec h2 { + } + .tech-sub-sec h2 { font-size: 30px; -line-height: 40px; -} -.single-heading h2 { + line-height: 40px; + } + .single-heading h2 { font-size: 50px; - } -.logo-wrap { + } + .logo-wrap { padding: 10px; -} -.navbar-transparent li a { + } + .navbar-transparent li a { color: #777 !important; -} - .intro-message { - padding-bottom: 15%; - } - - .intro-message > h1 { - font-size: 3em; - } - - ul.intro-social-buttons > li { - display: block; - margin-bottom: 20px; - padding: 0; - } - .intro-pricing .intro-message .section-heading { - font-size: 35px; - width: 80%; - margin: 0 auto; - } - .intro-pricing .intro-message { - padding-bottom: 0; - } - - ul.intro-social-buttons > li:last-child { - margin-bottom: 0; - } - - .intro-divider { - width: 100%; - } - .navbar-transparent { - background: #fff; - border: none; - padding: 5px; - } - .navbar-transparent #logoBlack{ - display: block; - } - .navbar-transparent #logoWhite{ - display: none; - } - .navbar-transparent .navbar-nav>li>a { - font-size: 14px; - color: #777; - } - .nav-language:hover{ - height: 80px; - } - .navbar-transparent .nav-language .select-language { - color: #777; - } - .navbar-transparent .nav-language .drop-language a { - color: #777; - } - .navbar-transparent .nav-language .drop-language { - background: #fff; - /* border: 1px solid #fff; */ - z-index: 100000; - left: 9px; - border: 1px solid rgba(119, 119, 119, 0.4); - box-shadow: none; - } - - .navbar-default .nav-language .drop-language { - background: #fff; - /* border: 1px solid #fff; */ - z-index: 100000; - left: 9px; - border: 1px solid rgba(119, 119, 119, 0.4); - box-shadow: none; - } - .navbar-default .nav-language .select-language { - color: #777; - } - .navbar-default .nav-language .drop-language a { - color: #777; - } - .navbar-transparent .navbar-nav>li>a:focus, .navbar-transparent .navbar-nav>li>a:hover { - color: #333; - background-color: transparent; - } - .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover { - color: #333; - background-color: transparent; - } - .split-section { - padding: 10px 0; - } - .split-section .icon-section { - min-height: 160px; - } - .split-section.what .icon-section{ - min-height: 160px; - } - .split-section .icon-section i{ - font-size: 120px; - } - .split-section .split-text .split-title h2{ - font-size: 35px; - line-height: 35px; - } - .pricing-section .text .section-heading{ - font-size: 35px; - line-height: 35px; - } - .pricing-section .text .section-heading::before { - left: 50%; - transform: translate(-50%, 0); - } - .request-section .title h2 { - font-size: 35px; - line-height: 35px; - text-align: center; - margin-bottom: 55px; - } - .request-section .title h2::before{ - left: 50%; - transform: translate(-50%, 0); - } - .contact-section .title { - width: 300px; - margin: 0 auto; - } - .contact-section .title h2{ - font-size: 35px; - line-height: 40px; - text-align: center; - margin-top: 35px; - } - .contact-section .title h2::before{ - left: 50%; - transform: translate(-50%, 0); - } - .contact-section .card .social a { - color: #29427A; - font-size: 30px; - } - - .intro-pricing .intro-message .section-heading { - font-size: 30px; - } - - .price-calc-section{ - flex-direction: column; - padding: 60px 10px !important; - } - .price-calc-section .card { - width: 90%; - } - .price-calc-section .text { - width: 80%; - text-align: center; - margin: 0 auto; - margin-top: 20px; - } - .price-calc-section .text .section-heading { - font-size: 35px; - line-height: 35px; - padding-bottom: 15px; - text-align: center; - } - .price-calc-section .text .section-heading::before { - left: 50%; - transform: translate(-50%, 0); - } - .price-calc-section .text .description { - font-size: 18px; - text-align: center; - } - - .price-calc-section .card .description .select-number{ - font-size: 17px; - text-align: center; - width: 60px; - } - + } + .intro-message { + padding-bottom: 15%; + } + .intro-message>h1 { + font-size: 3em; + } + ul.intro-social-buttons>li { + display: block; + margin-bottom: 20px; + padding: 0; + } + .intro-pricing .intro-message .section-heading { + font-size: 35px; + width: 80%; + margin: 0 auto; + } + .intro-pricing .intro-message { + padding-bottom: 0; + } + ul.intro-social-buttons>li:last-child { + margin-bottom: 0; + } + .intro-divider { + width: 100%; + } + .navbar-transparent { + background: #fff; + border: none; + padding: 5px; + } + .navbar-transparent #logoBlack { + display: block; + } + .navbar-transparent #logoWhite { + display: none; + } + .navbar-transparent .navbar-nav>li>a { + font-size: 14px; + color: #777; + } + .nav-language:hover { + height: 80px; + } + .navbar-transparent .nav-language .select-language { + color: #777; + } + .navbar-transparent .nav-language .drop-language a { + color: #777; + } + .navbar-transparent .nav-language .drop-language { + background: #fff; + /* border: 1px solid #fff; */ + z-index: 100000; + left: 9px; + border: 1px solid rgba(119, 119, 119, 0.4); + box-shadow: none; + } + .navbar-default .nav-language .drop-language { + background: #fff; + /* border: 1px solid #fff; */ + z-index: 100000; + left: 9px; + border: 1px solid rgba(119, 119, 119, 0.4); + box-shadow: none; + } + .navbar-default .nav-language .select-language { + color: #777; + } + .navbar-default .nav-language .drop-language a { + color: #777; + } + .navbar-transparent .navbar-nav>li>a:focus, + .navbar-transparent .navbar-nav>li>a:hover { + color: #333; + background-color: transparent; + } + .navbar-default .navbar-nav>li>a:focus, + .navbar-default .navbar-nav>li>a:hover { + color: #333; + background-color: transparent; + } + .split-section { + padding: 10px 0; + } + .split-section .icon-section { + min-height: 160px; + } + .split-section.what .icon-section { + min-height: 160px; + } + .split-section .icon-section i { + font-size: 120px; + } + .split-section .split-text .split-title h2 { + font-size: 35px; + line-height: 35px; + } + .pricing-section .text .section-heading { + font-size: 35px; + line-height: 35px; + } + .pricing-section .text .section-heading::before { + left: 50%; + transform: translate(-50%, 0); + } + .request-section .title h2 { + font-size: 35px; + line-height: 35px; + text-align: center; + margin-bottom: 55px; + } + .request-section .title h2::before { + left: 50%; + transform: translate(-50%, 0); + } + .contact-section .title { + width: 300px; + margin: 0 auto; + } + .contact-section .title h2 { + font-size: 35px; + line-height: 40px; + text-align: center; + margin-top: 35px; + } + .contact-section .title h2::before { + left: 50%; + transform: translate(-50%, 0); + } + .contact-section .card .social a { + color: #29427A; + font-size: 30px; + } + .intro-pricing .intro-message .section-heading { + font-size: 30px; + } + .price-calc-section { + flex-direction: column; + padding: 60px 10px !important; + } + .price-calc-section .card { + width: 90%; + } + .price-calc-section .text { + width: 80%; + text-align: center; + margin: 0 auto; + margin-top: 20px; + } + .price-calc-section .text .section-heading { + font-size: 35px; + line-height: 35px; + padding-bottom: 15px; + text-align: center; + } + .price-calc-section .text .section-heading::before { + left: 50%; + transform: translate(-50%, 0); + } + .price-calc-section .text .description { + font-size: 18px; + text-align: center; + } + .price-calc-section .card .description .select-number { + font-size: 17px; + text-align: center; + width: 60px; + } } @media(max-width:540px) { -.logo-wrap { + .logo-wrap { padding: 30px; -} -.percent-text { + } + .percent-text { text-align: center; -} - .pricing-section .card { - width: 90%; - } - .contact-section .card { - width: 90%; - } - .form-beta { - width: 90%; - padding: 25px 10px; - } - .intro-message > h1 { - font-size: 2em; - } - .price-calc-section .text .section-heading { - font-size: 24px; - line-height: 25px; - } - .price-calc-section .card .description span { - font-size: 15px; - margin-left: 0px; - } - .pull-left.space-middle { + } + .pricing-section .card { + width: 90%; + } + .contact-section .card { + width: 90%; + } + .form-beta { + width: 90%; + padding: 25px 10px; + } + .intro-message>h1 { + font-size: 2em; + } + .price-calc-section .text .section-heading { + font-size: 24px; + line-height: 25px; + } + .price-calc-section .card .description span { + font-size: 15px; + margin-left: 0px; + } + .pull-left.space-middle { width: 67%; - padding: 20px 0px; - text-align: left; -} -.pull-left.ssdimg { + padding: 20px 0px; + text-align: left; + } + .pull-left.ssdimg { width: 30%; -} - + } } .network-name { - text-transform: uppercase; - font-size: 14px; - font-weight: 400; - letter-spacing: 2px; + text-transform: uppercase; + font-size: 14px; + font-weight: 400; + letter-spacing: 2px; } .content-section-a { - padding: 50px 0; - background-color: #f8f8f8; + padding: 50px 0; + background-color: #f8f8f8; } .content-section-b { - padding: 50px 0; + padding: 50px 0; } .section-heading { - margin-bottom: 30px; + margin-bottom: 30px; } .section-heading-spacer { - float: left; - width: 200px; - border-top: 3px solid #e7e7e7; + float: left; + width: 200px; + border-top: 3px solid #e7e7e7; } - - - .btn-buynow { - background-color: #607D8B; - border-color: #607D8B; + background-color: #607D8B; + border-color: #607D8B; } @media(max-width:1199px) { - ul.banner-social-buttons { - float: left; - margin-top: 15px; - } + ul.banner-social-buttons { + float: left; + margin-top: 15px; + } } + @media(min-width:1200px) { -.container-small{ - width:980px; -} + .container-small { + width: 980px; + } } footer { - padding: 50px 0; - background-color: #f8f8f8; + padding: 50px 0; + background-color: #f8f8f8; } p.copyright { - margin: 15px 0 0; + margin: 15px 0 0; } - a#forgotpassword { - color: #ffffff; - + color: #ffffff; } - .topnav a:focus { - outline: none; - outline-offset: 0; + outline: none; + outline-offset: 0; } .topnav .btn:focus { - outline: none !important; - outline-offset: 0; + outline: none !important; + outline-offset: 0; } .selectpicker { - margin-top: 8px !important; + margin-top: 8px !important; } .content-404 h1 { @@ -1267,17 +1427,17 @@ a#forgotpassword { line-height: 1; font-weight: 700; color: #6db97c; - } .btn-buynow { - background-color: #607D8B; - border-color: #607D8B; -} -.form-300{ - width: 300px; + background-color: #607D8B; + border-color: #607D8B; } -.error-message-box{ - margin-top: 20px; +.form-300 { + width: 300px; } + +.error-message-box { + margin-top: 20px; +} \ No newline at end of file diff --git a/datacenterlight/static/datacenterlight/js/main.js b/datacenterlight/static/datacenterlight/js/main.js index bfe92631..61ffad29 100644 --- a/datacenterlight/static/datacenterlight/js/main.js +++ b/datacenterlight/static/datacenterlight/js/main.js @@ -1,154 +1,167 @@ -(function($){ - "use strict"; // Start of use strict - - - /* --------------------------------------------- - Scripts initialization - --------------------------------------------- */ - var cardPricing ={ - 'cpu': { - 'id': 'coreValue', - 'value': 1, - 'min':1, - 'max': 48, - 'interval': 1 - }, - 'ram': { - 'id': 'ramValue', - 'value': 2, - 'min':2, - 'max': 200, - 'interval': 1 - }, - 'storage': { - 'id': 'storageValue', - 'value': 10, - 'min': 10, - 'max': 500, - 'interval': 10 - } +(function ($) { + "use strict"; // Start of use strict + + + /* --------------------------------------------- + Scripts initialization + --------------------------------------------- */ + var cardPricing = { + 'cpu': { + 'id': 'coreValue', + 'value': 1, + 'min': 1, + 'max': 48, + 'interval': 1 + }, + 'ram': { + 'id': 'ramValue', + 'value': 2, + 'min': 2, + 'max': 200, + 'interval': 1 + }, + 'storage': { + 'id': 'storageValue', + 'value': 10, + 'min': 10, + 'max': 500, + 'interval': 10 } - $(window).load(function(){ - - + } + $(window).load(function () { + + + }); + + $(document).ready(function () { + verifiedUrl(); + _navScroll(); + _initScroll(); + _initNavUrl(); + _initPricing(); + + }); + + $(window).resize(function () { + + + + }); + + + + /* --------------------------------------------- + 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); }); - - $(document).ready(function(){ - verifiedUrl(); - _navScroll(); - _initScroll(); - _initNavUrl(); - _initPricing(); - + } else { + /* the viewport is less than 400 pixels wide */ + } + + + + function _initScroll() { + $(window).scroll(function () { + _navScroll(); }); - - $(window).resize(function(){ - - - + + } + + function _navScroll() { + 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() { + $('.url').click(function () { + var href = $(this).attr('data-url'); + $('.navbar-collapse').removeClass('in'); + $('.navbar-collapse').addClass('collapsing'); + var url = window.location.pathname; + var urlSplit = url.split('/'); + if (urlSplit.length === 3 && urlSplit[2] === 'datacenterlight') { + $('html, body').animate({ + scrollTop: $(href).offset().top + }, 1000); + } else { + var allUrl = window.location.href; + var redirect = allUrl.split('whydatacenterlight') + window.location.href = '/en-us/datacenterlight' + href; + } }); - + } + + function verifiedUrl() { + if (window.location.href.indexOf('#success') > -1) { + form_success(); + console.log('epa'); + } + } + + function _initPricing() { + _fetchPricing(); + + $('.fa-minus-circle.left').click(function (event) { + var data = $(this).data('minus'); + + if (cardPricing[data].value > cardPricing[data].min) { + cardPricing[data].value = Number(cardPricing[data].value) - cardPricing[data].interval; + } + _fetchPricing(); + }); + $('.fa-plus-circle.right').click(function (event) { + var data = $(this).data('plus'); + if (cardPricing[data].value < cardPricing[data].max) { + cardPricing[data].value = Number(cardPricing[data].value) + cardPricing[data].interval; + } + _fetchPricing(); + }); + + $('.input-price').change(function () { + var data = $(this).attr("name"); + cardPricing[data].value = $('input[name=' + data + ']').val(); + _fetchPricing(); + }); + } + + function _fetchPricing() { + Object.keys(cardPricing).map(function (element) { + //$('#'+cardPricing[element].id).val(cardPricing[element].value); + $('input[name=' + element + ']').val(cardPricing[element].value); + }); + _calcPricing(); + } + + function _calcPricing() { + var total = (cardPricing['cpu'].value * 5) + (2 * cardPricing['ram'].value) + (0.6 * cardPricing['storage'].value); + total = parseFloat(total.toFixed(2)); + + $("#total").text(total); + $('input[name=total]').val(total); + } + + function form_success() { + $('#sucessModal').modal('show'); + } + + function _calculate(numbers, price) { + $('#valueTotal').text(numbers * price * 31); + } - /* --------------------------------------------- - 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(){ - $(window).scroll(function(){ - _navScroll(); - }); - } - - function _navScroll(){ - 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(){ - $('.url').click(function(){ - var href = $(this).attr('data-url'); - $('.navbar-collapse').removeClass('in'); - $('.navbar-collapse').addClass('collapsing'); - $('html, body').animate({ - scrollTop: $(href).offset().top - }, 1000); - }); - } - function verifiedUrl(){ - if(window.location.href.indexOf('#success') > -1){ - form_success(); - console.log('epa'); - } - } - - function _initPricing(){ - _fetchPricing(); - - $('.fa-minus-circle.left').click(function(event){ - var data = $(this).data('minus'); - - if(cardPricing[data].value > cardPricing[data].min){ - cardPricing[data].value = Number(cardPricing[data].value) - cardPricing[data].interval; - } - _fetchPricing(); - }); - $('.fa-plus-circle.right').click(function(event){ - var data = $(this).data('plus'); - if(cardPricing[data].value < cardPricing[data].max){ - cardPricing[data].value = Number(cardPricing[data].value) + cardPricing[data].interval; - } - _fetchPricing(); - }); - - $('.input-price').change(function(){ - var data = $(this).attr("name"); - cardPricing[data].value = $('input[name='+data+']').val(); - _fetchPricing(); - }); - } - function _fetchPricing(){ - Object.keys(cardPricing).map(function(element){ - //$('#'+cardPricing[element].id).val(cardPricing[element].value); - $('input[name='+element+']').val(cardPricing[element].value); - }); - _calcPricing(); - } - - function _calcPricing(){ - var total = (cardPricing['cpu'].value * 5) + (2* cardPricing['ram'].value) + (0.6* cardPricing['storage'].value); - total = parseFloat(total.toFixed(2)); - - $("#total").text(total); - $('input[name=total]').val(total); - } - function form_success(){ - $('#sucessModal').modal('show'); - } - function _calculate(numbers, price){ - $('#valueTotal').text(numbers*price*31); - } - - - -})(jQuery); +})(jQuery); \ No newline at end of file diff --git a/datacenterlight/templates/datacenterlight/includes/_navbar.html b/datacenterlight/templates/datacenterlight/includes/_navbar.html index cb1a7180..ca14f30a 100644 --- a/datacenterlight/templates/datacenterlight/includes/_navbar.html +++ b/datacenterlight/templates/datacenterlight/includes/_navbar.html @@ -18,19 +18,19 @@ {% endif %} - + -
+
+ {% for message in messages %} + {% if 'cores' in message.tags %} + + {% endif %} + {% endfor %} +
@@ -31,7 +39,15 @@ GB RAM
-
+
+ {% for message in messages %} + {% if 'memory' in message.tags %} +
  • + {{ message|safe }} +
+ {% endif %} + {% endfor %} +
@@ -40,7 +56,15 @@ {% trans "GB Storage (SSD)" %}
-
+
+ {% for message in messages %} + {% if 'storage' in message.tags %} +
  • + {{ message|safe }} +
+ {% endif %} + {% endfor %} +
diff --git a/datacenterlight/views.py b/datacenterlight/views.py index ea7ca3ef..48119a85 100644 --- a/datacenterlight/views.py +++ b/datacenterlight/views.py @@ -194,6 +194,18 @@ class IndexView(CreateView): success_url = "/datacenterlight#requestform" success_message = "Thank you, we will contact you as soon as possible" + def validate_cores(self, value): + if (value > 48) or (value < 1): + raise ValidationError(_('Not a proper cores number')) + + def validate_memory(self, value): + if (value > 200) or (value < 2): + raise ValidationError(_('Not a proper ram number')) + + def validate_storage(self, value): + if (value > 2000) or (value < 10): + raise ValidationError(_('Not a proper storage number')) + @cache_control(no_cache=True, must_revalidate=True, no_store=True) def get(self, request, *args, **kwargs): for session_var in ['specs', 'user', 'billing_address_data']: @@ -217,8 +229,11 @@ class IndexView(CreateView): def post(self, request): cores = request.POST.get('cpu') + cores_field = forms.IntegerField(validators=[self.validate_cores]) memory = request.POST.get('ram') + memory_field = forms.IntegerField(validators=[self.validate_memory]) storage = request.POST.get('storage') + storage_field = forms.IntegerField(validators=[self.validate_storage]) price = request.POST.get('total') template_id = int(request.POST.get('config')) manager = OpenNebulaManager() @@ -229,6 +244,28 @@ class IndexView(CreateView): email = request.POST.get('email') name_field = forms.CharField() email_field = forms.EmailField() + + try: + cores = cores_field.clean(cores) + except ValidationError as err: + msg = '{} {}.'.format(cores, _('is not a proper cores number')) + messages.add_message(self.request, messages.ERROR, msg, extra_tags='cores') + return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form") + + try: + memory = memory_field.clean(memory) + except ValidationError as err: + msg = '{} {}.'.format(memory, _('is not a proper memory number')) + messages.add_message(self.request, messages.ERROR, msg, extra_tags='memory') + return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form") + + try: + storage = storage_field.clean(storage) + except ValidationError as err: + msg = '{} {}.'.format(storage, _('is not a proper storage number')) + messages.add_message(self.request, messages.ERROR, msg, extra_tags='storage') + return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form") + try: name = name_field.clean(name) except ValidationError as err: From c26e9a692a0e8f179aa7dc7732264fb0a6c59038 Mon Sep 17 00:00:00 2001 From: ARvind Tiwari Date: Fri, 21 Jul 2017 21:10:33 +0530 Subject: [PATCH 05/25] social icons underbars removed --- .../templates/datacenterlight/index.html | 30 ++++++++----------- 1 file changed, 12 insertions(+), 18 deletions(-) diff --git a/datacenterlight/templates/datacenterlight/index.html b/datacenterlight/templates/datacenterlight/index.html index 548d8305..3ddb516d 100755 --- a/datacenterlight/templates/datacenterlight/index.html +++ b/datacenterlight/templates/datacenterlight/index.html @@ -9,7 +9,7 @@
- +

Data Center Light

{% trans "Finally, an affordable VM hosting in Switzerland!" %}

@@ -59,13 +59,13 @@
  • {% trans "Is creative, using a modern and alternative design for a data center in order to make it more sustainable and affordable at the same time." %}

    -
  • +
  • {% trans "Cuts down the costs for you by using FOSS (Free Open Source Software) exclusively, wherefore we can save money from paying licenses." %}

    -
  • + - +
    @@ -86,7 +86,7 @@

    {% trans "We don't use special hardware. We use commodity hardware: we buy computers that you buy. Just many more and put them in a cozy home for computers called data center." %}

    - +
    @@ -112,7 +112,7 @@

    {% trans "Our VMs are located in Switzerland, with reliable power supply and fast internet connection. Our VM costs less thanks to our featherlight infrastructure." %}

    - +
    @@ -121,7 +121,7 @@ - +
    @@ -154,7 +154,7 @@
    - +
    @@ -166,15 +166,9 @@

    {% trans "Switzerland " %}

    @@ -187,7 +181,7 @@
    - +
    {% endblock %} From eb1b3b6eb581afe7dd15d9f072d6179ec403111f Mon Sep 17 00:00:00 2001 From: ARvind Tiwari Date: Mon, 24 Jul 2017 19:43:03 +0530 Subject: [PATCH 06/25] new transparent navbar include in login,signup,reset-password --- hosting/static/hosting/css/landing-page.css | 28 +++- hosting/templates/hosting/base_short.html | 144 +++++++++--------- .../hosting/includes/_navbar_transparent.html | 72 +++++++++ hosting/templates/hosting/login.html | 13 +- hosting/templates/hosting/reset_password.html | 7 +- hosting/templates/hosting/signup.html | 6 +- 6 files changed, 191 insertions(+), 79 deletions(-) create mode 100644 hosting/templates/hosting/includes/_navbar_transparent.html diff --git a/hosting/static/hosting/css/landing-page.css b/hosting/static/hosting/css/landing-page.css index b1972eed..63a2f54a 100644 --- a/hosting/static/hosting/css/landing-page.css +++ b/hosting/static/hosting/css/landing-page.css @@ -39,6 +39,30 @@ h6 { font-size: 14px; } +.navbar-transparent { + background: transparent; + border: none; + padding: 20px; +} + +.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; +} +.navbar-transparent .navbar-nav>li>a:focus, .navbar-transparent .navbar-nav>li>a:hover { + color: #fff; + background-color: transparent; +} + +.navbar-transparent #logoWhite{ + display: block; + width: 220px; +} + .lead { font-size: 18px; font-weight: 400; @@ -634,11 +658,11 @@ a.unlink:hover { .card-cvc-element { padding-left: 10px; } - + .hide-mobile{ display:none; } - + #billing-form .form-control { box-shadow: none !important; font-weight: 400; diff --git a/hosting/templates/hosting/base_short.html b/hosting/templates/hosting/base_short.html index 6a08b97b..b5e19238 100644 --- a/hosting/templates/hosting/base_short.html +++ b/hosting/templates/hosting/base_short.html @@ -48,78 +48,80 @@ - - - + {% block navbar %} + + + + {% endblock navbar %}
    diff --git a/hosting/templates/hosting/includes/_navbar_transparent.html b/hosting/templates/hosting/includes/_navbar_transparent.html new file mode 100644 index 00000000..d3befe60 --- /dev/null +++ b/hosting/templates/hosting/includes/_navbar_transparent.html @@ -0,0 +1,72 @@ +{% load static i18n %} + + + \ No newline at end of file diff --git a/hosting/templates/hosting/login.html b/hosting/templates/hosting/login.html index 3ae7b7c2..12c9eba6 100644 --- a/hosting/templates/hosting/login.html +++ b/hosting/templates/hosting/login.html @@ -1,18 +1,23 @@ {% extends "hosting/base_short.html" %} {% load i18n %} {% load staticfiles bootstrap3%} + +{% block navbar %} + {% include 'hosting/includes/_navbar_transparent.html' %} +{% endblock navbar %} + {% block content %}
    - +

    {% trans "Your VM hosted in Switzerland"%}

    - +

    {% trans "Login"%}

    @@ -26,8 +31,8 @@ {% trans "Login"%} {% endbuttons %} - - + +
    {% endblock %} From 0db218cfbff3ebcd0bc903e4af7ec2eb5c32924c Mon Sep 17 00:00:00 2001 From: Andrii Marynets Date: Mon, 24 Jul 2017 18:52:28 +0300 Subject: [PATCH 07/25] Change text on button Order now! --- .../locale/de/LC_MESSAGES/django.po | 37 ++++++++++--------- .../datacenterlight/calculator_form.html | 2 +- 2 files changed, 21 insertions(+), 18 deletions(-) diff --git a/datacenterlight/locale/de/LC_MESSAGES/django.po b/datacenterlight/locale/de/LC_MESSAGES/django.po index 5aa97bdd..e221c123 100644 --- a/datacenterlight/locale/de/LC_MESSAGES/django.po +++ b/datacenterlight/locale/de/LC_MESSAGES/django.po @@ -8,7 +8,7 @@ msgid "" msgstr "" "Project-Id-Version: PACKAGE VERSION\n" "Report-Msgid-Bugs-To: \n" -"POT-Creation-Date: 2017-07-13 23:55+0530\n" +"POT-Creation-Date: 2017-07-24 18:51+0300\n" "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n" "Last-Translator: FULL NAME \n" "Language-Team: LANGUAGE \n" @@ -103,9 +103,8 @@ msgid "Please enter a valid email address." msgstr "Bitte gib eine gültige E-Mailadresse ein." #: templates/datacenterlight/calculator_form.html:88 -#: templates/datacenterlight/pricing.html:79 -msgid "Order Now!" -msgstr "Bestelle jetzt!" +msgid "Continue" +msgstr "Weiter" #: templates/datacenterlight/emails/request_access_confirmation.html:99 #: templates/datacenterlight/emails/request_access_confirmation.txt:99 @@ -325,46 +324,46 @@ msgid "Confirm Order" msgstr "Bestellung Bestätigen" #: templates/datacenterlight/order_detail.html:30 -msgid "Billed To:" -msgstr "Rechnungsadresse" - -#: templates/datacenterlight/order_detail.html:39 msgid "Date" msgstr "Datum" -#: templates/datacenterlight/order_detail.html:48 +#: templates/datacenterlight/order_detail.html:36 +msgid "Billed To:" +msgstr "Rechnungsadresse" + +#: templates/datacenterlight/order_detail.html:47 msgid "Payment Method:" msgstr "Bezahlmethode" -#: templates/datacenterlight/order_detail.html:49 +#: templates/datacenterlight/order_detail.html:48 msgid "ending" msgstr "endend in" -#: templates/datacenterlight/order_detail.html:59 +#: templates/datacenterlight/order_detail.html:58 msgid "Order summary" msgstr "Bestellungsübersicht" -#: templates/datacenterlight/order_detail.html:63 +#: templates/datacenterlight/order_detail.html:62 msgid "Cores" msgstr "Prozessorkerne" -#: templates/datacenterlight/order_detail.html:65 +#: templates/datacenterlight/order_detail.html:64 msgid "Memory" msgstr "Arbeitsspeicher" -#: templates/datacenterlight/order_detail.html:67 +#: templates/datacenterlight/order_detail.html:66 msgid "Disk space" msgstr "Festplattenkapazität" -#: templates/datacenterlight/order_detail.html:69 +#: templates/datacenterlight/order_detail.html:68 msgid "Configuration" msgstr "Konfiguration" -#: templates/datacenterlight/order_detail.html:71 +#: templates/datacenterlight/order_detail.html:70 msgid "Total" msgstr "" -#: templates/datacenterlight/order_detail.html:78 +#: templates/datacenterlight/order_detail.html:77 msgid "Place order" msgstr "Bestellen" @@ -372,6 +371,10 @@ msgstr "Bestellen" msgid "We are cutting down the costs significantly!" msgstr "Wir sorgen dafür, dass die Kosten für Dich signifikant abnehmen" +#: templates/datacenterlight/pricing.html:79 +msgid "Order Now!" +msgstr "Bestelle jetzt!" + #: templates/datacenterlight/pricing.html:89 msgid "" "Our VMs are hosted in Glarus, Switzerland, and our website is currently " diff --git a/datacenterlight/templates/datacenterlight/calculator_form.html b/datacenterlight/templates/datacenterlight/calculator_form.html index 09b59b6f..de97f295 100644 --- a/datacenterlight/templates/datacenterlight/calculator_form.html +++ b/datacenterlight/templates/datacenterlight/calculator_form.html @@ -85,5 +85,5 @@
    - + From 3c5cd50a4738df6470d164d0c13c343f15de0b40 Mon Sep 17 00:00:00 2001 From: ARvind Tiwari Date: Tue, 25 Jul 2017 18:26:56 +0530 Subject: [PATCH 08/25] commented markup removed from navbar --- hosting/templates/hosting/base_short.html | 61 +++++++------------ .../hosting/includes/_navbar_transparent.html | 61 +++++++------------ 2 files changed, 42 insertions(+), 80 deletions(-) diff --git a/hosting/templates/hosting/base_short.html b/hosting/templates/hosting/base_short.html index b5e19238..21aa93db 100644 --- a/hosting/templates/hosting/base_short.html +++ b/hosting/templates/hosting/base_short.html @@ -68,52 +68,33 @@ {% endif %} diff --git a/hosting/templates/hosting/includes/_navbar_transparent.html b/hosting/templates/hosting/includes/_navbar_transparent.html index d3befe60..01d39e52 100644 --- a/hosting/templates/hosting/includes/_navbar_transparent.html +++ b/hosting/templates/hosting/includes/_navbar_transparent.html @@ -1,6 +1,5 @@ {% load static i18n %} -
    From c511ede2c79252f54a7c908e36483622a59d2048 Mon Sep 17 00:00:00 2001 From: ARvind Tiwari Date: Tue, 25 Jul 2017 19:12:28 +0530 Subject: [PATCH 09/25] removed collapse button from navbar on login/signup/reset-password --- .../hosting/includes/_navbar_transparent.html | 42 ------------------- 1 file changed, 42 deletions(-) diff --git a/hosting/templates/hosting/includes/_navbar_transparent.html b/hosting/templates/hosting/includes/_navbar_transparent.html index 01d39e52..31bbe6bf 100644 --- a/hosting/templates/hosting/includes/_navbar_transparent.html +++ b/hosting/templates/hosting/includes/_navbar_transparent.html @@ -4,50 +4,8 @@
    - {% if request.user.is_authenticated %} - - - {% endif %} -
    \ No newline at end of file From 8e1a5a0221f1cbe3bc618d8012b167cad9e521cf Mon Sep 17 00:00:00 2001 From: ARvind Tiwari Date: Tue, 25 Jul 2017 19:44:19 +0530 Subject: [PATCH 10/25] added back href to links, removed blinking --- datacenterlight/static/datacenterlight/js/main.js | 3 ++- .../templates/datacenterlight/includes/_navbar.html | 6 +++--- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/datacenterlight/static/datacenterlight/js/main.js b/datacenterlight/static/datacenterlight/js/main.js index e19f3ddd..2c66b13f 100644 --- a/datacenterlight/static/datacenterlight/js/main.js +++ b/datacenterlight/static/datacenterlight/js/main.js @@ -86,7 +86,8 @@ } function _initNavUrl() { - $('.url').click(function () { + $('.url').click(function (event) { + event.preventDefault() var href = $(this).attr('data-url'); $('.navbar-collapse').removeClass('in'); $('.navbar-collapse').addClass('collapsing'); diff --git a/datacenterlight/templates/datacenterlight/includes/_navbar.html b/datacenterlight/templates/datacenterlight/includes/_navbar.html index da3e672c..e1ce56a1 100644 --- a/datacenterlight/templates/datacenterlight/includes/_navbar.html +++ b/datacenterlight/templates/datacenterlight/includes/_navbar.html @@ -27,9 +27,9 @@
  • From 9883a3f9080a3474995027f2e983d20cb7d8558f Mon Sep 17 00:00:00 2001 From: PCoder Date: Wed, 26 Jul 2017 01:55:31 +0530 Subject: [PATCH 11/25] Refactored the validation error messages --- datacenterlight/views.py | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/datacenterlight/views.py b/datacenterlight/views.py index c7720e39..fc0b8b2e 100644 --- a/datacenterlight/views.py +++ b/datacenterlight/views.py @@ -248,21 +248,21 @@ class IndexView(CreateView): try: cores = cores_field.clean(cores) except ValidationError as err: - msg = '{} {}.'.format(cores, _('is not a proper cores number')) + msg = '{} : {}.'.format(cores, str(err)) messages.add_message(self.request, messages.ERROR, msg, extra_tags='cores') return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form") try: memory = memory_field.clean(memory) except ValidationError as err: - msg = '{} {}.'.format(memory, _('is not a proper memory number')) + msg = '{} : {}.'.format(memory, str(err)) messages.add_message(self.request, messages.ERROR, msg, extra_tags='memory') return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form") try: storage = storage_field.clean(storage) except ValidationError as err: - msg = '{} {}.'.format(storage, _('is not a proper storage number')) + msg = '{} : {}.'.format(storage, str(err)) messages.add_message(self.request, messages.ERROR, msg, extra_tags='storage') return HttpResponseRedirect(reverse('datacenterlight:index') + "#order_form") From 2c7a42e447ccc7828d92509b032af18472b69edb Mon Sep 17 00:00:00 2001 From: ARvind Tiwari Date: Wed, 26 Jul 2017 16:54:49 +0530 Subject: [PATCH 12/25] removed class url from tags which redirect to other page --- .../datacenterlight/includes/_navbar.html | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/datacenterlight/templates/datacenterlight/includes/_navbar.html b/datacenterlight/templates/datacenterlight/includes/_navbar.html index e1ce56a1..84358b4d 100644 --- a/datacenterlight/templates/datacenterlight/includes/_navbar.html +++ b/datacenterlight/templates/datacenterlight/includes/_navbar.html @@ -12,11 +12,11 @@ {% if request.resolver_match.url_name == "index" or request.resolver_match.url_name == "whydatacenterlight" %} - - + + {% else %} - - + + {% endif %}
  • @@ -33,7 +33,7 @@
  • - {% trans "Why Data Center Light?" %} + {% trans "Why Data Center Light?" %}
  • {% trans "Contact" %} @@ -51,9 +51,9 @@
    {% if LANGUAGE_CODE == 'en-us'%} - Deutsch + Deutsch {% else %} - English + English {% endif %}
    From b9873c282951b169896b7999c41fa65887f44a96 Mon Sep 17 00:00:00 2001 From: ARvind Tiwari Date: Wed, 26 Jul 2017 17:07:12 +0530 Subject: [PATCH 13/25] changed font name to 'Lato' from 'Lato-Regular' in landing-page.css --- .../static/datacenterlight/css/landing-page.css | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/datacenterlight/static/datacenterlight/css/landing-page.css b/datacenterlight/static/datacenterlight/css/landing-page.css index c9e1d12e..07ecc3b6 100755 --- a/datacenterlight/static/datacenterlight/css/landing-page.css +++ b/datacenterlight/static/datacenterlight/css/landing-page.css @@ -194,7 +194,7 @@ h6 { .nav-language .select-language span { margin-left: 5px; margin-right: 5px; - font-family: 'Lato-Regular', sans-serif; + font-family: 'Lato', sans-serif; } .nav-language .drop-language { @@ -214,10 +214,10 @@ h6 { text-align: center; border-radius: 4px; } - + .nav-language .drop-language a { cursor: pointer; - font-family: 'Lato-Regular', sans-serif; + font-family: 'Lato', sans-serif; } .navbar-transparent .nav-language .drop-language { @@ -858,7 +858,7 @@ tech-sub-sec h2 { 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; + font-family: 'Lato', sans-serif; } .price-calc-section .text { @@ -923,7 +923,7 @@ tech-sub-sec h2 { } .price-calc-section .card .title h3 { - font-family: 'Lato-Regular', sans-serif; + font-family: 'Lato', sans-serif; } .price-calc-section .card .price { @@ -1011,7 +1011,7 @@ tech-sub-sec h2 { .price-calc-section .card .description.input label { font-size: 15px; font-weight: 800; - font-family: 'Lato-Regular'; + font-family: 'Lato'; margin-bottom: 0; width: 40px; } From c92960a3e61ff6ed83a668cce42c0c649ae2debc Mon Sep 17 00:00:00 2001 From: "M.Ravi" Date: Wed, 26 Jul 2017 19:38:38 +0200 Subject: [PATCH 14/25] Added VMTemplate model --- datacenterlight/models.py | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/datacenterlight/models.py b/datacenterlight/models.py index 605a944c..0c6a586a 100644 --- a/datacenterlight/models.py +++ b/datacenterlight/models.py @@ -9,12 +9,13 @@ class BetaAccessVMType(models.Model): def __str__(self): return "ID: %s - SSD %s - RAM %s - CPU %s - Price %s " % \ - (self.id, str(self.ssd), self.ram, self.cpu, self.price) + (self.id, str(self.ssd), self.ram, self.cpu, self.price) class BetaAccess(models.Model): email = models.CharField(max_length=250) name = models.CharField(max_length=250) + # vm = models.ForeignKey(BetaAccessVM) def __str__(self): @@ -48,3 +49,13 @@ class BetaAccessVM(models.Model): amount=vm[VM_AMOUNT], type=vm_type)) return created_vms + + +class VMTemplate(models.Model): + name = models.CharField(max_length=50) + opennebula_vm_id = models.IntegerField() + + @classmethod + def create(cls, name, opennebula_vm_id): + vm_template = cls(name=name, opennebula_vm_id=opennebula_vm_id) + return vm_template From bc2ad28969a98a7e55afb5eb38456243aef68144 Mon Sep 17 00:00:00 2001 From: "M.Ravi" Date: Wed, 26 Jul 2017 19:41:05 +0200 Subject: [PATCH 15/25] Fixed bug where we need to fetch VMs whose names strictly begin with 'public-' --- opennebula_api/models.py | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/opennebula_api/models.py b/opennebula_api/models.py index 383062f1..60f3159c 100644 --- a/opennebula_api/models.py +++ b/opennebula_api/models.py @@ -59,7 +59,7 @@ class OpenNebulaManager(): domain=settings.OPENNEBULA_DOMAIN, port=settings.OPENNEBULA_PORT, endpoint=settings.OPENNEBULA_ENDPOINT - )) + )) def _get_opennebula_client(self, username, password): return oca.Client("{0}:{1}".format( @@ -71,7 +71,7 @@ class OpenNebulaManager(): domain=settings.OPENNEBULA_DOMAIN, port=settings.OPENNEBULA_PORT, endpoint=settings.OPENNEBULA_ENDPOINT - )) + )) def _get_user(self, user): """Get the corresponding opennebula user for a CustomUser object @@ -325,7 +325,7 @@ class OpenNebulaManager(): public_templates = [ template for template in self._get_template_pool() - if 'public-' in template.name + if template.name.startswith('public-') ] return public_templates except ConnectionRefusedError: @@ -396,7 +396,7 @@ class OpenNebulaManager(): def delete_template(self, template_id): self.oneadmin_client.call(oca.VmTemplate.METHODS[ - 'delete'], template_id, False) + 'delete'], template_id, False) def change_user_password(self, new_password): self.oneadmin_client.call( From 762c8b14cca3936925b8217ea20ea1f6aa4f8533 Mon Sep 17 00:00:00 2001 From: "M.Ravi" Date: Wed, 26 Jul 2017 19:52:02 +0200 Subject: [PATCH 16/25] Added fetchvmtemplates management command in datacenterlight --- .../management/commands/fetchvmtemplates.py | 29 +++++++++++++++++++ 1 file changed, 29 insertions(+) create mode 100644 datacenterlight/management/commands/fetchvmtemplates.py diff --git a/datacenterlight/management/commands/fetchvmtemplates.py b/datacenterlight/management/commands/fetchvmtemplates.py new file mode 100644 index 00000000..15b76fc1 --- /dev/null +++ b/datacenterlight/management/commands/fetchvmtemplates.py @@ -0,0 +1,29 @@ +from django.core.management.base import BaseCommand +from opennebula_api.models import OpenNebulaManager +from datacenterlight.models import VMTemplate +import logging + +logger = logging.getLogger(__name__) + + +class Command(BaseCommand): + help = 'Fetches the VM templates from OpenNebula and populates the dcl VMTemplate model' + + def handle(self, *args, **options): + try: + manager = OpenNebulaManager() + templates = manager.get_templates() + dcl_vm_templates = [] + for template in templates: + template_name = template.name.strip('public-') + template_id = template.id + dcl_vm_template = VMTemplate.create(template_name, template_id) + dcl_vm_templates.append(dcl_vm_template) + + old_vm_templates = VMTemplate.objects.all() + old_vm_templates.delete() + + for dcl_vm_template in dcl_vm_templates: + dcl_vm_template.save() + except Exception as e: + logger.error('Error connecting to OpenNebula. Error Details: {err}'.format(err=str(e))) From 71e4fece58ed685ab1362ea6e40f3861f78b1e95 Mon Sep 17 00:00:00 2001 From: "M.Ravi" Date: Wed, 26 Jul 2017 20:35:12 +0200 Subject: [PATCH 17/25] Renamed opennebula_vm_id to opennebula_vm_template_id --- datacenterlight/models.py | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/datacenterlight/models.py b/datacenterlight/models.py index 0c6a586a..fdfebc96 100644 --- a/datacenterlight/models.py +++ b/datacenterlight/models.py @@ -53,9 +53,9 @@ class BetaAccessVM(models.Model): class VMTemplate(models.Model): name = models.CharField(max_length=50) - opennebula_vm_id = models.IntegerField() + opennebula_vm_template_id = models.IntegerField() @classmethod - def create(cls, name, opennebula_vm_id): - vm_template = cls(name=name, opennebula_vm_id=opennebula_vm_id) + def create(cls, name, opennebula_vm_template_id): + vm_template = cls(name=name, opennebula_vm_template_id=opennebula_vm_template_id) return vm_template From f3cfe19e68f32d9f94d3e1f3e966acdc33dd44f5 Mon Sep 17 00:00:00 2001 From: "M.Ravi" Date: Wed, 26 Jul 2017 20:38:53 +0200 Subject: [PATCH 18/25] Reformatted the template file and used opennebula_vm_template_id instead of template_id --- .../datacenterlight/calculator_form.html | 62 +++++++++++-------- 1 file changed, 36 insertions(+), 26 deletions(-) diff --git a/datacenterlight/templates/datacenterlight/calculator_form.html b/datacenterlight/templates/datacenterlight/calculator_form.html index de97f295..009a358d 100644 --- a/datacenterlight/templates/datacenterlight/calculator_form.html +++ b/datacenterlight/templates/datacenterlight/calculator_form.html @@ -2,7 +2,7 @@
    {% csrf_token %}
    -

    {% trans "VM hosting" %}

    +

    {% trans "VM hosting" %}

    15 @@ -17,28 +17,31 @@
    - - - Core - + + + Core +
    - - - GB RAM - + + + GB RAM +
    - - - {% trans "GB Storage (SSD)" %} - + + + {% trans "GB Storage (SSD)" %} +
    @@ -46,7 +49,7 @@
  • @@ -56,31 +59,38 @@ -->
    - - + +
    {% for message in messages %} - {% if 'name' in message.tags %} -
    • + {% if 'name' in message.tags %} +
        +
      • {{ message|safe }} -
      - {% endif %} +
    • +
    + {% endif %} {% endfor %}
    - - + +
    {% for message in messages %} - {% if 'email' in message.tags %} -
    • + {% if 'email' in message.tags %} +
        +
      • {{ message|safe }} -
      - {% endif %} +
    • +
    + {% endif %} {% endfor %}
    From 1f58da70d477cb07d7fae9e3ac14a99c923f4764 Mon Sep 17 00:00:00 2001 From: "M.Ravi" Date: Wed, 26 Jul 2017 20:39:51 +0200 Subject: [PATCH 19/25] Removed OpenNebula code from the IndexView and code reformatted --- datacenterlight/views.py | 29 ++++++++++------------------- 1 file changed, 10 insertions(+), 19 deletions(-) diff --git a/datacenterlight/views.py b/datacenterlight/views.py index 6b0e0d7e..0c09d74e 100644 --- a/datacenterlight/views.py +++ b/datacenterlight/views.py @@ -1,7 +1,7 @@ from django.views.generic import FormView, CreateView, TemplateView, DetailView from django.http import HttpResponseRedirect from .forms import BetaAccessForm -from .models import BetaAccess, BetaAccessVMType, BetaAccessVM +from .models import BetaAccess, BetaAccessVMType, BetaAccessVM, VMTemplate from django.contrib import messages from django.core.urlresolvers import reverse from django.core.mail import EmailMessage @@ -199,20 +199,11 @@ class IndexView(CreateView): for session_var in ['specs', 'user', 'billing_address_data']: if session_var in request.session: del request.session[session_var] - 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' - } + + vm_templates = VMTemplate.objects.all() + context = { + 'templates': vm_templates + } return render(request, self.template_name, context) def post(self, request): @@ -329,7 +320,7 @@ class WhyDataCenterLightView(IndexView): ) context = { 'error': 'connection' - } + } return render(request, self.template_name, context) @@ -462,9 +453,9 @@ class OrderConfirmationView(DetailView): template_id=vm_template_id, specs=specs, vm_name="{email}-{template_name}-{date}".format( - email=user.get('email'), - template_name=template.get('name'), - date=int(datetime.now().strftime("%s"))) + email=user.get('email'), + template_name=template.get('name'), + date=int(datetime.now().strftime("%s"))) ) # Create a Hosting Order From 8485819caaf54d342cd24f0dd98b0e40323edc98 Mon Sep 17 00:00:00 2001 From: "M.Ravi" Date: Wed, 26 Jul 2017 20:58:08 +0200 Subject: [PATCH 20/25] Removed unneeded code from datacenterlight/views.py --- datacenterlight/views.py | 19 ------------------- 1 file changed, 19 deletions(-) diff --git a/datacenterlight/views.py b/datacenterlight/views.py index 0c09d74e..57f7d32a 100644 --- a/datacenterlight/views.py +++ b/datacenterlight/views.py @@ -304,25 +304,6 @@ 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' From 1a6e497e385a1b4c6bea0033ea6d764668e48f4b Mon Sep 17 00:00:00 2001 From: PCoder Date: Thu, 27 Jul 2017 11:25:48 +0530 Subject: [PATCH 21/25] Removed another openebula call after submitting landing page calculator --- datacenterlight/views.py | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/datacenterlight/views.py b/datacenterlight/views.py index 57f7d32a..401be537 100644 --- a/datacenterlight/views.py +++ b/datacenterlight/views.py @@ -212,9 +212,7 @@ class IndexView(CreateView): 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 + template_data = VMTemplate.objects.all() name = request.POST.get('name') email = request.POST.get('email') From fca291c6a5afbf548f520c560fb87ba8097679ff Mon Sep 17 00:00:00 2001 From: PCoder Date: Thu, 27 Jul 2017 12:05:01 +0530 Subject: [PATCH 22/25] Added VMTemplateSerializer --- datacenterlight/views.py | 5 +++-- opennebula_api/serializers.py | 6 ++++++ 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/datacenterlight/views.py b/datacenterlight/views.py index 401be537..017a1f3a 100644 --- a/datacenterlight/views.py +++ b/datacenterlight/views.py @@ -21,7 +21,7 @@ from datetime import datetime from membership.models import CustomUser, StripeCustomer from opennebula_api.models import OpenNebulaManager -from opennebula_api.serializers import VirtualMachineTemplateSerializer, VirtualMachineSerializer +from opennebula_api.serializers import VirtualMachineTemplateSerializer, VirtualMachineSerializer, VMTemplateSerializer class LandingProgramView(TemplateView): @@ -212,7 +212,8 @@ class IndexView(CreateView): storage = request.POST.get('storage') price = request.POST.get('total') template_id = int(request.POST.get('config')) - template_data = VMTemplate.objects.all() + template = VMTemplate.objects.filter(opennebula_vm_template_id=template_id).first() + template_data = VMTemplateSerializer(template).data name = request.POST.get('name') email = request.POST.get('email') diff --git a/opennebula_api/serializers.py b/opennebula_api/serializers.py index 16ab1e76..12b313af 100644 --- a/opennebula_api/serializers.py +++ b/opennebula_api/serializers.py @@ -129,6 +129,12 @@ class VirtualMachineSerializer(serializers.Serializer): return obj.name.strip('public-') +class VMTemplateSerializer(serializers.Serializer): + """Serializer to map the VMTemplate instance into JSON format.""" + id = serializers.IntegerField(read_only=True, source='opennebula_vm_template_id') + name = serializers.CharField(read_only=True) + + def hexstr2int(string): return int(string.replace(':', ''), 16) From 035266b68b7046eec7806418bf81d8cdcd3bb2a6 Mon Sep 17 00:00:00 2001 From: ARvind Tiwari Date: Thu, 27 Jul 2017 15:50:44 +0530 Subject: [PATCH 23/25] main.js indent changed back to 4 spaces --- .../static/datacenterlight/js/main.js | 278 +++++++++--------- 1 file changed, 139 insertions(+), 139 deletions(-) diff --git a/datacenterlight/static/datacenterlight/js/main.js b/datacenterlight/static/datacenterlight/js/main.js index 2c66b13f..91576eac 100644 --- a/datacenterlight/static/datacenterlight/js/main.js +++ b/datacenterlight/static/datacenterlight/js/main.js @@ -1,164 +1,164 @@ -(function ($) { - "use strict"; // Start of use strict +(function($) { + "use strict"; // Start of use strict - /* --------------------------------------------- - Scripts initialization - --------------------------------------------- */ - var cardPricing = { - 'cpu': { - 'id': 'coreValue', - 'value': 1, - 'min': 1, - 'max': 48, - 'interval': 1 - }, - 'ram': { - 'id': 'ramValue', - 'value': 2, - 'min': 2, - 'max': 200, - 'interval': 1 - }, - 'storage': { - 'id': 'storageValue', - 'value': 10, - 'min': 10, - 'max': 500, - 'interval': 10 + /* --------------------------------------------- + Scripts initialization + --------------------------------------------- */ + var cardPricing = { + 'cpu': { + 'id': 'coreValue', + 'value': 1, + 'min': 1, + 'max': 48, + 'interval': 1 + }, + 'ram': { + 'id': 'ramValue', + 'value': 2, + 'min': 2, + 'max': 200, + 'interval': 1 + }, + 'storage': { + 'id': 'storageValue', + 'value': 10, + 'min': 10, + 'max': 500, + 'interval': 10 + } } - } - $(window).load(function () { + $(window).load(function() { - }); - - $(document).ready(function () { - verifiedUrl(); - _navScroll(); - _initScroll(); - _initNavUrl(); - _initPricing(); - - }); - - $(window).resize(function () { - - - - }); - - - - /* --------------------------------------------- - 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 */ - } + $(document).ready(function() { + verifiedUrl(); + _navScroll(); + _initScroll(); + _initNavUrl(); + _initPricing(); - - function _initScroll() { - $(window).scroll(function () { - _navScroll(); }); - } - function _navScroll() { - 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"); + $(window).resize(function() { + + + + }); + + + + /* --------------------------------------------- + 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 { - $(".navbar").addClass("navbar-transparent"); - $(".navbar-default .btn-link").css("color", "#fff"); - $(".dropdown-menu").addClass("navbar-transparent"); - $(".dropdown-menu > li > a").css("color", "#fff"); + /* the viewport is less than 400 pixels wide */ } - } - function _initNavUrl() { - $('.url').click(function (event) { - event.preventDefault() - var href = $(this).attr('data-url'); - $('.navbar-collapse').removeClass('in'); - $('.navbar-collapse').addClass('collapsing'); - var url = window.location.pathname; - var urlSplit = url.split('/'); - if (urlSplit.length === 3 && urlSplit[2] === 'datacenterlight') { - $('html, body').animate({ - scrollTop: $(href).offset().top - }, 1000); - } else { - var allUrl = window.location.href; - var redirect = allUrl.split('whydatacenterlight') - window.location.href = '/en-us/datacenterlight' + href; - } - }); - } - function verifiedUrl() { - if (window.location.href.indexOf('#success') > -1) { - form_success(); + + function _initScroll() { + $(window).scroll(function() { + _navScroll(); + }); } - } - function _initPricing() { - _fetchPricing(); + function _navScroll() { + 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"); + } + } - $('.fa-minus-circle.left').click(function (event) { - var data = $(this).data('minus'); + function _initNavUrl() { + $('.url').click(function(event) { + event.preventDefault(); + var href = $(this).attr('data-url'); + $('.navbar-collapse').removeClass('in'); + $('.navbar-collapse').addClass('collapsing'); + var url = window.location.pathname; + var urlSplit = url.split('/'); + if (urlSplit.length === 3 && urlSplit[2] === 'datacenterlight') { + $('html, body').animate({ + scrollTop: $(href).offset().top + }, 1000); + } else { + var allUrl = window.location.href; + var redirect = allUrl.split('whydatacenterlight') + window.location.href = '/en-us/datacenterlight' + href; + } + }); + } - if (cardPricing[data].value > cardPricing[data].min) { - cardPricing[data].value = Number(cardPricing[data].value) - cardPricing[data].interval; - } - _fetchPricing(); - }); - $('.fa-plus-circle.right').click(function (event) { - var data = $(this).data('plus'); - if (cardPricing[data].value < cardPricing[data].max) { - cardPricing[data].value = Number(cardPricing[data].value) + cardPricing[data].interval; - } - _fetchPricing(); - }); + function verifiedUrl() { + if (window.location.href.indexOf('#success') > -1) { + form_success(); + } + } - $('.input-price').change(function () { - var data = $(this).attr("name"); - cardPricing[data].value = $('input[name=' + data + ']').val(); - _fetchPricing(); - }); - } + function _initPricing() { + _fetchPricing(); - function _fetchPricing() { - Object.keys(cardPricing).map(function (element) { - //$('#'+cardPricing[element].id).val(cardPricing[element].value); - $('input[name=' + element + ']').val(cardPricing[element].value); - }); - _calcPricing(); - } + $('.fa-minus-circle.left').click(function(event) { + var data = $(this).data('minus'); - function _calcPricing() { - var total = (cardPricing['cpu'].value * 5) + (2 * cardPricing['ram'].value) + (0.6 * cardPricing['storage'].value); - total = parseFloat(total.toFixed(2)); + if (cardPricing[data].value > cardPricing[data].min) { + cardPricing[data].value = Number(cardPricing[data].value) - cardPricing[data].interval; + } + _fetchPricing(); + }); + $('.fa-plus-circle.right').click(function(event) { + var data = $(this).data('plus'); + if (cardPricing[data].value < cardPricing[data].max) { + cardPricing[data].value = Number(cardPricing[data].value) + cardPricing[data].interval; + } + _fetchPricing(); + }); - $("#total").text(total); - $('input[name=total]').val(total); - } + $('.input-price').change(function() { + var data = $(this).attr("name"); + cardPricing[data].value = $('input[name=' + data + ']').val(); + _fetchPricing(); + }); + } - function form_success() { - $('#sucessModal').modal('show'); - } + function _fetchPricing() { + Object.keys(cardPricing).map(function(element) { + //$('#'+cardPricing[element].id).val(cardPricing[element].value); + $('input[name=' + element + ']').val(cardPricing[element].value); + }); + _calcPricing(); + } - function _calculate(numbers, price) { - $('#valueTotal').text(numbers * price * 31); - } + function _calcPricing() { + var total = (cardPricing['cpu'].value * 5) + (2 * cardPricing['ram'].value) + (0.6 * cardPricing['storage'].value); + total = parseFloat(total.toFixed(2)); -})(jQuery); + $("#total").text(total); + $('input[name=total]').val(total); + } + + function form_success() { + $('#sucessModal').modal('show'); + } + + function _calculate(numbers, price) { + $('#valueTotal').text(numbers * price * 31); + } + +})(jQuery); \ No newline at end of file From 3c4ca1101af895d6aa749912e775c80523ff62b2 Mon Sep 17 00:00:00 2001 From: Pcoder Date: Fri, 28 Jul 2017 01:02:45 +0530 Subject: [PATCH 24/25] Update main.js Fixed probably a typo. 500 -> 2000 for storage. --- datacenterlight/static/datacenterlight/js/main.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/datacenterlight/static/datacenterlight/js/main.js b/datacenterlight/static/datacenterlight/js/main.js index 91576eac..0b9dc3ea 100644 --- a/datacenterlight/static/datacenterlight/js/main.js +++ b/datacenterlight/static/datacenterlight/js/main.js @@ -24,7 +24,7 @@ 'id': 'storageValue', 'value': 10, 'min': 10, - 'max': 500, + 'max': 2000, 'interval': 10 } } @@ -161,4 +161,4 @@ $('#valueTotal').text(numbers * price * 31); } -})(jQuery); \ No newline at end of file +})(jQuery); From deee202d049cdff8d57fed8fa76da5e7a5578ec7 Mon Sep 17 00:00:00 2001 From: Pcoder Date: Fri, 28 Jul 2017 01:04:23 +0530 Subject: [PATCH 25/25] Update main.js Added a terminator --- datacenterlight/static/datacenterlight/js/main.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/datacenterlight/static/datacenterlight/js/main.js b/datacenterlight/static/datacenterlight/js/main.js index 0b9dc3ea..44b92a0c 100644 --- a/datacenterlight/static/datacenterlight/js/main.js +++ b/datacenterlight/static/datacenterlight/js/main.js @@ -27,7 +27,7 @@ 'max': 2000, 'interval': 10 } - } + }; $(window).load(function() {