Merge pull request #482 from tiwariav/task/3759/hosting_navbar
Task/3759 hosting navbar redesign
This commit is contained in:
commit
71e6fac997
8 changed files with 135 additions and 107 deletions
|
@ -122,7 +122,7 @@ button, input, optgroup, select, textarea {
|
||||||
|
|
||||||
.navbar-default {
|
.navbar-default {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
border: none;
|
/* border: none; */
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -143,15 +143,19 @@ button, input, optgroup, select, textarea {
|
||||||
|
|
||||||
.navbar-default .navbar-nav>li>a {
|
.navbar-default .navbar-nav>li>a {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
/*font-family: 'Lato-Light', sans-serif;*/
|
font-weight: 400;
|
||||||
font-weight: 300;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-transparent .navbar-nav>li>a {
|
.navbar-transparent .navbar-nav>li>a {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
/*font-family: 'Lato-Light', sans-serif;*/
|
}
|
||||||
font-weight: 300;
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.navbar-default .navbar-nav>li>a,
|
||||||
|
.navbar-transparent .navbar-nav>li>a {
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-transparent .navbar-nav>li>a:hover {
|
.navbar-transparent .navbar-nav>li>a:hover {
|
||||||
|
@ -924,7 +928,7 @@ tech-sub-sec h2 {
|
||||||
border: 1px solid #fff;
|
border: 1px solid #fff;
|
||||||
-webkit-box-shadow: -8px 13px 31px -8px rgba(77, 77, 77, 1);
|
-webkit-box-shadow: -8px 13px 31px -8px rgba(77, 77, 77, 1);
|
||||||
-moz-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);
|
box-shadow: -8px 14px 20px -5px rgba(77, 77, 77, 0.5);
|
||||||
display: none;
|
display: none;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: 4px !important;
|
border-radius: 4px !important;
|
||||||
|
@ -976,8 +980,12 @@ tech-sub-sec h2 {
|
||||||
|
|
||||||
.dropdown-menu>li>a {
|
.dropdown-menu>li>a {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
font-weight: 300;
|
}
|
||||||
/*font-family: 'Lato-Light', sans-serif;*/
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.dropdown-menu>li>a {
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-default .navbar-nav>.active>a,
|
.navbar-default .navbar-nav>.active>a,
|
||||||
|
|
|
@ -1,10 +1,12 @@
|
||||||
{% load staticfiles i18n%} {% load custom_tags %} {% get_current_language as LANGUAGE_CODE %}
|
{% load staticfiles i18n%}
|
||||||
|
{% load custom_tags %}
|
||||||
|
{% get_current_language as LANGUAGE_CODE %}
|
||||||
<nav class="navbar navbar-default navbar-fixed-top topnav">
|
<nav class="navbar navbar-default navbar-fixed-top topnav">
|
||||||
<div class="topnav">
|
<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">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>
|
||||||
|
|
|
@ -12,42 +12,54 @@ from django.views.generic import RedirectView
|
||||||
from django.core.urlresolvers import reverse_lazy
|
from django.core.urlresolvers import reverse_lazy
|
||||||
import debug_toolbar
|
import debug_toolbar
|
||||||
|
|
||||||
urlpatterns = [url(r'^index.html$', LandingView.as_view()),
|
urlpatterns = [
|
||||||
url(r'^hosting/', include('hosting.urls', namespace="hosting")),
|
url(r'^index.html$', LandingView.as_view()),
|
||||||
url(r'^open_api/', include('opennebula_api.urls',
|
url(r'^open_api/', include('opennebula_api.urls',
|
||||||
namespace='opennebula_api')),
|
namespace='opennebula_api')),
|
||||||
url(r'^railshosting/', RailsHostingView.as_view(), name="rails.hosting"),
|
url(r'^railshosting/', RailsHostingView.as_view(),
|
||||||
url(r'^nodehosting/', NodeJSHostingView.as_view(), name="node.hosting"),
|
name="rails.hosting"),
|
||||||
url(r'^djangohosting/', DjangoHostingView.as_view(), name="django.hosting"),
|
url(r'^nodehosting/', NodeJSHostingView.as_view(),
|
||||||
url(r'^nosystemd/', include('nosystemd.urls', namespace="nosystemd")),
|
name="node.hosting"),
|
||||||
url(r'^taggit_autosuggest/', include('taggit_autosuggest.urls')),
|
url(r'^djangohosting/', DjangoHostingView.as_view(),
|
||||||
url(r'^jsi18n/(?P<packages>\S+?)/$',
|
name="django.hosting"),
|
||||||
i18n.javascript_catalog),
|
url(r'^nosystemd/', include('nosystemd.urls', namespace="nosystemd")),
|
||||||
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
|
url(r'^taggit_autosuggest/', include('taggit_autosuggest.urls')),
|
||||||
|
url(r'^jsi18n/(?P<packages>\S+?)/$',
|
||||||
|
i18n.javascript_catalog),
|
||||||
|
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
|
||||||
|
|
||||||
|
urlpatterns += i18n_patterns(
|
||||||
|
url(r'^hosting/', include('hosting.urls', namespace="hosting")),
|
||||||
|
)
|
||||||
|
|
||||||
# note the django CMS URLs included via i18n_patterns
|
# note the django CMS URLs included via i18n_patterns
|
||||||
urlpatterns += i18n_patterns(
|
urlpatterns += i18n_patterns(
|
||||||
url(r'^$', LandingView.as_view()),
|
url(r'^$', LandingView.as_view()),
|
||||||
url(r'^admin/', include(admin.site.urls)),
|
url(r'^admin/', include(admin.site.urls)),
|
||||||
url(r'^datacenterlight/', include('datacenterlight.urls', namespace="datacenterlight")),
|
url(r'^datacenterlight/',
|
||||||
url(r'^hosting/', RedirectView.as_view(
|
include('datacenterlight.urls', namespace="datacenterlight")),
|
||||||
url=reverse_lazy('hosting:login')), name='redirect_hosting_login'),
|
url(r'^hosting/', RedirectView.as_view(
|
||||||
url(r'^alplora/', include('alplora.urls', namespace="alplora")),
|
url=reverse_lazy('hosting:login')), name='redirect_hosting_login'),
|
||||||
url(r'^membership/', include(membership_urls)),
|
url(r'^alplora/', include('alplora.urls', namespace="alplora")),
|
||||||
url(r'^digitalglarus/', include('digitalglarus.urls',
|
url(r'^membership/', include(membership_urls)),
|
||||||
namespace="digitalglarus")),
|
url(r'^digitalglarus/', include('digitalglarus.urls',
|
||||||
# url(r'^blog/', include('ungleich.urls', namespace='ungleich')),
|
namespace="digitalglarus")),
|
||||||
url(r'^',
|
# url(r'^blog/', include('ungleich.urls', namespace='ungleich')),
|
||||||
include('ungleich_page.urls', namespace='ungleich_page'),
|
url(r'^',
|
||||||
name='ungleich_page'),
|
include('ungleich_page.urls',
|
||||||
url(r'^blog/', include('ungleich.urls', namespace='ungleich')),
|
namespace='ungleich_page'),
|
||||||
url(r'^', include('cms.urls'))
|
name='ungleich_page'),
|
||||||
)
|
url(r'^blog/', include('ungleich.urls',
|
||||||
|
namespace='ungleich')),
|
||||||
|
url(r'^', include('cms.urls'))
|
||||||
|
)
|
||||||
|
|
||||||
urlpatterns += [
|
urlpatterns += [
|
||||||
url(r'^media/(?P<path>.*)$',
|
url(r'^media/(?P<path>.*)$',
|
||||||
static_view.serve, {
|
static_view.serve, {
|
||||||
'document_root': settings.MEDIA_ROOT,
|
'document_root': settings.MEDIA_ROOT,
|
||||||
}),
|
}),
|
||||||
]
|
]
|
||||||
|
|
||||||
if settings.DEBUG:
|
if settings.DEBUG:
|
||||||
urlpatterns += [url(r'^__debug__/', include(debug_toolbar.urls))]
|
urlpatterns += [url(r'^__debug__/', include(debug_toolbar.urls))]
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.dashboard-container {
|
.dashboard-container {
|
||||||
padding-top:70px;
|
padding-top: 80px;
|
||||||
padding-bottom: 70px;
|
padding-bottom: 70px;
|
||||||
width: 90%;
|
width: 90%;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
|
|
@ -34,7 +34,8 @@ h6 {
|
||||||
|
|
||||||
.navbar-default {
|
.navbar-default {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
box-shadow: 0 3px 3px -2px hsla(0,0%,78%,.72);
|
/* box-shadow: 0 3px 3px -2px hsla(0,0%,78%,.72); */
|
||||||
|
padding: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-default .navbar-header {
|
.navbar-default .navbar-header {
|
||||||
|
@ -78,13 +79,20 @@ h6 {
|
||||||
left: 0 !important;
|
left: 0 !important;
|
||||||
min-width: 155px;
|
min-width: 155px;
|
||||||
margin-left: 15px;
|
margin-left: 15px;
|
||||||
padding: 5px !important;
|
padding: 0 5px 8px !important;
|
||||||
}
|
}
|
||||||
@media(min-width: 768px) {
|
@media(min-width: 768px) {
|
||||||
.navbar-right .highlights-dropdown .dropdown-menu {
|
.navbar-default .navbar-nav>li>a,
|
||||||
border: 1px solid #fff;
|
.navbar-right .highlights-dropdown .dropdown-menu > li > a {
|
||||||
|
font-weight: 300;
|
||||||
}
|
}
|
||||||
.navbar-right .highlights-dropdown .dropdown-menu:before {
|
.navbar-right .highlights-dropdown .dropdown-menu {
|
||||||
|
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.02);
|
||||||
|
border-width: 0 0 1px 0;
|
||||||
|
border-color: #e7e7e7;
|
||||||
|
box-shadow: -8px 14px 20px -5px rgba(77, 77, 77, 0.5);
|
||||||
|
}
|
||||||
|
/* .navbar-right .highlights-dropdown .dropdown-menu:before {
|
||||||
content: '';
|
content: '';
|
||||||
display: block;
|
display: block;
|
||||||
height: 1px;
|
height: 1px;
|
||||||
|
@ -93,13 +101,12 @@ h6 {
|
||||||
top: -1px;
|
top: -1px;
|
||||||
left: -1px;
|
left: -1px;
|
||||||
right: -1px;
|
right: -1px;
|
||||||
}
|
} */
|
||||||
}
|
}
|
||||||
.navbar-right .highlights-dropdown .dropdown-menu > li > a{
|
.navbar-right .highlights-dropdown .dropdown-menu > li > a{
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
font-weight: 300;
|
|
||||||
font-family: 'Lato', sans-serif;
|
font-family: 'Lato', sans-serif;
|
||||||
padding: 1px 10px !important;
|
padding: 1px 10px 1px 18px !important;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
color: #333;
|
color: #333;
|
||||||
}
|
}
|
||||||
|
|
|
@ -53,61 +53,7 @@
|
||||||
|
|
||||||
|
|
||||||
{% block navbar %}
|
{% block navbar %}
|
||||||
|
{% include "hosting/includes/_navbar_user.html" %}
|
||||||
<!-- Navigation -->
|
|
||||||
|
|
||||||
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
|
|
||||||
<div class="container topnav">
|
|
||||||
<!-- Brand and toggle get grouped for better mobile display -->
|
|
||||||
<div class="navbar-header">
|
|
||||||
{% if request.user.is_authenticated %}
|
|
||||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
|
|
||||||
<span class="sr-only">Toggle navigation</span>
|
|
||||||
<span class="icon-bar"></span>
|
|
||||||
<span class="icon-bar"></span>
|
|
||||||
<span class="icon-bar"></span>
|
|
||||||
</button>
|
|
||||||
{% endif %}
|
|
||||||
<a class="navbar-brand topnav" href="{% url 'datacenterlight:index' %}"><img src="{% static 'datacenterlight/img/logo_black.svg' %}"></a>
|
|
||||||
</div>
|
|
||||||
{% if request.user.is_authenticated %}
|
|
||||||
<!-- Collect the nav links, forms, and other content for toggling -->
|
|
||||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
|
||||||
<ul class="nav navbar-nav navbar-right">
|
|
||||||
<li>
|
|
||||||
<a href="{% url 'hosting:virtual_machines' %}">
|
|
||||||
<i class="fa fa-server" aria-hidden="true"></i> {% trans "My Virtual Machines"%}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="{% url 'hosting:orders' %}">
|
|
||||||
<i class="fa fa-credit-card"></i> {% trans "My Orders"%}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="dropdown">
|
|
||||||
<a class="dropdown-toggle" role="button" data-toggle="dropdown" href="#">
|
|
||||||
<i class="glyphicon glyphicon-user"></i> {{request.user.name}} <span class="caret"></span></a>
|
|
||||||
<ul id="g-account-menu" class="dropdown-menu" role="menu">
|
|
||||||
<li>
|
|
||||||
<a href="{% url 'hosting:ssh_keys' %}">
|
|
||||||
<i class="fa fa-key"></i> {% trans "SSH Keys" %}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="{% url 'hosting:notifications' %}">
|
|
||||||
<i class="fa fa-bell"></i> {% trans "Notifications "%}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li><a href="{% url 'hosting:logout' %}"><i class="glyphicon glyphicon-lock"></i>{% trans "Logout"%} </a></li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
<!-- /.navbar-collapse -->
|
|
||||||
</div>
|
|
||||||
<!-- /.container -->
|
|
||||||
</nav>
|
|
||||||
{% endblock navbar %}
|
{% endblock navbar %}
|
||||||
|
|
||||||
|
|
||||||
|
|
52
hosting/templates/hosting/includes/_navbar_user.html
Normal file
52
hosting/templates/hosting/includes/_navbar_user.html
Normal file
|
@ -0,0 +1,52 @@
|
||||||
|
{% load staticfiles %}
|
||||||
|
{% load i18n %}
|
||||||
|
{% load custom_tags %}
|
||||||
|
|
||||||
|
<!-- Navigation -->
|
||||||
|
|
||||||
|
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
|
||||||
|
<div class="topnav">
|
||||||
|
<!-- Brand and toggle get grouped for better mobile display -->
|
||||||
|
<div class="navbar-header">
|
||||||
|
{% if request.user.is_authenticated %}
|
||||||
|
<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="icon-bar"></span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
</button>
|
||||||
|
{% endif %}
|
||||||
|
<a class="navbar-brand topnav" href="{% if site_url %}{{site_url}}{% else %}{{ request.session.hosting_url}}{% endif %}"><img src="{% static 'datacenterlight/img/logo_black.svg' %}"></a>
|
||||||
|
</div>
|
||||||
|
{% if request.user.is_authenticated %}
|
||||||
|
<!-- Collect the nav links, forms, and other content for toggling -->
|
||||||
|
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||||||
|
<ul class="nav navbar-nav navbar-right">
|
||||||
|
<li>
|
||||||
|
<a href="{% url 'hosting:dashboard' %}">
|
||||||
|
<i class="fa fa-fw fa-server" aria-hidden="true"></i> {% trans "Dashboard"%}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="dropdown highlights-dropdown">
|
||||||
|
<a class="dropdown-toggle" role="button" data-toggle="dropdown" href="#">
|
||||||
|
<i class="fa fa-fw fa-user"></i> {{request.user.name}} <span class="fa fa-fw fa-caret-down"></span>
|
||||||
|
</a>
|
||||||
|
<ul id="g-account-menu" class="dropdown-menu" role="menu">
|
||||||
|
<li><a href="{% url 'hosting:logout' %}">{% trans "Logout"%}</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
{% get_current_language as LANGUAGE_CODE %}
|
||||||
|
{% if LANGUAGE_CODE == 'en-us'%}
|
||||||
|
<a href="{% change_lang 'de' %}"><i class="fa fa-fw fa-globe" aria-hidden="true"></i> Deutsch</a>
|
||||||
|
{% else %}
|
||||||
|
<a href="{% change_lang 'en-us' %}"><i class="fa fa-fw fa-globe" aria-hidden="true"></i> English</a>
|
||||||
|
{% endif %}
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
<!-- /.navbar-collapse -->
|
||||||
|
</div>
|
||||||
|
<!-- /.container -->
|
||||||
|
</nav>
|
|
@ -11,6 +11,7 @@ from .views import (
|
||||||
SSHKeyChoiceView, DashboardView, SettingsView)
|
SSHKeyChoiceView, DashboardView, SettingsView)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
urlpatterns = [
|
urlpatterns = [
|
||||||
url(r'index/?$', IndexView.as_view(), name='index'),
|
url(r'index/?$', IndexView.as_view(), name='index'),
|
||||||
url(r'django/?$', DjangoHostingView.as_view(), name='djangohosting'),
|
url(r'django/?$', DjangoHostingView.as_view(), name='djangohosting'),
|
||||||
|
|
Loading…
Reference in a new issue