lkva/NDOJ
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Change UI

Browse source
This commit is contained in:
cuom1999 2021-12-09 14:31:49 -06:00
parent 70d81ad664
commit 9b5df4ac7e
3 changed files with 41 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
resources/base.scss
View file

@ -181,7 +181,7 @@ header {
} }
a { a {
color: #9c3706; color: lightcoral;
} }
li { li {
@ -291,7 +291,7 @@ nav {
&:hover { &:hover {
border-top: 2px solid #9c3706; border-top: 2px solid #9c3706;
color: #9c3706; color: lightcoral;
background: rgba(255, 255, 255, 0.25); background: rgba(255, 255, 255, 0.25);
margin: 0; margin: 0;
} }
@ -314,7 +314,7 @@ nav {
left: 5px; left: 5px;
display: none; display: none;
color: #fff; color: #fff;
background: #00c4cc; background: darkcyan;
margin: 0 !important; margin: 0 !important;
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4); box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
@ -329,6 +329,10 @@ nav {
li { li {
display: block; display: block;
a {
color: white !important;
}
a, button { a, button {
padding: 8px 20px 8px 8px !important; padding: 8px 20px 8px 8px !important;
font-size: 0.8em; font-size: 0.8em;
@ -680,12 +684,31 @@ math {
} }
#notification { #notification {
color: gray; color: lightsteelblue;
float: left; float: left;
margin-top: 0.8em; margin-top: 0.6em;
margin-right: 0.8em; margin-right: 0.8em;
font-size: 1.3em; font-size: 1.3em;
} }
#chat-icon {
color: lightseagreen;
float: left;
margin-top: 0.6em;
margin-right: 0.5em;
font-size: 1.3em;
}
.unread_boxes {
background-color: red;
color: white;
border-radius: 50%;
padding: 1px 4px;
margin-left: -12px;
font-size: x-small;
font-family: monospace;
}
@media (max-width: 500px) { @media (max-width: 500px) {
#notification { #notification {
margin-top: 0.6em; margin-top: 0.6em;

8
resources/chatbox.scss
View file

@ -171,13 +171,7 @@
cursor: pointer; cursor: pointer;
margin-top: 0.5em; margin-top: 0.5em;
} }
.unread_boxes {
background-color: darkcyan;
color: white;
border-radius: 50%;
padding: 0 3px;
margin-left: -4px;
}
@media (max-width: 799px) { @media (max-width: 799px) {
#chat-area { #chat-area {
height: 500px; height: 500px;

23
templates/base.html
View file

@ -151,12 +151,12 @@
name: '{{ request.user.username|escapejs }}' name: '{{ request.user.username|escapejs }}'
}; };
$(function() { $(function() {
if ($('.nav-chat').length) { if ($('#chat-icon').length) {
$.get("{{url('get_unread_boxes')}}") $.get("{{url('get_unread_boxes')}}")
.done(function(data) { .done(function(data) {
if (data.unread_boxes) { if (data.unread_boxes) {
var html = `<sub class="unread_boxes">${data.unread_boxes}</sub>`; var html = `<sub class="unread_boxes">${data.unread_boxes}</sub>`;
$('.nav-chat').append(html); $('#chat-icon').append(html);
} }
}) })
.fail(function(data) { .fail(function(data) {
@ -219,15 +219,18 @@
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>
<div style="float: right; display: inline;"> <div style="float: right; display: inline; font-size: larger;">
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
{% set unseen_cnt = request.profile.count_unseen_notifications %} <span title="{{_('Chat')}}">
<span class="{{ 'notification-open' if unseen_cnt > 0 }}"> <a id="chat-icon" href="{{ url('chat', '') }}" class="icofont-wechat" aria-hidden="true">
<a href="{{ url('notification') }}" class="fa fa-bell" id="notification" aria-hidden="true"> </a>
{% if unseen_cnt > 0 %}
<span>
{{ unseen_cnt }}
</span> </span>
{% set unseen_cnt = request.profile.count_unseen_notifications %}
<span title="{{_('Notification')}}" class="{{ 'notification-open' if unseen_cnt > 0 }}">
<a href="{{ url('notification') }}" class="icofont-alarm" id="notification" aria-hidden="true">
{% if unseen_cnt > 0 %}
<sub class="unread_boxes">{{unseen_cnt}}</sub>
{% endif %} {% endif %}
</a> </a>
</span> </span>
@ -258,7 +261,7 @@
<li> <li>
<form action="{{ url('auth_logout') }}" method="POST"> <form action="{{ url('auth_logout') }}" method="POST">
{% csrf_token %} {% csrf_token %}
<button type="submit">{{ _('Log out') }}</button> <button type="submit" style="color: red !important">{{ _('Log out') }}</button>
</form> </form>
</li> </li>
{% endif %} {% endif %}