Change UI

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

View file

@ -181,7 +181,7 @@ header {
}
a {
color: #9c3706;
color: lightcoral;
}
li {
@ -291,7 +291,7 @@ nav {
&:hover {
border-top: 2px solid #9c3706;
color: #9c3706;
color: lightcoral;
background: rgba(255, 255, 255, 0.25);
margin: 0;
}
@ -314,7 +314,7 @@ nav {
left: 5px;
display: none;
color: #fff;
background: #00c4cc;
background: darkcyan;
margin: 0 !important;
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
@ -329,6 +329,10 @@ nav {
li {
display: block;
a {
color: white !important;
}
a, button {
padding: 8px 20px 8px 8px !important;
font-size: 0.8em;
@ -680,12 +684,31 @@ math {
}
#notification {
color: gray;
color: lightsteelblue;
float: left;
margin-top: 0.8em;
margin-top: 0.6em;
margin-right: 0.8em;
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) {
#notification {
margin-top: 0.6em;

View file

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

View file

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