Skip to content

Commit e26b0a0

Browse files
authored
Merge pull request #23 from Creworker/master
Design improvements
2 parents 0e29685 + 147a286 commit e26b0a0

File tree

9 files changed

+236
-170
lines changed

9 files changed

+236
-170
lines changed

adminlte3/templates/adminlte/base.html

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
{% load adminlte_helpers i18n %}
2-
{% load static %}<!DOCTYPE html>
2+
{% load static %}
3+
<!DOCTYPE html>
34
<html>
45
<head>
56
{% block title_outer %}
@@ -14,6 +15,7 @@
1415

1516
{% block stylesheets %}
1617
{% include 'adminlte/lib/_styles.html' %}
18+
{% block style_sheets %}{% endblock %}
1719
{% endblock %}
1820

1921
{% block extra_head %}{% endblock %}
@@ -70,11 +72,14 @@ <h1>
7072
{% include 'adminlte/lib/_main_footer.html' %}
7173
{% endblock %}
7274

75+
76+
7377
</div>
7478
{% endblock body %}
7579

7680
{% block javascript %}
7781
{% include 'adminlte/lib/_scripts.html' %}
82+
{% block js %}{% endblock %}
7883
{% endblock %}
7984

8085
{% block extra_js %}{% endblock %}

adminlte3/templates/adminlte/lib/_main_header.html

Lines changed: 118 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -33,132 +33,140 @@
3333
{% endblock %}
3434

3535
{% block nav_custom_menu %}
36-
<!-- Right navbar links -->
37-
<ul class="navbar-nav ml-auto">
38-
<ul class="nav navbar-nav">
36+
<!-- Right navbar links -->
37+
<ul class="navbar-nav ml-auto">
3938
{% block header_dropdowns %}
40-
<!-- Messages Dropdown Menu -->
41-
<li class="nav-item dropdown">
39+
<!-- Messages Dropdown Menu -->
40+
<li class="nav-item dropdown">
4241
<a class="nav-link" data-toggle="dropdown" href="#">
43-
<i class="far fa-comments fa-2x"></i>
44-
<span class="badge badge-danger navbar-badge">3</span>
42+
<i class="far fa-comments"></i>
43+
<span class="badge badge-danger navbar-badge">3</span>
4544
</a>
4645
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
47-
<a href="#" class="dropdown-item">
48-
<!-- Message Start -->
49-
<div class="media">
50-
<img src="{%static 'admin-lte/dist/img/user1-128x128.jpg' %}" alt="User Avatar" class="img-size-50 mr-3 img-circle">
51-
<div class="media-body">
52-
<h3 class="dropdown-item-title">
53-
Brad Diesel
54-
<span class="float-right text-sm text-danger"><i class="fas fa-star"></i></span>
55-
</h3>
56-
<p class="text-sm">Call me whenever you can...</p>
57-
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
58-
</div>
59-
</div>
60-
<!-- Message End -->
61-
</a>
62-
<div class="dropdown-divider"></div>
63-
<a href="#" class="dropdown-item">
64-
<!-- Message Start -->
65-
<div class="media">
66-
<img src="{%static 'admin-lte/dist/img/user8-128x128.jpg' %}" alt="User Avatar" class="img-size-50 img-circle mr-3">
67-
<div class="media-body">
68-
<h3 class="dropdown-item-title">
69-
John Pierce
70-
<span class="float-right text-sm text-muted"><i class="fas fa-star"></i></span>
71-
</h3>
72-
<p class="text-sm">I got your message bro</p>
73-
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
74-
</div>
75-
</div>
76-
<!-- Message End -->
77-
</a>
78-
<div class="dropdown-divider"></div>
79-
<a href="#" class="dropdown-item">
80-
<!-- Message Start -->
81-
<div class="media">
82-
<img src="{%static 'admin-lte/dist/img/user3-128x128.jpg' %}" alt="User Avatar" class="img-size-50 img-circle mr-3">
83-
<div class="media-body">
84-
<h3 class="dropdown-item-title">
85-
Nora Silvester
86-
<span class="float-right text-sm text-warning"><i class="fas fa-star"></i></span>
87-
</h3>
88-
<p class="text-sm">The subject goes here</p>
89-
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
90-
</div>
91-
</div>
92-
<!-- Message End -->
93-
</a>
94-
<div class="dropdown-divider"></div>
95-
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
46+
<a href="#" class="dropdown-item">
47+
<!-- Message Start -->
48+
<div class="media">
49+
<img src="{%static 'admin-lte/dist/img/user1-128x128.jpg' %}" alt="User Avatar" class="img-size-50 mr-3 img-circle">
50+
<div class="media-body">
51+
<h3 class="dropdown-item-title">
52+
Brad Diesel
53+
<span class="float-right text-sm text-danger"><i class="fas fa-star"></i></span>
54+
</h3>
55+
<p class="text-sm">Call me whenever you can...</p>
56+
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
57+
</div>
58+
</div>
59+
<!-- Message End -->
60+
</a>
61+
<div class="dropdown-divider"></div>
62+
<a href="#" class="dropdown-item">
63+
<!-- Message Start -->
64+
<div class="media">
65+
<img src="{%static 'admin-lte/dist/img/user4-128x128.jpg' %}" alt="User Avatar" class="img-size-50 img-circle mr-3">
66+
<div class="media-body">
67+
<h3 class="dropdown-item-title">
68+
John Pierce
69+
<span class="float-right text-sm text-muted"><i class="fas fa-star"></i></span>
70+
</h3>
71+
<p class="text-sm">I got your message bro</p>
72+
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
73+
</div>
74+
</div>
75+
<!-- Message End -->
76+
</a>
77+
<div class="dropdown-divider"></div>
78+
<a href="#" class="dropdown-item">
79+
<!-- Message Start -->
80+
<div class="media">
81+
<img src="{%static 'admin-lte/dist/img/user3-128x128.jpg' %}" alt="User Avatar" class="img-size-50 img-circle mr-3">
82+
<div class="media-body">
83+
<h3 class="dropdown-item-title">
84+
Nora Silvester
85+
<span class="float-right text-sm text-warning"><i class="fas fa-star"></i></span>
86+
</h3>
87+
<p class="text-sm">The subject goes here</p>
88+
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>
89+
</div>
90+
</div>
91+
<!-- Message End -->
92+
</a>
93+
<div class="dropdown-divider"></div>
94+
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
9695
</div>
97-
</li>
98-
<!-- Notifications Dropdown Menu -->
99-
<li class="nav-item dropdown">
96+
</li>
97+
<!-- Notifications Dropdown Menu -->
98+
<li class="nav-item dropdown">
10099
<a class="nav-link" data-toggle="dropdown" href="#">
101-
<i class="far fa-bell fa-2x"></i>
102-
<span class="badge badge-warning navbar-badge">15</span>
100+
<i class="far fa-bell"></i>
101+
<span class="badge badge-warning navbar-badge">15</span>
103102
</a>
104103
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
105-
<span class="dropdown-item dropdown-header">15 Notifications</span>
106-
<div class="dropdown-divider"></div>
107-
<a href="#" class="dropdown-item">
108-
<i class="fas fa-envelope mr-2"></i> 4 new messages
109-
<span class="float-right text-muted text-sm">3 mins</span>
110-
</a>
111-
<div class="dropdown-divider"></div>
112-
<a href="#" class="dropdown-item">
113-
<i class="fas fa-users mr-2"></i> 8 friend requests
114-
<span class="float-right text-muted text-sm">12 hours</span>
115-
</a>
116-
<div class="dropdown-divider"></div>
117-
<a href="#" class="dropdown-item">
118-
<i class="fas fa-file mr-2"></i> 3 new reports
119-
<span class="float-right text-muted text-sm">2 days</span>
120-
</a>
121-
<div class="dropdown-divider"></div>
122-
<a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>
104+
<span class="dropdown-item dropdown-header">15 Notifications</span>
105+
<div class="dropdown-divider"></div>
106+
<a href="#" class="dropdown-item">
107+
<i class="fas fa-envelope mr-2"></i> 4 new messages
108+
<span class="float-right text-muted text-sm">3 mins</span>
109+
</a>
110+
<div class="dropdown-divider"></div>
111+
<a href="#" class="dropdown-item">
112+
<i class="fas fa-users mr-2"></i> 8 friend requests
113+
<span class="float-right text-muted text-sm">12 hours</span>
114+
</a>
115+
<div class="dropdown-divider"></div>
116+
<a href="#" class="dropdown-item">
117+
<i class="fas fa-file mr-2"></i> 3 new reports
118+
<span class="float-right text-muted text-sm">2 days</span>
119+
</a>
120+
<div class="dropdown-divider"></div>
121+
<a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>
123122
</div>
124-
</li>
125-
<!-- Notifications Dropdown Menu -->
123+
</li>
126124
{% block user_info %}
125+
127126
{% if request.user.is_authenticated %}
128-
<li class="nav-item dropdown">
129-
<a class="nav-link" data-toggle="dropdown" href="#">
130-
<i class="far fa-user fa-2x"></i>
131-
</a>
132-
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
133-
<a href="#" class="dropdown-item">
134-
<!-- Message Start -->
135-
<div class="media">
136-
<img src="{%avatar_url size=128 %}" alt="User Avatar" class="img-size-50 mr-3 img-circle">
137-
<div class="media-body">
138-
<h3 class="dropdown-item-title">
139-
{% firstof request.user.get_short_name request.user.get_username %}
140-
<span class="float-right text-sm text-danger"><i class="fas fa-online"></i></span>
141-
</h3>
142-
<p class="text-sm"><small>{% trans 'Member since' %} :</small></p>
143-
<p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> <small>{{ request.user.date_joined }}</small></p>
144-
</div>
145-
</div>
146-
<!-- Message End -->
147-
</a>
148-
<div class="dropdown-divider"></div>
149-
<div class="dropdown-footer">
150-
<a href="{% block change_password_url %}{% url 'admin:password_change' %}{% endblock %}" class="btn btn-primary btn-sm">{% trans 'Change password' %}</a>
151-
<a href="{% block logout_url %}{% logout_url %}{% endblock %}" class="btn btn-danger btn-sm">{%trans 'Sign out'%}</a>
152-
</div>
153-
127+
<li class="nav-item dropdown user-menu">
128+
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" aria-expanded="true">
129+
<img src="{%avatar_url 128 %}" class="user-image img-circle elevation-2" alt="User Image">
130+
<span class="d-none d-md-inline">{% firstof request.user.get_short_name request.user.get_username %}</span>
131+
</a>
132+
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
133+
<!-- User image -->
134+
<li class="user-header bg-primary">
135+
<img src="{%avatar_url size=160 %}" class="img-circle elevation-2" alt="User Image">
136+
137+
<p>
138+
{% firstof request.user.get_short_name request.user.get_username %} - {% firstof request.user.get_role %}
139+
<small>Member since : {{ request.user.date_joined }}</small>
140+
</p>
141+
</li>
142+
<!-- Menu Body -->
143+
<li class="user-body">
144+
<div class="row">
145+
<div class="col-4 text-center">
146+
<a href="#">Profile</a>
147+
</div>
148+
<div class="col-4 text-center">
149+
<a href="#">Team</a>
150+
</div>
151+
<div class="col-4 text-center">
152+
<a href="#">Friends</a>
153+
</div>
154154
</div>
155-
</li>
155+
<!-- /.row -->
156+
</li>
157+
<!-- Menu Footer-->
158+
<li class="user-footer">
159+
<a href="{% block change_password_url %}{% url 'admin:password_change' %}{% endblock %}" class="btn btn-default btn-flat">{% trans 'Change Password'%}</a>
160+
<a href="{% block logout_url %}{% logout_url %}{% endblock %}" class="btn btn-default btn-flat float-right">{% trans 'Sign Out'%}<a>
161+
</li>
162+
</ul>
163+
</li>
156164
{% endif %}
157165
{% endblock user_info %}
158166
{% endblock header_dropdowns %}
159167
</ul>
160-
</ul>
161-
{% endblock nav_custom_menu %}
168+
169+
{% endblock nav_custom_menu %}
162170

163171
{% endblock %}
164172
</nav>

adminlte3/templates/adminlte/lib/_main_sidebar.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{% load adminlte_helpers %}
22
{%load static %}
33
<!-- Left side column. contains the sidebar -->
4-
<aside class="main-sidebar sidebar-dark-primary elevation-4">
4+
<aside class="main-sidebar sidebar-light-success elevation-4">
55
<!-- Brand Logo -->
66
{% block logo %}
77
<a href="/" class="brand-link">

0 commit comments

Comments
 (0)