From fb6ddd3512aae7ed221ddc61f68c3598bfa8a366 Mon Sep 17 00:00:00 2001 From: Arvind Tiwari Date: Wed, 17 Jan 2018 16:31:46 +0530 Subject: [PATCH] moved styles to common.css, removed more unused styles --- .../static/datacenterlight/css/common.css | 96 ++++++ .../static/datacenterlight/css/hosting.css | 318 +----------------- .../datacenterlight/css/landing-page.css | 109 +----- .../templates/datacenterlight/base.html | 4 +- .../datacenterlight/base_hosting.html | 11 +- .../datacenterlight/contact_form.html | 5 +- .../datacenterlight/includes/_navbar.html | 4 +- .../templates/datacenterlight/index.html | 6 +- datacenterlight/views.py | 1 - digitalglarus/templates/new_base_glarus.html | 46 +-- hosting/static/hosting/css/landing-page.css | 4 - hosting/static/hosting/js/initial.js | 10 - .../hosting/js/virtual_machine_detail.js | 12 + hosting/templates/hosting/login.html | 2 +- .../hosting/resend_activation_link.html | 2 +- .../templates/ungleich_page/glasfaser.html | 6 +- .../glasfaser/section_contact.html | 6 +- 17 files changed, 176 insertions(+), 466 deletions(-) create mode 100644 datacenterlight/static/datacenterlight/css/common.css diff --git a/datacenterlight/static/datacenterlight/css/common.css b/datacenterlight/static/datacenterlight/css/common.css new file mode 100644 index 00000000..9530d4a3 --- /dev/null +++ b/datacenterlight/static/datacenterlight/css/common.css @@ -0,0 +1,96 @@ +body, +html { + width: 100%; + min-height: 100%; +} + + +/* bootstrap danger color override from #a94442 */ +.text-danger, +.has-error .help-block, +.has-error .control-label, +.has-error .radio, +.has-error .checkbox, +.has-error .radio-inline, +.has-error .checkbox-inline, +.has-error.radio label, +.has-error.checkbox label, +.has-error.radio-inline label, +.has-error.checkbox-inline label, +.has-error .form-control-feedback, +.alert-danger, +.list-group-item-danger, +a.list-group-item-danger, +a.list-group-item-danger:hover, +a.list-group-item-danger:focus, +.panel-danger > .panel-heading { + color: #eb4d5c; +} + +.alert-danger{ + background: rgba(235, 204, 209, 0.2); +} + +.has-error .form-control, +.has-error .form-control:focus, +.has-error .form-control:active, +.has-error .input-group-addon { + color: #eb4d5c; + border-color: #eb4d5c; +} + +a.list-group-item-danger.active, +a.list-group-item-danger.active:hover, +a.list-group-item-danger.active:focus { + background-color: #eb4d5c; + border-color: #eb4d5c; +} + +.panel-danger > .panel-heading .badge { + background-color: #eb4d5c; +} + + +.checkmark { + display: inline-block; +} + +.checkmark:after { + /*Add another block-level blank space*/ + content: ''; + display: block; + /*Make it a small rectangle so the border will create an L-shape*/ + width: 25px; + height: 60px; + /*Add a white border on the bottom and left, creating that 'L' */ + border: solid #777; + border-width: 0 3px 3px 0; + /*Rotate the L 45 degrees to turn it into a checkmark*/ + transform: rotate(45deg); +} + + +.topnav { + font-size: 14px; +} + +.navbar-default { + background: #fff; + padding: 5px; +} + +.navbar-brand { + padding: 10px 15px; +} + +@media (max-width: 767px) { + .navbar-brand { + padding: 10px; + } +} + +@media (min-width: 768px) { + .navbar-right { + margin-right: 10px; + } +} \ No newline at end of file diff --git a/datacenterlight/static/datacenterlight/css/hosting.css b/datacenterlight/static/datacenterlight/css/hosting.css index 28c7902b..c64eca96 100644 --- a/datacenterlight/static/datacenterlight/css/hosting.css +++ b/datacenterlight/static/datacenterlight/css/hosting.css @@ -1,9 +1,3 @@ -body, -html { - width: 100%; - height: 100%; -} - body, h1, h2, @@ -14,25 +8,9 @@ h6 { font-family: 'Lato', sans-serif; } -.topnav { - font-size: 14px; -} .topnav .navbar-fixed-top .navbar-collapse { max-height: 740px; } -.navbar-brand { - padding: 10px 15px; -} -@media (max-width: 767px) { - .navbar-brand { - padding: 10px 0; - } -} - -.navbar-default { - background: #fff; - padding: 5px; -} .navbar-default .navbar-header { position: relative; @@ -169,10 +147,6 @@ p.copyright { margin: 14px 0 0; } -a#forgotpassword { - color: #ffffff; -} - .content-404 h1 { margin: 0 0 15px; font-size: 200px; @@ -292,58 +266,23 @@ a#forgotpassword { margin-top: 4px; } -.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover, -.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover { +.navbar-default .navbar-nav>.open>a, +.navbar-default .navbar-nav>.open>a:focus, +.navbar-default .navbar-nav>.open>a:hover, +.navbar-default .navbar-nav>.active>a, +.navbar-default .navbar-nav>.active>a:focus, +.navbar-default .navbar-nav>.active>a:hover { background-color: transparent; } @media (max-width: 767px) { - .navbar-default .navbar-nav .open .dropdown-menu>.active>a, .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover { + .navbar-default .navbar-nav .open .dropdown-menu>.active>a, + .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus, + .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover { background-color: transparent; } } -/* bootstrap danger color override from #a94442 */ -.text-danger, -.has-error .help-block, -.has-error .control-label, -.has-error .radio, -.has-error .checkbox, -.has-error .radio-inline, -.has-error .checkbox-inline, -.has-error.radio label, -.has-error.checkbox label, -.has-error.radio-inline label, -.has-error.checkbox-inline label, -.has-error .form-control-feedback, -.alert-danger, -.list-group-item-danger, -a.list-group-item-danger, -a.list-group-item-danger:hover, -a.list-group-item-danger:focus, -.panel-danger > .panel-heading { - color: #eb4d5c; -} -.alert-danger{ - background: rgba(235, 204, 209, 0.2); -} -.has-error .form-control, -.has-error .form-control:focus, -.has-error .form-control:active, -.has-error .input-group-addon { - color: #eb4d5c; - border-color: #eb4d5c; -} -a.list-group-item-danger.active, -a.list-group-item-danger.active:hover, -a.list-group-item-danger.active:focus { - background-color: #eb4d5c; - border-color: #eb4d5c; -} -.panel-danger > .panel-heading .badge { - background-color: #eb4d5c; -} - /* bootstrap input box-shadom disable */ .has-error .form-control:focus, .has-error .form-control:active, @@ -351,28 +290,6 @@ a.list-group-item-danger.active:focus { .has-success .form-control:active { box-shadow: inset 0 0 1px rgba(0,0,0,0.25); } -.checkmark { - display: inline-block; -} -.checkmark:after { - /*Add another block-level blank space*/ - content: ''; - display: block; - /*Make it a small rectangle so the border will create an L-shape*/ - width: 25px; - height: 60px; - /*Add a white border on the bottom and left, creating that 'L' */ - border: solid #777; - border-width: 0 3px 3px 0; - /*Rotate the L 45 degrees to turn it into a checkmark*/ - transform: rotate(45deg); -} - -@media (min-width: 768px) { - .navbar-right { - margin-right: 10px; - } -} .content-dashboard{ min-height: calc(100vh - 60px); @@ -671,223 +588,6 @@ a.list-group-item-danger.active:focus { color: #a3c0e2; } -.price-calc-section { - padding: 80px 40px !important; -} - -@media (max-width: 768px) { - .price-calc-section { - margin-top: 40px; - } -} - -.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 .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: 1px 3px 6px 2px rgba(0, 0, 0, 0.2); - padding-bottom: 30px; - text-align: center; - max-width: 320px; - position: relative; -} - -@media (min-width: 768px) { - .price-calc-section .card { - margin-left: 0; - } -} - -.price-calc-section .landing { - width: 100% !important; -} - .no-padding { padding: 0 !important; -} - -.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 h3 { - font-weight: normal; -} - -.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 .description { - padding: 7px 8px 2px; - position: relative; - display: flex; - justify-content: space-around !important; - align-items: center !important; -} - -.price-calc-section .card .description span { - font-size: 14px; - margin-left: 5px; - width: 29%; - text-align: left; - line-height: 16px; -} - -.price-calc-section .card .description .select-number{ - font-size: 16px; - text-align: center; - width: 85px; -} - -.price-calc-section .card .description i { - color: #29427a; - cursor: pointer; - font-size: 20px; - border: 1px solid #ccc; - padding: 5px 6px 3px; - border-radius: 5px; -} - -.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; -} - -.price-calc-section .card .description p { - margin: 0; -} - -.price-calc-section .card .btn { - margin-top: 15px; - font-size: 20px; - width: 150px; - border: none; -} - -.price-calc-section .card .select-configuration select { - outline: none; - background: #fff; - border-color: #d0d0d0; - height: 32px; - width: 150px; - text-align: center; - font-size: 14px; - margin-left: 10px; - padding: 6px; - border-radius: 4px; -} - -.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: 700; - margin-bottom: 0; - width: 40px; -} - -.price-calc-section .card .description input { - width: 200px; - font-size: 14px; - text-align: left; - padding: 4px 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; -} - -.price-calc-section .help-block.with-errors { - text-align: center; - margin: 0 0; - padding: 0 0 5px; -} -.price-calc-section .help-block.with-errors ul { - margin-bottom: 0; -} - -.price-calc-section .form-group { - margin: 0; - position: relative; -} - -.price-calc-section .form-group:after { - content: ' '; - display: block; - position: absolute; - bottom: 0; - left: 18%; - z-index: 20; - height: 1px; - width: 65%; - background: rgba(128, 128, 128, 0.2); -} - -.price-calc-section .btn-primary { - background: #29427A; - border-color: #29427A; - color: #fff; - width: auto; } \ No newline at end of file diff --git a/datacenterlight/static/datacenterlight/css/landing-page.css b/datacenterlight/static/datacenterlight/css/landing-page.css index 92b7f121..e8943b0f 100755 --- a/datacenterlight/static/datacenterlight/css/landing-page.css +++ b/datacenterlight/static/datacenterlight/css/landing-page.css @@ -1,9 +1,3 @@ -body, -html { - width: 100%; - min-height: 100%; -} - body, h1, h2, @@ -23,13 +17,8 @@ button, input, optgroup, select, textarea { /*blue light #5A74AF*/ /*blue dark #29427A*/ -.topnav { - font-size: 14px; -} - .lead { font-size: 18px; - font-weight: 400; } @media (min-width: 768px) { @@ -89,11 +78,6 @@ button, input, optgroup, select, textarea { transition: all .3s ease-in; } -.navbar-default { - background: #fff; - padding: 5px; -} - .navbar-transparent { background: transparent; border: none; @@ -111,7 +95,6 @@ button, input, optgroup, select, textarea { .navbar-default .navbar-nav>li>a { cursor: pointer; - font-weight: 400; } .navbar-transparent .navbar-nav>li>a { @@ -119,10 +102,10 @@ button, input, optgroup, select, textarea { cursor: pointer; } -@media (min-width: 768px) { +@media (max-width: 767px) { .navbar-default .navbar-nav>li>a, .navbar-transparent .navbar-nav>li>a { - font-weight: 300; + font-weight: 400; } } @@ -145,19 +128,6 @@ button, input, optgroup, select, textarea { border-radius: 5px; } -.navbar-brand { - padding: 10px 15px; -} -@media (max-width: 767px) { - .navbar-brand { - padding: 10px 10px; - } -} - -.navbar-right { - margin-right: 10px; -} - .nav-language { position: relative; } @@ -169,7 +139,6 @@ button, input, optgroup, select, textarea { .navbar-transparent .nav-language .select-language { color: #fff; - font-weight: 300; } .nav-language .select-language span { @@ -200,7 +169,6 @@ button, input, optgroup, select, textarea { .nav-language .drop-language a{ cursor: pointer; padding: 5px 10px !important; - font-weight: 300; } /* Show the dropdown menu on hover */ @@ -223,7 +191,6 @@ button, input, optgroup, select, textarea { .navbar-transparent .nav-language .drop-language a { color: #fff; padding: 5px 10px !important; - font-weight: 300; } .intro-header { @@ -276,7 +243,6 @@ button, input, optgroup, select, textarea { .intro-message>h1 { margin: 0; - font-weight: 300; font-size: 6em; } @@ -286,10 +252,6 @@ button, input, optgroup, select, textarea { border-bottom: 1px solid rgba(0, 0, 0, 0.2); } -.intro-message>h3 { - font-weight: 300; -} - .intro-pricing { text-align: center; color: #fff; @@ -577,6 +539,14 @@ button, input, optgroup, select, textarea { font-weight: 400; } +.contact-form .with-errors ul { + margin-bottom: 0; + color: #ffc4ca; + text-align: left; + margin-left: 5px; + margin-top: 2px; +} + .contact-form .btn { min-width: 140px; background: rgba(23, 23, 23, 0.18); @@ -1276,10 +1246,6 @@ p.copyright { margin: 15px 0 0; } -a#forgotpassword { - color: #ffffff; -} - .topnav a:focus { outline: none; outline-offset: 0; @@ -1326,57 +1292,4 @@ a#forgotpassword { .w380 { max-width: 380px !important; -} - -/* bootstrap danger color override from #a94442 */ -.text-danger, -.has-error .help-block, -.has-error .control-label, -.has-error .radio, -.has-error .checkbox, -.has-error .radio-inline, -.has-error .checkbox-inline, -.has-error.radio label, -.has-error.checkbox label, -.has-error.radio-inline label, -.has-error.checkbox-inline label, -.has-error .form-control, -.has-error .form-control-feedback, -.alert-danger, -.list-group-item-danger, -a.list-group-item-danger, -a.list-group-item-danger:hover, -a.list-group-item-danger:focus, -.panel-danger > .panel-heading { - color: #eb4d5c; -} -.has-error .input-group-addon { - color: #eb4d5c; - border-color: #eb4d5c; -} -a.list-group-item-danger.active, -a.list-group-item-danger.active:hover, -a.list-group-item-danger.active:focus { - background-color: #eb4d5c; - border-color: #eb4d5c; -} -.panel-danger > .panel-heading .badge { - background-color: #eb4d5c; -} - -.checkmark { - display: inline-block; -} -.checkmark:after { - /*Add another block-level blank space*/ - content: ''; - display: block; - /*Make it a small rectangle so the border will create an L-shape*/ - width: 25px; - height: 60px; - /*Add a white border on the bottom and left, creating that 'L' */ - border: solid #777; - border-width: 0 3px 3px 0; - /*Rotate the L 45 degrees to turn it into a checkmark*/ - transform: rotate(45deg); -} +} \ No newline at end of file diff --git a/datacenterlight/templates/datacenterlight/base.html b/datacenterlight/templates/datacenterlight/base.html index b397bae5..d84847fa 100644 --- a/datacenterlight/templates/datacenterlight/base.html +++ b/datacenterlight/templates/datacenterlight/base.html @@ -21,6 +21,7 @@ {% endaddtoblock "vendor_css" %} {% addtoblock "custom_css" %} + {% block css_extra %} {% endblock css_extra %} @@ -64,13 +65,14 @@ {% endaddtoblock "vendor_js" %} + {% render_block "vendor_js" %} + {% addtoblock "custom_js" %} {% endaddtoblock "custom_js" %} - {% render_block "vendor_js" %} {% render_block "custom_js" postprocessor "compressor.contrib.sekizai.compress" %} diff --git a/datacenterlight/templates/datacenterlight/base_hosting.html b/datacenterlight/templates/datacenterlight/base_hosting.html index dff0ad8f..d88d49f8 100644 --- a/datacenterlight/templates/datacenterlight/base_hosting.html +++ b/datacenterlight/templates/datacenterlight/base_hosting.html @@ -23,6 +23,7 @@ {% endaddtoblock "vendor_css" %} {% addtoblock "custom_css" %} + {% block css_extra %} {% endblock css_extra %} @@ -67,7 +68,7 @@ {% else %} -
+
{% include "datacenterlight/includes/_footer.html" %}
{% endif %} @@ -79,11 +80,12 @@ {% endaddtoblock "vendor_js" %} + {% render_block "vendor_js" %} + + {% addtoblock "custom_js" %} - - @@ -96,7 +98,6 @@ {% endblock js_extra %} {% endaddtoblock "custom_js" %} - {% render_block "vendor_js" %} {% render_block "custom_js" postprocessor "compressor.contrib.sekizai.compress" %} @@ -106,8 +107,6 @@ {% addtoblock "payment_js" %} - - {% endaddtoblock "payment_js" %} {% render_block "payment_js" postprocessor "compressor.contrib.sekizai.compress" %} diff --git a/datacenterlight/templates/datacenterlight/contact_form.html b/datacenterlight/templates/datacenterlight/contact_form.html index 458d6168..7b57f227 100644 --- a/datacenterlight/templates/datacenterlight/contact_form.html +++ b/datacenterlight/templates/datacenterlight/contact_form.html @@ -17,12 +17,13 @@
-
+ {% csrf_token %}
+
{{contact_form.name.errors}}
@@ -30,6 +31,7 @@
+
{{contact_form.email.errors}}
@@ -37,6 +39,7 @@
+
{{contact_form.message.errors}}
diff --git a/datacenterlight/templates/datacenterlight/includes/_navbar.html b/datacenterlight/templates/datacenterlight/includes/_navbar.html index e2f1edc0..2f435704 100644 --- a/datacenterlight/templates/datacenterlight/includes/_navbar.html +++ b/datacenterlight/templates/datacenterlight/includes/_navbar.html @@ -1,6 +1,6 @@ -{% load staticfiles i18n%} -{% load custom_tags %} +{% load staticfiles i18n custom_tags %} {% get_current_language as LANGUAGE_CODE %} +