7

static/css/mobile_styles.css

@@ -1634,6 +1634,25 @@
 
 
 }
+
+@media (max-width: 800px) {
+    .marker_messages_mobile{
+        position: absolute;
+        top: 0;
+        right: 0;
+        border-radius: 100%;
+        background: #ff0000;
+        height: 14px;
+        width: 15px;
+    }
+    .marker_messages_mobile.hide{
+        display: none;
+    }
+    .marker_messages_mobile.show{
+        display: block;
+    }
+}
+
 @media (max-width: 828px){
     /*.to_address_point_txt.find_route {*/
     /*width: 54.6%;*/
@@ -1694,6 +1713,7 @@
 
 }
 @media (max-width: 699px){
+
     .block-chat.support {
         /*height: calc(100vh - 190px);*/
         /*1. 100svh 2. 45px - header 3. name_ticket 4. just padding */

static/js/chat_sockets.js

@@ -107,6 +107,14 @@ function wsReceiveData (e) {
         update_support_chat_func(data,msg_cont)
     }
     if (data.unread_msgs_count > 0){
+        if (getInfoAboutUser('screen_width') < 800){
+            if (window.location.href.includes("chat") || window.location.href.includes("chat"))
+            let marker_new_messages = document.querySelector(".marker_messages_mobile");
+            if (marker_new_messages.classList.contains('hide')){
+                marker_new_messages.classList.add('show')
+                marker_new_messages.classList.remove('hide')
+            }
+        }
         update_count_unread_messages(data)
     }
     if (data.required_beep === true) {

static/js/global_js.js

@@ -132,7 +132,7 @@ function getTypeOfData (data) {
 }
 
 
-function getInfoAboutUser (){
+function getInfoAboutUser (screen_width){
     let user_type = ''
     if (screen.width <= 700){
         user_type = 'mobile'
@@ -141,7 +141,11 @@ function getInfoAboutUser (){
     } else if (screen.width > 700 && screen.width <= 1180) {
         user_type = 'laptop'
     }
-    return user_type
+    if (screen_width){
+        return screen.width
+    } else {
+        return user_type
+    }
 }
 
 document.addEventListener('DOMContentLoaded', function() {

templates/blocks/b_header.html

@@ -114,6 +114,7 @@
 
 
                 <div class="button_profile_header_mobile" onclick="show_header_list()">
+                    <div class="marker_messages_mobile hide"></div>
                     <img src="/static/img/svg/userMobile.svg" alt="">
                 </div>