fix(admin): improve dashboard layout and docs link
This commit is contained in:
@@ -71,7 +71,7 @@ JAZZMIN_SETTINGS = {
|
|||||||
# User menu
|
# User menu
|
||||||
"topmenu_links": [
|
"topmenu_links": [
|
||||||
{"name": "Главная", "url": "admin:index", "permissions": ["auth.view_user"]},
|
{"name": "Главная", "url": "admin:index", "permissions": ["auth.view_user"]},
|
||||||
{"name": "API Docs", "url": "/api/docs/", "new_window": True},
|
{"name": "API Docs", "url": "schema-swagger-ui", "new_window": True},
|
||||||
{"model": "user.User"},
|
{"model": "user.User"},
|
||||||
],
|
],
|
||||||
# Side menu
|
# Side menu
|
||||||
|
|||||||
@@ -181,7 +181,7 @@ fieldset.module,
|
|||||||
.selector,
|
.selector,
|
||||||
.login-card-body,
|
.login-card-body,
|
||||||
fieldset.module {
|
fieldset.module {
|
||||||
border-radius: 20px;
|
border-radius: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card,
|
.card,
|
||||||
@@ -212,7 +212,7 @@ fieldset.module,
|
|||||||
.module h2,
|
.module h2,
|
||||||
.module caption,
|
.module caption,
|
||||||
.inline-group h2 {
|
.inline-group h2 {
|
||||||
border-radius: 18px 18px 0 0;
|
border-radius: 12px 12px 0 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
a,
|
a,
|
||||||
@@ -298,7 +298,7 @@ textarea,
|
|||||||
.select2-container--default .select2-selection--multiple {
|
.select2-container--default .select2-selection--multiple {
|
||||||
background: rgba(4, 14, 18, 0.92);
|
background: rgba(4, 14, 18, 0.92);
|
||||||
border: 1px solid rgba(73, 208, 200, 0.14);
|
border: 1px solid rgba(73, 208, 200, 0.14);
|
||||||
border-radius: 14px;
|
border-radius: 10px;
|
||||||
color: var(--mx-text);
|
color: var(--mx-text);
|
||||||
min-height: 2.7rem;
|
min-height: 2.7rem;
|
||||||
}
|
}
|
||||||
@@ -341,7 +341,7 @@ small,
|
|||||||
.object-tools,
|
.object-tools,
|
||||||
.actions,
|
.actions,
|
||||||
.paginator {
|
.paginator {
|
||||||
border-radius: 18px;
|
border-radius: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button,
|
.button,
|
||||||
@@ -353,7 +353,7 @@ input[type="button"],
|
|||||||
a.button {
|
a.button {
|
||||||
background: linear-gradient(135deg, rgba(23, 97, 100, 0.62), rgba(42, 72, 133, 0.46));
|
background: linear-gradient(135deg, rgba(23, 97, 100, 0.62), rgba(42, 72, 133, 0.46));
|
||||||
border: 1px solid rgba(73, 208, 200, 0.18);
|
border: 1px solid rgba(73, 208, 200, 0.18);
|
||||||
border-radius: 14px;
|
border-radius: 10px;
|
||||||
color: #f5fbff;
|
color: #f5fbff;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
letter-spacing: 0.02em;
|
letter-spacing: 0.02em;
|
||||||
@@ -390,7 +390,7 @@ a.button:hover,
|
|||||||
.errornote,
|
.errornote,
|
||||||
.success,
|
.success,
|
||||||
.warning {
|
.warning {
|
||||||
border-radius: 16px;
|
border-radius: 12px;
|
||||||
padding: 0.95rem 1.1rem;
|
padding: 0.95rem 1.1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -443,7 +443,7 @@ code {
|
|||||||
|
|
||||||
.login-box .card,
|
.login-box .card,
|
||||||
.login-card-body {
|
.login-card-body {
|
||||||
border-radius: 24px;
|
border-radius: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.login-logo a {
|
.login-logo a {
|
||||||
@@ -488,3 +488,76 @@ code {
|
|||||||
border: 2px solid rgba(3, 12, 15, 0.92);
|
border: 2px solid rgba(3, 12, 15, 0.92);
|
||||||
border-radius: 999px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dashboard .admin-dashboard-grid > [class*="col-"],
|
||||||
|
.dashboard .admin-dashboard-grid .row > [class*="col-"],
|
||||||
|
.dashboard .card,
|
||||||
|
.dashboard .card-header,
|
||||||
|
.dashboard .card-body,
|
||||||
|
#content-related,
|
||||||
|
#recent-actions-module,
|
||||||
|
.timeline,
|
||||||
|
.timeline-item,
|
||||||
|
.content-wrapper .content,
|
||||||
|
.content-wrapper .container-fluid {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dashboard .admin-dashboard-grid {
|
||||||
|
row-gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dashboard .card,
|
||||||
|
.dashboard .module,
|
||||||
|
#recent-actions-module {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dashboard .card-header h5,
|
||||||
|
.dashboard .timeline-item,
|
||||||
|
.dashboard .timeline-header,
|
||||||
|
.dashboard .table td,
|
||||||
|
.dashboard .table th {
|
||||||
|
overflow-wrap: anywhere;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-header .navbar-nav,
|
||||||
|
.main-header .form-inline,
|
||||||
|
.main-header .input-group {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-header .form-inline {
|
||||||
|
flex: 0 1 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-header .form-control-navbar {
|
||||||
|
width: clamp(8rem, 12vw, 12rem);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1360px) {
|
||||||
|
.main-header .form-inline.ml-3 {
|
||||||
|
margin-left: 0.5rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-header .form-control-navbar {
|
||||||
|
width: clamp(7rem, 10vw, 10rem);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 991.98px) {
|
||||||
|
.main-header.navbar {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
row-gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-header .form-inline {
|
||||||
|
width: 100%;
|
||||||
|
margin-left: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-header .input-group,
|
||||||
|
.main-header .form-control-navbar {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
133
src/templates/admin/index.html
Normal file
133
src/templates/admin/index.html
Normal file
@@ -0,0 +1,133 @@
|
|||||||
|
{% extends "admin/base_site.html" %}
|
||||||
|
{% load i18n static jazzmin %}
|
||||||
|
{% get_jazzmin_ui_tweaks as jazzmin_ui %}
|
||||||
|
|
||||||
|
{% block bodyclass %}{{ block.super }} dashboard{% endblock %}
|
||||||
|
|
||||||
|
{% block content_title %} {% trans 'Dashboard' %} {% endblock %}
|
||||||
|
|
||||||
|
{% block breadcrumbs %}
|
||||||
|
<ol class="breadcrumb">
|
||||||
|
<li class="breadcrumb-item"><a href="{% url 'admin:index' %}">{% trans 'Home' %}</a></li>
|
||||||
|
<li class="breadcrumb-item">{% trans 'Dashboard' %}</li>
|
||||||
|
</ol>
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block content %}
|
||||||
|
{% get_side_menu using="app_list" as dashboard_list %}
|
||||||
|
{% if dashboard_list %}
|
||||||
|
{% widthratio dashboard_list|length 2 1 as middle %}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<div class="row admin-dashboard-grid">
|
||||||
|
<div class="col-xl-8 col-lg-8 col-12">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-6 col-sm-12">
|
||||||
|
{% for app in dashboard_list %}
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<h5 class="m-0">{{ app.name }}</h5>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<table class="table table-sm">
|
||||||
|
<tbody>
|
||||||
|
{% for model in app.models %}
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
{% if model.url %}<a href="{{ model.url }}">{{ model.name }}</a>{% else %}{{ model.name }}{% endif %}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<div class="btn-group float-right">
|
||||||
|
{% if model.add_url %}
|
||||||
|
<a href="{{ model.add_url }}" class="btn btn-xs {{ jazzmin_ui.button_classes.success }} addlink">{% trans 'Add' %}</a>
|
||||||
|
{% endif %}
|
||||||
|
{% if model.url %}
|
||||||
|
{% if model.view_only %}
|
||||||
|
<a href="{{ model.url }}" class="btn btn-xs {{ jazzmin_ui.button_classes.info }} viewlink">{% trans 'View' %}</a>
|
||||||
|
{% else %}
|
||||||
|
<a href="{{ model.url }}" class="btn btn-xs {{ jazzmin_ui.button_classes.info }} changelink">{% if model.custom %}{% trans 'Go' %}{% else %}{% trans 'Change' %}{% endif %}</a>
|
||||||
|
{% endif %}
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{% endfor %}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% if forloop.counter == middle|add:"0" %}
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6 col-sm-12">
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-xl-4 col-lg-4 col-12">
|
||||||
|
<div id="content-related">
|
||||||
|
<div class="module" id="recent-actions-module">
|
||||||
|
<h4 class="mb-3">{% trans 'Recent actions' %}</h4>
|
||||||
|
{% load log %}
|
||||||
|
{% get_admin_log 6 as admin_log for_user user %}
|
||||||
|
{% if not admin_log %}
|
||||||
|
<p>{% trans 'None available' %}</p>
|
||||||
|
{% else %}
|
||||||
|
<div class="timeline">
|
||||||
|
{% for entry in admin_log %}
|
||||||
|
<div>
|
||||||
|
{% if entry.is_change %}
|
||||||
|
<i class="fas fa-edit bg-gray text-xs"></i>
|
||||||
|
{% elif entry.is_deletion %}
|
||||||
|
<i class="fas fa-trash bg-danger text-xs"></i>
|
||||||
|
{% elif entry.is_addition %}
|
||||||
|
<i class="fas fa-plus-circle bg-success text-xs"></i>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<div class="timeline-item">
|
||||||
|
<span class="time"><i class="fas fa-clock"></i> {% blocktrans with timesince=entry.action_time|timesince %}{{ timesince }} ago{% endblocktrans %}</span>
|
||||||
|
<h3 class="timeline-header no-border">
|
||||||
|
{% if entry.is_deletion or not entry.get_admin_url %}
|
||||||
|
{{ entry.object_repr }}
|
||||||
|
{% else %}
|
||||||
|
<a href="{{ entry.get_admin_url }}">{{ entry.object_repr }}</a>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% if entry.model %}
|
||||||
|
<span class="mini quiet">
|
||||||
|
{% filter capfirst %}
|
||||||
|
{{ entry.model }}
|
||||||
|
{% endfilter %}
|
||||||
|
</span>
|
||||||
|
{% endif %}
|
||||||
|
</h3>
|
||||||
|
{% if not entry.is_deletion %}
|
||||||
|
<div class="timeline-body">
|
||||||
|
{% if entry.is_addition %}
|
||||||
|
{{ entry }}
|
||||||
|
{% else %}
|
||||||
|
<ul style="list-style: none; padding: 0;">
|
||||||
|
{% action_message_to_list entry as action_message_list %}
|
||||||
|
{% for action_message in action_message_list %}
|
||||||
|
<li>{{ action_message.msg|style_bold_first_word }}</li>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
<div>
|
||||||
|
<i class="fa fa-clock bg-gray"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% endblock %}
|
||||||
Reference in New Issue
Block a user