create vm error fix, more css optimizations

datacenterlight/static/datacenterlight/css/hosting.css

@@ -423,7 +423,8 @@
     order: 2;
   }
   .dcl-payment-section {
-    padding: 15px 10px;
+    padding-top: 15px;
+    padding-bottom: 15px;
     margin-bottom: 0;
     border-bottom-width: 5px;
   }
@@ -444,13 +445,6 @@
   }
 }
 
-@media (max-width: 767px) {
-  .order-confirm-btn {
-    text-align: center;
-    margin-top: 10px;
-  }
-}
-
 #virtual_machine_create_form {
   padding: 15px 0;
 }
@@ -548,10 +542,6 @@
   font-size: 11px;
 }
 
-#virtual_machine_create_form {
-  padding: 15px 0;
-}
-
 .dashboard-title-thin {
   font-weight: 300;
   font-size: 32px;

datacenterlight/static/datacenterlight/css/landing-page.css

@@ -76,21 +76,30 @@ textarea {
   transition: all .3s ease-in;
 }
 
-.navbar-transparent {
+.navbar-default .navbar-nav>.open>a,
+.navbar-default .navbar-nav>.open>a:focus,
+.navbar-default .navbar-nav>.open>a:hover {
   background: transparent;
-  border: none;
-  padding: 20px;
 }
 
-#logoWhite,
+.navbar-default .navbar-nav>.active>a,
-.navbar-transparent #logoBlack {
+.navbar-default .navbar-nav>.active>a:focus,
-  display: none;
+.navbar-default .navbar-nav>.active>a:hover {
+  background: #2D457A;
+  color: #fff;
+  border-radius: 6px;
 }
 
-#logoBlack
+@media (max-width: 767px) {
-.navbar-transparent #logoWhite {
+  .navbar-default .navbar-nav>li>a{
-  display: block;
+    font-weight: 400;
-  width: 220px;
+  }
+}
+
+.navbar-transparent .navbar-nav>.open>a,
+.navbar-transparent .navbar-nav>.open>a:focus,
+.navbar-transparent .navbar-nav>.open>a:hover {
+  color: #fff;
 }
 
 .navbar-transparent .navbar-nav>li>a {
@@ -103,12 +112,6 @@ textarea {
   background-color: transparent;
 }
 
-@media (max-width: 767px) {
-  .navbar-default .navbar-nav>li>a{
-    font-weight: 400;
-  }
-}
-
 .navbar-transparent .navbar-nav>li>.on-hover-border {
   transition: all 0.3s linear;
   box-shadow: none;
@@ -119,6 +122,27 @@ textarea {
   border-radius: 5px;
 }
 
+.navbar-transparent {
+  background: transparent;
+  border: none;
+  padding: 20px;
+}
+
+.navbar-transparent .nav-language .select-language {
+  color: #fff;
+}
+
+#logoWhite,
+.navbar-transparent #logoBlack {
+  display: none;
+}
+
+#logoBlack,
+.navbar-transparent #logoWhite {
+  display: block;
+  width: 220px;
+}
+
 .nav-language {
   position: relative;
 }
@@ -128,10 +152,6 @@ textarea {
   color: #777;
 }
 
-.navbar-transparent .nav-language .select-language {
-  color: #fff;
-}
-
 .nav-language .select-language span {
   margin-left: 5px;
   margin-right: 5px;
@@ -153,16 +173,44 @@ textarea {
   border-radius: 4px;
 }
 
-.nav-language .open .drop-language {
-  width: 100px;
-  min-width: 100px;
-}
-
 .nav-language .drop-language a {
   cursor: pointer;
   padding: 5px 10px !important;
 }
 
+.nav-language .open .drop-language {
+  width: 100px;
+  min-width: 100px;
+}
+
+.dropdown-menu {
+  border: 1px solid #fff;
+  -webkit-box-shadow: -8px 14px 20px -5px rgba(77, 77, 77, 0.5);
+  -moz-box-shadow: -8px 14px 20px -5px rgba(77, 77, 77, 0.5);
+  box-shadow: -8px 14px 20px -5px rgba(77, 77, 77, 0.5);
+  border-radius: 4px !important;
+  left: 0 !important;
+  min-width: 155px;
+  padding: 5px;
+  margin-left: 15px;
+}
+
+.dropdown-menu>li>a:focus,
+.dropdown-menu>li>a:hover {
+  background: transparent;
+  text-decoration: underline !important;
+}
+
+@media (min-width: 768px) {
+  .dropdown-menu>li>a {
+    font-weight: 300;
+  }
+}
+
+.highlights-dropdown .dropdown-menu>li>a {
+  font-size: 13px;
+  padding: 1px 10px;
+}
 
 
 /* Show the dropdown menu on hover */
@@ -731,23 +779,6 @@ tech-sub-sec h2 {
   padding: 30px 2px;
 }
 
-.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 14px 20px -5px rgba(77, 77, 77, 0.5);
-  display: none;
-  text-align: center;
-  border-radius: 4px !important;
-  padding: 5px !important;
-}
-
-.dropdown-menu>li>a:focus,
-.dropdown-menu>li>a:hover {
-  background: transparent;
-  text-decoration: underline !important;
-}
-
 .logo-wrap .logo-caption {
   padding-top: 20px;
   display: inline-block;
@@ -758,49 +789,6 @@ tech-sub-sec h2 {
   padding-top: 50px;
 }
 
-.dropdown-menu>li>a {
-  padding: 1px 10px !important;
-}
-
-.dropdown-menu {
-  left: 0 !important;
-  min-width: 155px;
-  text-align: left;
-  margin-left: 15px;
-}
-
-.navbar-default .navbar-nav>.open>a,
-.navbar-default .navbar-nav>.open>a:focus,
-.navbar-default .navbar-nav>.open>a:hover {
-  background: transparent;
-}
-
-.navbar-transparent .navbar-nav>.open>a,
-.navbar-transparent .navbar-nav>.open>a:focus,
-.navbar-transparent .navbar-nav>.open>a:hover {
-  color: #fff;
-}
-
-.dropdown-menu>li>a {
-  font-size: 13px;
-}
-
-@media (min-width: 768px) {
-  .dropdown-menu>li>a {
-    font-weight: 300;
-  }
-}
-
-.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*/
 
@@ -1014,13 +1002,8 @@ tech-sub-sec h2 {
   }
 }
 
-@media screen and (min-device-width: 480px) and (max-device-width: 767px) {
+@media screen and (min-width: 480px) and (max-width: 767px) {
-  .logo-wrap {
+  .logo-wrap, .logo-wrap-1 {
-    width: 50%;
-    padding: 15px 30px !important;
-    min-height: 179px;
-  }
-  .logo-wrap-1 {
     width: 50%;
     padding: 15px 30px !important;
     min-height: 179px;
@@ -1032,16 +1015,13 @@ tech-sub-sec h2 {
     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) {
+@media(max-width:767px) {
   .single-heading h2 {
     font-size: 50px;
   }
@@ -1087,10 +1067,6 @@ tech-sub-sec h2 {
   .navbar-transparent #logoWhite {
     display: none;
   }
-  .navbar-transparent .navbar-nav>li>a {
-    font-size: 14px;
-    color: #777;
-  }
   .navbar-transparent .nav-language .select-language {
     color: #777;
   }
@@ -1144,10 +1120,6 @@ tech-sub-sec h2 {
     font-size: 35px;
     line-height: 35px;
   }
-  .pricing-section .text .section-heading::before {
-    left: 50%;
-    transform: translate(-50%, 0);
-  }
   .contact-section .title {
     width: 300px;
     margin: 0 auto;

datacenterlight/templates/datacenterlight/base_hosting.html

@@ -78,6 +78,8 @@
     <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
     <script src="//cdnjs.cloudflare.com/ajax/libs/1000hz-bootstrap-validator/0.11.9/validator.min.js"></script>
 
+    <!-- Virtual Machine Detail Javascript -->
+    <script src="{% static 'hosting/js/virtual_machine_detail.js' %}"></script>
     <!-- Create Virtual Machine Javascript -->
     <script src="{% static 'hosting/js/createvm.js' %}"></script>
     <!-- Init JavaScript -->

datacenterlight/templates/datacenterlight/includes/_navbar.html

@@ -2,70 +2,69 @@
 {% get_current_language as LANGUAGE_CODE %}
 
 <nav class="navbar navbar-default navbar-fixed-top topnav navbar-transparent">
-    <div class="topnav">
+    <!-- Brand and toggle get grouped for better mobile display -->
-        <!-- Brand and toggle get grouped for better mobile display -->
+    <div class="navbar-header">
-        <div class="navbar-header">
+        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
-            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
+            <span class="sr-only">{% trans "Toggle navigation" %}</span>
-                <span class="sr-only">{% trans "Toggle navigation" %}</span>
+            <span class="icon-bar"></span>
-                <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
-                <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
-                <span class="icon-bar"></span>
+        </button>
-            </button>
+        <a href="{% url 'datacenterlight:index' %}" id="logoBlack" class="navbar-brand topnav"><img src="{% static 'datacenterlight/img/logo_black.svg' %}"></a>
-            <a href="{% url 'datacenterlight:index' %}" id="logoBlack" class="navbar-brand topnav"><img src="{% static 'datacenterlight/img/logo_black.svg' %}"></a>
+        <a href="{% url 'datacenterlight:index' %}" id="logoWhite" class="navbar-brand topnav"><img src="{% static 'datacenterlight/img/logo_white.svg' %}"></a>
-            <a href="{% url 'datacenterlight:index' %}" id="logoWhite" class="navbar-brand topnav"><img src="{% static 'datacenterlight/img/logo_white.svg' %}"></a>
+    </div>
-        </div>
+    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
-        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+        <!-- Start Navbar collapse-->
-            <!-- Start Navbar collapse-->
+        <ul class="nav navbar-nav navbar-right">
-            <ul class="nav navbar-nav navbar-right">
+            <li class="dropdown highlights-dropdown">
-                <li class="dropdown highlights-dropdown">
+                <a class="dropdown-toggle url-init" href="{% url 'datacenterlight:index' %}#how" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{% trans "Highlights" %}&nbsp;<span class="caret"></span></a>
-                    <a class="dropdown-toggle url-init" href="{% url 'datacenterlight:index' %}#how" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{% trans "Highlights" %}&nbsp;<span class="caret"></span></a>
+                <ul class="dropdown-menu ">
-                    <ul class="dropdown-menu ">
+                    <li><a class="url-init" href="{% url 'datacenterlight:index' %}#your">{% trans "Scale out" %}</a></li>
-                        <li><a class="url-init" href="{% url 'datacenterlight:index' %}#your">{% trans "Scale out" %}</a></li>
+                    <li><a class="url-init" href="{% url 'datacenterlight:index' %}#our">{% trans "Reliable and light" %}</a></li>
-                        <li><a class="url-init" href="{% url 'datacenterlight:index' %}#our">{% trans "Reliable and light" %}</a></li>
+                    <li> <a class="url-init" href="{% url 'datacenterlight:index' %}#price">{% trans "Order VM" %}</a></li>
-                        <li> <a class="url-init" href="{% url 'datacenterlight:index' %}#price">{% trans "Order VM" %}</a></li>
+                </ul>
-                    </ul>
+            </li>
-                </li>
+            <li>
+                <a href="{% url 'datacenterlight:whydatacenterlight' %}">{% trans "Why Data Center Light?" %}</a>
+            </li>
+            <li>
+                <a class="url-init" href="{% url 'datacenterlight:index' %}#contact">{% trans "Contact" %}</a>
+            </li>
+            <li>
+                {% if LANGUAGE_CODE == 'en-us'%}
+                <a class="on-hover-border" href="{% change_lang 'de' %}">Deutsch&nbsp;&nbsp;<i class="fa fa-globe" aria-hidden="true"></i></a> {% else %}
+                <a class="on-hover-border" href="{% change_lang 'en-us' %}">English&nbsp;&nbsp;<i class="fa fa-globe" aria-hidden="true"></i></a> {% endif %}
+            </li>
+            {% if not request.user.is_authenticated %}
                 <li>
-                    <a href="{% url 'datacenterlight:whydatacenterlight' %}">{% trans "Why Data Center Light?" %}</a>
+                    <a href="{% url 'hosting:login' %}">{% trans "Login" %}&nbsp;&nbsp;<span class="fa fa-sign-in"></span></a>
                 </li>
+            {% else %}
                 <li>
-                    <a class="url-init" href="{% url 'datacenterlight:index' %}#contact">{% trans "Contact" %}</a>
+                    <a href="{% url 'hosting:dashboard' %}">{% trans "Dashboard" %}</a>
                 </li>
-                <li>
+            {% endif %}
-                    {% if LANGUAGE_CODE == 'en-us'%}
+            {% comment %}
-                    <a class="on-hover-border" href="{% change_lang 'de' %}">Deutsch&nbsp;&nbsp;<i class="fa fa-globe" aria-hidden="true"></i></a> {% else %}
+            <!-- to be used when more than one option for language -->
-                    <a class="on-hover-border" href="{% change_lang 'en-us' %}">English&nbsp;&nbsp;<i class="fa fa-globe" aria-hidden="true"></i></a> {% endif %}
+            <li class="nav-language">
-                </li>
+                <div class="dropdown">
-                {% if not request.user.is_authenticated %}
+                    <div class="dropdown-toggle select-language" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
-                    <li>
+                        {% if LANGUAGE_CODE == 'en-us'%}
-                        <a href="{% url 'hosting:login' %}">{% trans "Login" %}&nbsp;&nbsp;<span class="fa fa-sign-in"></span></a>
+                        <span>English</span> {% else %}
-                    </li>
+                        <span>Deutsch</span> {% endif %}
-                {% else %}
+                        <i class="fa fa-globe" aria-hidden="true"></i>
-                    <li>
-                        <a href="{% url 'hosting:dashboard' %}">{% trans "Dashboard" %}</a>
-                    </li>
-                {% endif %}
-                {% comment %}
-                <!-- to be used when more than one option for language -->
-                <li class="nav-language">
-                    <div class="dropdown">
-                        <div class="dropdown-toggle select-language" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
-                            {% if LANGUAGE_CODE == 'en-us'%}
-                            <span>English</span> {% else %}
-                            <span>Deutsch</span> {% endif %}
-                            <i class="fa fa-globe" aria-hidden="true"></i>
-                        </div>
-                        <ul class="dropdown-menu drop-language dropdown-menu-right">
-                            {% if LANGUAGE_CODE == 'en-us'%}
-                            <li><a class="url" href="{% change_lang 'de' %}">Deutsch</a></li>
-                            {% else %}
-                            <li><a class="url" href="{% change_lang 'en-us' %}">English</a></li>
-                            {% endif %}
-                        </ul>
                     </div>
-                </li>
+                    <ul class="dropdown-menu drop-language dropdown-menu-right">
-                {% endcomment %}
+                        {% if LANGUAGE_CODE == 'en-us'%}
-            </ul>
+                        <li><a class="url" href="{% change_lang 'de' %}">Deutsch</a></li>
-            <!-- /.navbar-collapse -->
+                        {% else %}
-        </div>
+                        <li><a class="url" href="{% change_lang 'en-us' %}">English</a></li>
+                        {% endif %}
+                    </ul>
+                </div>
+            </li>
+            {% endcomment %}
+        </ul>
+        <!-- /.navbar-collapse -->
+    </div>
 </nav>

utils/management/commands/optimize_frontend.py

@@ -74,7 +74,6 @@ class Command(BaseCommand):
                     print(file, selector[0], count[selector[0]])
                 else:
                     count[selector[0]] = 1
-            # print(count)
 
     def get_files(self, app_name):
         # the view file for the app
@@ -145,9 +144,8 @@ class Command(BaseCommand):
         )
         with open(output_file, 'w', newline='') as f:
             w = csv.writer(f)
-            # print(zip_longest(*results))
+            print(zip_longest(*results))
             for r in zip_longest(*results):
-                # print(r)
                 w.writerow(r)