Browse Source

added mockups and tested taggit lib

newsletter
Esther Kleinhenz 6 years ago
parent
commit
774757c610

+ 10308
- 0
application/static/bootstrap/js/jquery-1.11.1.js
File diff suppressed because it is too large
View File


+ 293
- 0
application/static/css/student_page.css View File

@import url(http://fonts.googleapis.com/css?family=Roboto); /* FREE GOOGLE FONT */

body {
font-family: 'Roboto', sans-serif;
line-height: 30px;
}

.set-radius-zero {
border-radius: 0px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
}

.content-wrapper {
margin-top: 40px;
min-height: 600px;
padding-bottom: 60px;
}

.page-head-line {
font-weight: 900;
padding-bottom: 20px;
border-bottom: 2px solid #F0677C;
text-transform: uppercase;
color: #F0677C;
font-size: 20px;
margin-bottom: 40px;
}

.btn {
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
}

.progress {
height: 8px;
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
}
.login-icon {
height: 60px;
width: 60px;
padding: 13px;
border-radius: 50%;
font-size: 30px;
margin-bottom: 20px;
color: #fff;
text-align: center;
cursor:pointer;
background-color:#F0677C;
-webkit-border-radius:50%;
-moz-border-radius:50%;
}
/* =============================================================
HEADER SECTION STYLES
============================================================ */
header {
background-color: #F0677C;
color: #fff;
padding: 10px;
text-align: right;
}


/* =============================================================
LOGO SECTION STYLES
============================================================ */
.left-div {
padding-left: 30px;
margin-top: 40px;
margin-bottom: 30px;
}

.navbar-brand {
width: 250px;
padding-top: 30px;
}

/* USER SETTINGS DIV */
.user-settings-wrapper .nav > li > a {
position: relative;
display: block;
padding: 15px 18px;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
height: 60px;
width: 60px;
background-color: #F0677C;
color: #fff;
}

.user-settings-wrapper {
margin-top: 10px;
}

.user-settings-wrapper li {
display: inline-block;
}

.user-settings-wrapper .dropdown-settings {
width: 200px;
padding: 10px;
}

.user-settings-wrapper .nav > li > a:hover,.user-settings-wrapper .nav > li > a:focus {
text-decoration: none;
background-color: #C36464!important;
}

.user-settings-wrapper img {
height: 64px;
width: 64px;
border: 1px solid #000000;
}

.user-settings-wrapper .dropdown-menu {
margin: 0px;
border-radius: 0px!important;
-moz-border-radius: 0px!important;
-webkit-border-radius: 0px!important;
}

.user-settings-wrapper .btn {
border-radius: 0px!important;
-moz-border-radius: 0px!important;
-webkit-border-radius: 0px!important;
}

.user-settings-wrapper .media-heading {
padding-top: 10px;
}

/* MENU LINKS SECTION*/

.menu-section {
background-color: #3D3D3D;
}

#menu-top a {
color: #FFF;
text-decoration: none;
font-weight: 500;
padding: 10px 10px 10px 10px;
text-transform: uppercase;
}

.menu-top-active {
background-color: #C36464;
}

.menu-section .nav > li > a:hover,.menu-section .nav > li > a:focus {
background-color: #F0677C!important;
}

.menu-section .dropdown-menu > li > a:hover,.menu-section .dropdown-menu > li > a:focus {
background-color: #F0677C!important;
}

.navbar-inverse {
background-color: #C36464;
border-color: transparent;
}

.navbar-toggle {
background-color: #F0677C;
border: 1px solid #fff;
}

.navbar {
margin-bottom: 0px;
}
/* =============================================================
FOOTER SECTION STYLES
============================================================ */
footer {
padding: 10px;
color: #fff;
font-size: 12px;
background-color: #C36464;
}

footer a, footer a:hover {
color: #fff;
text-decoration: none;
}

/*==============================================
DASHBOARD STYLES
=============================================*/

/* DASHBOARD ICONS */

.bk-clr-one {
background-color: #B9B739;
}

.bk-clr-two {
background-color: #F94C4C;
}

.bk-clr-three {
background-color: #119c7e;
}

.bk-clr-four {
background-color: #b739b9;
}

.dashboard-div-icon {
height: 75px;
width: 75px;
border: 2px solid #fff;
padding: 20px;
border-radius: 50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
font-size: 30px;
margin-bottom: 20px;
color: #fff;
}

.dashboard-div-wrapper {
border-radius: 5px;
text-align: center;
padding: 15px;
color: #fff;
margin-bottom: 50px;
}

.dashboard-div-wrapper .progress {
height: 2px;
}

/* NOTICE BOARD */


.notice-board .panel {
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
}

.notice-board ul {
padding-left: 0px;
list-style: none;
}

.notice-board li {
padding: 10px;
border-bottom: 1px solid #E5E5E5;
}

.notice-board li span {
margin-right: 10px;
border: 1px solid #DBDBDB;
padding: 5px;
}

.notice-board li a, li a:hover {
text-decoration: none;
color: #000;
}

/* SOCIAL BUTTONS */
.btn-social {
color: white;
opacity: 0.8;
}

.btn-social:hover {
color: white;
opacity: 1;
text-decoration: none;
}

.btn-facebook {
background-color: #3b5998;
}

.btn-twitter {
background-color: #00aced;
}

.btn-linkedin {
background-color: #0e76a8;
}

.btn-google {
background-color: #c32f10;
}

+ 3
- 2
application/templates/base.html View File

</li> </li>
{% elif user.is_staff %} {% elif user.is_staff %}
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="{% url 'logout' %}">Administration</a>
<a class="nav-link" href="{% url 'logout' %}">Administration</a>
</li> </li>
{% else %} {% else %}
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="{% url 'student_page' %}">{{user.get_username}}'s Dashboard</a>
<a class="nav-link" href="{% url 'student_page' %}">{{user.get_username}}'s Dashboard</a>
</li> </li>
{% endif %} {% endif %}
</ul> </ul>
</div> </div>
</div> </div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="{% static 'bootstrap/js/jquery-1.11.1.js' %} "></script>
<script src="{% static 'bootstrap/js/bootstrap.bundle.js' %}"></script> <script src="{% static 'bootstrap/js/bootstrap.bundle.js' %}"></script>
</body> </body>



+ 74
- 2
application/templates/student_page.html View File

{% extends "base.html" %}
{% block content %}
{% extends "base.html" %} {% block content %}
<div class="table-responsive">
<table class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th>Ref. No.</th>
<th>Date</th>
<th>Amount</th>
<th>Status</th>
<th>Delivery On </th>
<th># #</th>
</tr>
</thead>
<tbody>

<tr>
<td># 2501</td>
<td>01/22/2015 </td>
<td>
<label class="label label-info">300 USD </label>
</td>
<td>
<label class="label label-success">Delivered</label>
</td>
<td>01/25/2015</td>
<td>
<a href="#" class="btn btn-xs btn-danger">View</a>
</td>
</tr>
<tr>
<td># 15091</td>
<td>12/12/2014 </td>
<td>
<label class="label label-danger">7000 USD </label>
</td>
<td>
<label class="label label-warning">Shipped</label>
</td>
<td>N/A</td>
<td>
<a href="#" class="btn btn-xs btn-success">View</a>
</td>
</tr>
<tr>
<td># 11291</td>
<td>12/03/2014 </td>
<td>
<label class="label label-warning">7000 USD </label>
</td>
<td>
<label class="label label-success">Delivered</label>
</td>
<td>01/23/2015</td>
<td>
<a href="#" class="btn btn-xs btn-primary">View</a>
</td>
</tr>
<tr>
<td># 1808</td>
<td>11/10/2014 </td>
<td>
<label class="label label-success">2000 USD </label>
</td>
<td>
<label class="label label-info">Returned</label>
</td>
<td>N/A</td>
<td>
<a href="#" class="btn btn-xs btn-danger">View</a>
</td>
</tr>
</tbody>
</table>
</div>
{% endblock %} {% endblock %}

BIN
doc/mockups/dashboard_student.epgz View File


BIN
doc/mockups/login.epgz View File


BIN
doc/mockups/login.pdf View File


BIN
doc/mockups/login_failed.epgz View File


Loading…
Cancel
Save