removed the language dropdown, replaced with link to the only other language

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

@@ -126,6 +126,15 @@ h6 {
     color: #fff;
     background-color: transparent;
 }
+
+.navbar-transparent .navbar-nav>li>.on-hover-border {
+	transition: all 0.3s linear;
+	box-shadow: none;
+}
+.navbar-transparent .navbar-nav>li>.on-hover-border:hover {
+	box-shadow: 0 0 0 1px #eee;
+	border-radius: 5px;
+}
 .navbar-default .btn-link {
     box-shadow: none;
 }

datacenterlight/templates/datacenterlight/includes/_navbar.html

@@ -1,8 +1,6 @@
-{% load staticfiles i18n%}
+{% load staticfiles i18n%} {% get_current_language as LANGUAGE_CODE %} {% load custom_tags %}
-{% get_current_language as LANGUAGE_CODE %}
-{% load custom_tags %}
 <nav class="navbar navbar-default navbar-fixed-top topnav">
-<div class="topnav">
+  <div class="topnav">
     <!-- Brand and toggle get grouped for better mobile display -->
     <div class="navbar-header">
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
@@ -13,32 +11,41 @@
       </button>
       {% if request.resolver_match.url_name == "index" or request.resolver_match.url_name == "whydatacenterlight" %}
         <a href="{% url 'datacenterlight:index' %}" id="logoBlack" class="navbar-brand topnav url" data-url="#home"><img src="{% static 'datacenterlight/img/logo_black.svg' %}"></a>
-                  <a href="{% url 'datacenterlight:index' %}" id="logoWhite" class="navbar-brand topnav url" data-url="#home"><img src="{% static 'datacenterlight/img/logo_white.svg' %}"></a>
+        <a href="{% url 'datacenterlight:index' %}" id="logoWhite" class="navbar-brand topnav url" data-url="#home"><img src="{% static 'datacenterlight/img/logo_white.svg' %}"></a> {% else %}
-                {% else %}
         <a href="{% url 'datacenterlight:index' %}" id="logoBlack" class="navbar-brand topnav url"><img src="{% static 'datacenterlight/img/logo_black.svg' %}"></a>
         <a href="{% url 'datacenterlight:index' %}" id="logoWhite" class="navbar-brand topnav url"><img src="{% static 'datacenterlight/img/logo_white.svg' %}"></a>
       {% endif %}
-
     </div>
-  <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><!-- Start Navbar collapse-->
+    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+      <!-- Start Navbar collapse-->
       <ul class="nav navbar-nav navbar-right">
         {% if request.resolver_match.url_name == "index" or request.resolver_match.url_name == "whydatacenterlight" %}
           <li class="dropdown">
             <a class="dropdown-toggle  visible-mobile" href="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{% trans "Highlights" %}<span class="caret"></span></a>
             <a class="dropdown-toggle url disabled visible-desktop" href="{% url 'datacenterlight:index' %}#how" data-url="#how" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{% trans "Highlights" %}<span class="caret"></span></a>
             <ul class="dropdown-menu">
-				<li><a class="url" href="{% url 'datacenterlight:index' %}#your" data-url="#your"  >{% trans "Scale out" %}</a></li>
+              <li><a class="url" href="{% url 'datacenterlight:index' %}#your" data-url="#your">{% trans "Scale out" %}</a></li>
               <li><a class="url" href="{% url 'datacenterlight:index' %}#our" data-url="#our">{% trans "Reliable and light" %}</a></li>
-				<li> <a class="url" href="{% url 'datacenterlight:index' %}#price" data-url="#price" >{% trans "Order VM" %}</a></li>
+              <li><a class="url" href="{% url 'datacenterlight:index' %}#price" data-url="#price">{% trans "Order VM" %}</a></li>
             </ul>
           </li>
           <li>
-				<a class="url" href="{% url 'datacenterlight:index' %}/whydatacenterlight" >{% trans "Why Data Center Light?" %}</a>
+            <a class="url" href="{% url 'datacenterlight:index' %}/whydatacenterlight">{% trans "Why Data Center Light?" %}</a>
           </li>
           <li>
-				<a class="url" href="{% url 'datacenterlight:index' %}#contact" data-url="#contact"  >{% trans "Contact" %}</a>
+            <a class="url" href="{% url 'datacenterlight:index' %}#contact" data-url="#contact">{% trans "Contact" %}</a>
           </li>
         {% endif %}
+
+        <li>
+          {% if LANGUAGE_CODE == 'en-us'%}
+            <a class="url on-hover-border" href="{% change_lang 'de' %}">Deutsch&nbsp;&nbsp;<i class="fa fa-globe" aria-hidden="true"></i></a>
+          {% else %}
+            <a class="url on-hover-border" href="{% change_lang 'en-us' %}">English&nbsp;&nbsp;<i class="fa fa-globe" aria-hidden="true"></i></a>
+          {% endif %}
+        </li>
+        {% 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">
@@ -53,13 +60,14 @@
               {% 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>
+                <li><a class="url" href="{% change_lang 'en-us' %}">English</a></li>
               {% endif %}
             </ul>
           </div>
         </li>
+        {% endcomment %}
       </ul>
-  </div><!-- /.navbar-collapse -->
     </div>
+    <!-- /.navbar-collapse -->
   </div>
 </nav>