amal/dynamicweb
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

login pages restyled and footer included

Browse source
This commit is contained in:
Arvind Tiwari 2017-10-07 14:38:48 +05:30
parent 05b7b43064
commit 769396d95e
12 changed files with 259 additions and 239 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
datacenterlight/static/datacenterlight/css/landing-page.css
View file

@ -182,7 +182,11 @@ button, input, optgroup, select, textarea {
.navbar-brand { .navbar-brand {
padding: 10px 15px; padding: 10px 15px;
cursor: pointer; }
@media (max-width: 767px) {
.navbar-brand {
padding: 10px 10px;
}
} }
.navbar-right { .navbar-right {
@ -1543,7 +1547,7 @@ tech-sub-sec h2 {
} }
footer { footer {
padding: 50px 0; padding: 50px 20px;
background-color: #f8f8f8; background-color: #f8f8f8;
} }

3
datacenterlight/templates/datacenterlight/includes/_footer.html
View file

@ -1,7 +1,8 @@
{% load staticfiles i18n%} {% load staticfiles i18n%}
{% get_current_language as LANGUAGE_CODE %} {% get_current_language as LANGUAGE_CODE %}
<footer> <footer>
<div class="container"> <div>
<ul class="list-inline"> <ul class="list-inline">
{% if request.resolver_match.url_name != "index" %} {% if request.resolver_match.url_name != "index" %}
<li> <li>

10
hosting/static/hosting/css/commons.css
View file

@ -18,7 +18,7 @@
} }
.content-dashboard{ .content-dashboard{
min-height: calc(100vh - 70px); min-height: calc(100vh - 60px);
width: 80%; width: 80%;
margin: 0 auto; margin: 0 auto;
max-width: 1120px; max-width: 1120px;
@ -66,7 +66,9 @@
width: 280px; width: 280px;
} }
.content-dashboard { .content-dashboard {
width: 90%; padding-left: 15px;
padding-right: 15px;
width: 100%;
} }
} }
.btn:focus, .btn:active:focus { .btn:focus, .btn:active:focus {
@ -296,10 +298,6 @@
max-width: 360px; max-width: 360px;
} }
.btn-wide {
min-width: 100px;
}
.caps-link { .caps-link {
font-weight: 600; font-weight: 600;
color: #8da4c0; color: #8da4c0;

121
hosting/static/hosting/css/landing-page.css
View file

@ -22,6 +22,10 @@ h6 {
/*font-weight: 300;*/ /*font-weight: 300;*/
} }
.allcaps {
text-transform: uppercase;
}
.topnav { .topnav {
font-size: 14px; font-size: 14px;
} }
@ -31,6 +35,11 @@ h6 {
.navbar-brand { .navbar-brand {
padding: 10px 15px; padding: 10px 15px;
} }
@media (max-width: 767px) {
.navbar-brand {
padding: 10px 0;
}
}
.navbar-default { .navbar-default {
background: #fff; background: #fff;
@ -274,16 +283,15 @@ h6 {
/*------Auth section---------*/ /*------Auth section---------*/
.auth-container { .auth-container {
min-height: calc(100vh - 120px); min-height: calc(100vh - 180px);
position: relative; position: relative;
/* flex-grow: 1; */
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
} }
.auth-bg { .auth-bg {
background: url(../img/auth-bg-sm.jpg); background: url(../img/pattern.jpg) no-repeat center center;
position: fixed; position: fixed;
left: 0; left: 0;
top: 0; top: 0;
@ -293,7 +301,6 @@ h6 {
background-position: center center; background-position: center center;
background-size: cover; background-size: cover;
background-attachment: fixed; background-attachment: fixed;
} }
.auth-bg::before { .auth-bg::before {
@ -303,7 +310,7 @@ h6 {
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
background: rgba(75, 75, 101, 0.55); background: rgba(90, 116, 175, 0.7);
z-index: 1; z-index: 1;
} }
@ -313,8 +320,12 @@ h6 {
.auth-container .auth-content { .auth-container .auth-content {
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto 15px;
max-width: 390px; max-width: 360px;
}
.auth-container .auth-content.wide {
max-width: 420px;
} }
.auth-container .auth-center { .auth-container .auth-center {
@ -351,31 +362,30 @@ h6 {
} }
.auth-box { .auth-box {
position: relative;
background: #fff; background: #fff;
padding: 0; padding: 40px 20px 20px;
padding-bottom: 30px;
box-sizing: border-box; box-sizing: border-box;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.09), 0 5px 5px rgba(0, 0, 0, 0.23);
border-radius: 4px; /* border-radius: 4px; */
z-index: 10; z-index: 10;
} }
.auth-box .section-heading { .auth-box .section-heading {
color: #5a5a5a; color: #5a5a5a;
padding-top: 30px; font-weight: 300;
padding-bottom: 5px;
text-align: center; text-align: center;
text-transform: uppercase; letter-spacing: 1px;
letter-spacing: 3px; font-size: 36px;
font-size: 20px;
border-radius: 3px 3px 0px 0px; border-radius: 3px 3px 0px 0px;
margin: 0 auto; margin: 0 auto 10px;
} }
.auth-box .form { .auth-box .form {
padding: 20px; padding: 20px;
width: 80%; /* width: 90%; */
margin: 0 auto; margin: 0 auto;
max-width: 320px;
} }
.auth-box .form .red { .auth-box .form .red {
@ -383,27 +393,58 @@ h6 {
} }
.auth-box .form .btn { .auth-box .form .btn {
box-shadow: 0 0px 9px rgba(0, 0, 0, 0.19), 0 3px 5px rgba(0, 0, 0, 0.23); letter-spacing: 2px;
letter-spacing: 3px; font-size: 16px;
font-size: 17px; padding: 6px 12px;
min-width: 140px;
margin-top: 15px;
text-transform: uppercase; text-transform: uppercase;
font-weight: 600;
} }
.auth-box .form .form-control { .auth-box .form .form-control {
height: 44px; height: 48px;
font-size: 16px; font-size: 14px;
padding: 10px 17px;
line-height: 30px;
border-color: #aaa;
font-weight: bold;
}
.auth-box .form .form-control:focus,
.auth-box .form .form-control:active {
box-shadow: none;
border-radius: 0;
}
.auth-box .form-control::-webkit-input-placeholder {
color: #aaa;
}
.auth-box .form-control:-moz-placeholder{
/* Firefox 18- */
color: #aaa;
}
.auth-box .form-control::-moz-placeholder{
/* Firefox 19+ */
color: #aaa;
}
.auth-box .form-control:-ms-input-placeholder {
color: #aaa;
} }
.auth-box .auth-footer { .auth-box .auth-footer {
text-align: center; text-align: center;
padding: 10px; padding: 5px;
} }
.auth-box .auth-footer .text { .auth-box .auth-footer {
color: #777; color: #777;
} }
.auth-box .auth-footer .links a { .auth-box .auth-footer a {
color: #1e94cc; color: #1e94cc;
} }
@ -411,20 +452,11 @@ h6 {
color: #1e94cc; color: #1e94cc;
} }
.auth-box.sign-up {
padding-bottom: 5px;
}
.auth-box.sign-up .form {
padding: 15px 20px 0 20px;
}
.sign-up-message { .sign-up-message {
padding: 25px 30px 25px 30px; padding: 25px 30px 25px 30px;
text-align: center; text-align: center;
font-size: 18px; font-size: 18px;
line-height: 30px; line-height: 30px;
/*font-family: 'Lato' !important;*/
font-weight: 300 !important; font-weight: 300 !important;
} }
@ -466,8 +498,8 @@ h6 {
} }
.auth-box .form .form-control { .auth-box .form .form-control {
height: 44px; /* height: 44px; */
font-size: 13px; /* font-size: 13px; */
} }
.auth-container .auth-title { .auth-container .auth-title {
@ -802,10 +834,23 @@ a.unlink:hover {
} }
} }
.footer-light {
position: relative;
}
.footer-light footer {
background: transparent;
color: #eee;
}
.footer-light a,
.footer-light .text-muted {
color: #ccc;
}
.footer-light a:hover, .footer-light a:focus, .footer-light a:active { .footer-light a:hover, .footer-light a:focus, .footer-light a:active {
color: #ddd; color: #ddd;
} }
.footer-vm p.copyright {
margin-top: 4px;
}
.visible-mobile { .visible-mobile {
display: none !important; display: none !important;

BIN
hosting/static/hosting/img/pattern.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 181 KiB

23
hosting/templates/hosting/confirm_reset_password.html
View file

@ -1,6 +1,5 @@
{% extends "hosting/base_short.html" %} {% extends "hosting/base_short.html" %}
{% load staticfiles bootstrap3%} {% load staticfiles bootstrap3 i18n %}
{% load i18n %}
{% block navbar %} {% block navbar %}
{% include 'hosting/includes/_navbar_transparent.html' %} {% include 'hosting/includes/_navbar_transparent.html' %}
@ -10,12 +9,9 @@
<div class="auth-container"> <div class="auth-container">
<div class="auth-bg"></div> <div class="auth-bg"></div>
<div class="auth-center"> <div class="auth-center">
<div class="auth-title">
<h2>{% trans "Your VM hosted in Switzerland"%}</h2>
</div>
<div class="auth-content"> <div class="auth-content">
<div class="intro-message auth-box sign-up"> <div class="auth-box sign-up">
<h2 class="section-heading">{% trans "Set your new password"%}</h2> <h1 class="section-heading">{% trans "Set your new password" %}</h1>
{% if messages %} {% if messages %}
<ul class="list-unstyled msg-list"> <ul class="list-unstyled msg-list">
{% for message in messages %} {% for message in messages %}
@ -28,23 +24,18 @@
{% for field in form %} {% for field in form %}
{% bootstrap_field field show_label=False %} {% bootstrap_field field show_label=False %}
{% endfor %} {% endfor %}
{% buttons %} <div class="text-center">
<button type="submit" class="btn btn-block btn-success"> <button type="submit" class="btn choice-btn">
{% trans "Reset" %} {% trans "Reset" %}
</button> </button>
{% endbuttons %} </div>
</form> </form>
<div class="auth-footer"> <div class="auth-footer">
<div class="text"> <span>{% trans "Already have an account ?" %}</span>&nbsp;
<span>{% trans "Already have an account ?"%}</span>
</div>
<div class="links">
<a class="unlink" href="{% url 'hosting:login' %}">{% trans "Login" %}</a> <a class="unlink" href="{% url 'hosting:login' %}">{% trans "Login" %}</a>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>
{% endblock %} {% endblock %}

30
hosting/templates/hosting/login.html
View file

@ -1,6 +1,5 @@
{% extends "hosting/base_short.html" %} {% extends "hosting/base_short.html" %}
{% load i18n %} {% load i18n staticfiles bootstrap3%}
{% load staticfiles bootstrap3%}
{% block navbar %} {% block navbar %}
{% include 'hosting/includes/_navbar_transparent.html' %} {% include 'hosting/includes/_navbar_transparent.html' %}
@ -10,12 +9,9 @@
<div class="auth-container"> <div class="auth-container">
<div class="auth-bg"></div> <div class="auth-bg"></div>
<div class="auth-center"> <div class="auth-center">
<div class="auth-title">
<h2>{% trans "Your VM hosted in Switzerland"%}</h2>
</div>
<div class="auth-content"> <div class="auth-content">
<div class="intro-message auth-box"> <div class="auth-box">
<h2 class="section-heading">{% trans "Login"%}</h2> <h1 class="section-heading allcaps">{% trans "Log in" %}</h1>
{% include 'hosting/includes/_messages.html' %} {% include 'hosting/includes/_messages.html' %}
<form action="{% url 'hosting:login' %}" method="post" class="form" novalidated> <form action="{% url 'hosting:login' %}" method="post" class="form" novalidated>
{% csrf_token %} {% csrf_token %}
@ -23,23 +19,21 @@
{% bootstrap_field field show_label=False type='fields'%} {% bootstrap_field field show_label=False type='fields'%}
{% endfor %} {% endfor %}
<p class="red">{{form.non_field_errors|striptags}}</p> <p class="red">{{form.non_field_errors|striptags}}</p>
{% buttons %} <div class="text-center">
<button type="submit" class="btn btn-block btn-success"> <button type="submit" class="btn choice-btn">
{% trans "Log in" %} {% trans "Log in" %}
</button> </button>
{% endbuttons %} </div>
<input type='hidden' name='next' value='{{request.GET.next}}'/> <input type='hidden' name='next' value='{{request.GET.next}}'/>
</form> </form>
<div class="auth-footer"> <div class="auth-footer">
<div class="text"> <div>
<span>{% trans "Don't have an account yet ? "%}</span> {% trans "Don't have an account yet ?" %}&nbsp;
<a class="" href="{% url 'hosting:signup' %}">{% trans "Sign up" %}</a>
</div> </div>
<div class="links"> <div>
<a class="unlink" href="{% url 'hosting:signup' %}">{% trans "Sign up"%}</a> or <a href="{% url 'hosting:reset_password' %}">{% trans "Forgot your password ?" %}</a><br>
<span class="text"> or </span> or <a href="{% url 'hosting:resend_activation_link' %}">{% trans "Resend activation link" %}</a>
<a class="unlink" href="{% url 'hosting:reset_password' %}">{% trans "Forgot your password ? "%}</a>
<span class="text"> or </span><br/>
<a class="unlink" href="{% url 'hosting:resend_activation_link' %}">{% trans "Resend activation link"%}</a>
</div> </div>
</div> </div>
</div> </div>

29
hosting/templates/hosting/resend_activation_link.html
View file

@ -1,35 +1,38 @@
{% extends "hosting/base_short.html" %} {% extends "hosting/base_short.html" %}
{% load staticfiles bootstrap3%} {% load staticfiles bootstrap3 i18n %}
{% load i18n %}
{% block navbar %} {% block navbar %}
{% include 'hosting/includes/_navbar_transparent.html' %} {% include 'hosting/includes/_navbar_transparent.html' %}
{% endblock navbar %} {% endblock navbar %}
{% block content %} {% block content %}
<div class="auth-container"> <div class="auth-container">
<div class="auth-bg"></div> <div class="auth-bg"></div>
<div class="auth-center"> <div class="auth-center">
<div class="auth-title"> <div class="auth-content wide">
<h2>{% trans "Your VM hosted in Switzerland"%}</h2> <div class="auth-box sign-up">
</div> <h1 class="section-heading">{% trans "Resend activation link" %}</h1>
<div class="auth-content">
<div class="intro-message auth-box sign-up">
<h2 class="section-heading">{% trans "Resend activation link"%}</h2>
{% include 'hosting/includes/_messages.html' %} {% include 'hosting/includes/_messages.html' %}
<form action="{% url 'hosting:resend_activation_link' %}" method="post" class="form" novalidate> <form action="{% url 'hosting:resend_activation_link' %}" method="post" class="form" novalidate>
{% csrf_token %} {% csrf_token %}
{% for field in form %} {% for field in form %}
{% bootstrap_field field show_label=False %} {% bootstrap_field field show_label=False %}
{% endfor %} {% endfor %}
{% buttons %} <div class="text-center">
<button type="submit" class="btn btn-block btn-success"> <button type="submit" class="btn choice-btn">
{% trans "Submit"%} {% trans "Submit"%}
</button> </button>
{% endbuttons %} </div>
</form> </form>
<div class="auth-footer">
<div>
{% trans "Don't have an account yet ?" %}&nbsp;
<a class="" href="{% url 'hosting:signup' %}">{% trans "Sign up" %}</a>
</div>
<div>
or <a href="{% url 'hosting:reset_password' %}">{% trans "Forgot your password ?" %}</a>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

25
hosting/templates/hosting/reset_password.html
View file

@ -1,40 +1,33 @@
{% extends "hosting/base_short.html" %} {% extends "hosting/base_short.html" %}
{% load staticfiles bootstrap3%} {% load i18n staticfiles bootstrap3%}
{% load i18n %}
{% block navbar %} {% block navbar %}
{% include 'hosting/includes/_navbar_transparent.html' %} {% include 'hosting/includes/_navbar_transparent.html' %}
{% endblock navbar %} {% endblock navbar %}
{% block content %} {% block content %}
<div class="auth-container"> <div class="auth-container">
<div class="auth-bg"></div> <div class="auth-bg"></div>
<div class="auth-center"> <div class="auth-center">
<div class="auth-title">
<h2>{% trans "Your VM hosted in Switzerland"%}</h2>
</div>
<div class="auth-content"> <div class="auth-content">
<div class="intro-message auth-box sign-up"> <div class="auth-box sign-up">
<h2 class="section-heading">{% trans "Reset your password"%}</h2> <h1 class="section-heading">{% trans "Password reset" %}</h1>
{% include 'hosting/includes/_messages.html' %} {% include 'hosting/includes/_messages.html' %}
<form action="{% url 'hosting:reset_password' %}" method="post" class="form" novalidate> <form action="{% url 'hosting:reset_password' %}" method="post" class="form" novalidate>
{% csrf_token %} {% csrf_token %}
{% for field in form %} {% for field in form %}
{% bootstrap_field field show_label=False %} {% bootstrap_field field show_label=False %}
{% endfor %} {% endfor %}
{% buttons %} <div class="text-center">
<button type="submit" class="btn btn-block btn-success"> <button type="submit" class="btn choice-btn">
{% trans "Reset" %} {% trans "Reset" %}
</button> </button>
{% endbuttons %} </div>
</form> </form>
<div class="auth-footer"> <div class="auth-footer">
<div class="text"> <div>
<span>{% trans "Already have an account ?"%}</span> <span>{% trans "Already have an account ?" %}</span>&nbsp;
</div> <a href="{% url 'hosting:login' %}">{% trans "Login" %}</a>
<div class="links">
<a class="unlink" href="{% url 'hosting:login' %}">{% trans "Login"%}</a>
</div> </div>
</div> </div>
</div> </div>

21
hosting/templates/hosting/signup.html
View file

@ -9,30 +9,25 @@
<div class="auth-container auth-signup"> <div class="auth-container auth-signup">
<div class="auth-bg"></div> <div class="auth-bg"></div>
<div class="auth-center "> <div class="auth-center ">
<div class="auth-title">
<h2>{% trans "Your VM hosted in Switzerland"%}</h2>
</div>
<div class="auth-content"> <div class="auth-content">
<div class="intro-message auth-box sign-up"> <div class="auth-box sign-up">
<h2 class="section-heading">{% trans "Sign up"%}</h2> <h1 class="section-heading allcaps">{% trans "Sign up" %}</h1>
{% include 'hosting/includes/_messages.html' %} {% include 'hosting/includes/_messages.html' %}
<form action="{% url 'hosting:signup' %}" method="post" class="form" novalidate> <form action="{% url 'hosting:signup' %}" method="post" class="form" novalidate>
{% csrf_token %} {% csrf_token %}
{% for field in form %} {% for field in form %}
{% bootstrap_field field show_label=False %} {% bootstrap_field field show_label=False %}
{% endfor %} {% endfor %}
{% buttons %} <div class="text-center">
<button type="submit" class="btn btn-block btn-info"> <button type="submit" class="btn choice-btn">
{% trans "Sign up" %} {% trans "Sign up" %}
</button> </button>
{% endbuttons %} </div>
</form> </form>
<div class="auth-footer"> <div class="auth-footer">
<div class="text"> <div>
<span>{% trans "Already have an account ?"%}</span> <span>{% trans "Already have an account ?" %}</span>&nbsp;
</div> <a href="{% url 'hosting:login' %}">{% trans "Login" %}</a>
<div class="links">
<a class="unlink" href="{% url 'hosting:login' %}">{% trans "Login"%}</a>
</div> </div>
</div> </div>
</div> </div>

6
hosting/templates/hosting/signup_validate.html
View file

@ -9,11 +9,7 @@
<div class="auth-container"> <div class="auth-container">
<div class="auth-bg"></div> <div class="auth-bg"></div>
<div class="auth-center"> <div class="auth-center">
<div class="auth-title"> <div class="auth-content wide">
<h2>{% trans "Your VM hosted in Switzerland"%}</h2>
{% include 'hosting/includes/_messages.html' %}
</div>
<div class="auth-content">
<div class="intro-message auth-box sign-up"> <div class="intro-message auth-box sign-up">
<h2 class="section-heading">{{section_title}}</h2> <h2 class="section-heading">{{section_title}}</h2>
<div class="sign-up-message"> <div class="sign-up-message">