0.0.141 routes

static/v2/css/blocks/b_login_modal.css

@@ -14,6 +14,44 @@
 
     z-index: 10000000;
 
+    @media (max-width: 725px) {
+        --modal-width: calc(100% - 20px);
+        --modal-padding: 15px 15px 20px 10px;
+        .modal_description{
+            width: 100%!important;
+        }
+    } @media (max-height: 512px) {
+        .modal_description{
+            width: 100%;
+        }
+        --modal-height: calc(100% - 20px);
+    }
+    @media (max-width: 500px) {
+        .modal_title{
+            font-size: 26px!important;
+        }
+        .modal_description{
+            font-size: 18px!important;
+        }
+    }
+    @media (max-width: 360px) {
+        .modal_title{
+            font-size: 24px!important;
+        }
+        .modal_description{
+            font-size: 16px!important;
+        }
+        .primary_btn{
+            --padding: 7.5px 0;
+            --font-size: 14px;
+            --font-weight: 400;
+        }
+        .registr_btn{
+            font-size: 14px!important;
+            font-weight: 400!important;
+        }
+    }
+
     .b_login_modal_container_content{
         position: fixed;
         background: #FFFFFF;
@@ -87,5 +125,7 @@
         font-size: 18px;
         font-weight: 600;
         color: #27242499;
+        text-decoration: none;
+        display: block;
     }
 }

static/v2/css/service/btns.css

@@ -10,6 +10,10 @@
     --font-weight: 700;
     --color: #FFFFFF;
     --text-align: center;
+    --text-decoration: none;
+
+    --width: unset;
+    --display: block;
 
     background: var(--background);
     border: var(--border);
@@ -20,8 +24,48 @@
 
     font-size: var(--font-size);
     font-weight: var(--font-weight);
-    color: var(--color);
+    color: var(--color)!important;
     text-align: var(--text-align);
+    text-decoration: var(--text-decoration);
+
+    width: var(--width)!important;
+    display: var(--display);
+
+    cursor: pointer;
+}
+
+.default_btn{
+    --background: #FFFFFF;
+    --border: none;
+    --box-shadow: none;
+    --border-radius: 8px;
+    --margin: 0;
+    --padding: 7px 0;
+
+    --font-size: 12px;
+    --font-weight: 500;
+    --color: #27242499;
+    --text-align: center;
+    --text-decoration: none;
+
+    --width: 85px;
+    --display: block;
+
+    background: var(--background);
+    border: var(--border);
+    box-shadow: var(--box-shadow);
+    border-radius: var(--border-radius);
+    margin: var(--margin);
+    padding: var(--padding);
+
+    font-size: var(--font-size);
+    font-weight: var(--font-weight);
+    color: var(--color)!important;
+    text-align: var(--text-align);
+    text-decoration: var(--text-decoration);
+
+    width: var(--width)!important;
+    display: var(--display);
 
     cursor: pointer;
 }

static/v2/css/widgets/w_route_card.css

@@ -135,7 +135,8 @@
                     background-clip: text;
                     -webkit-background-clip: text;
                 }
-                .route_msg_for_unregistered_user{
+                .route_msg_for_unregistered_user, .route_clicked_msg_for_unregistered_user{
+                    --filter: none;
                     position: absolute;
                     top: 0;
                     width: 100%;
@@ -148,6 +149,7 @@
                         width: 32px;
                         height: 32px;
                         display: block;
+                        filter: var(--filter);
                     }
                     div{
                         font-size: 12px;
@@ -156,7 +158,23 @@
                         color: #27242499;
                     }
                 }
+                .route_clicked_msg_for_unregistered_user{
+                    display: none;
+                    div{
+                        color: #272424;
+                    }
+                    --filter: brightness(0) saturate(100%) invert(43%) sepia(55%) saturate(1482%) hue-rotate(336deg) brightness(104%) contrast(101%);
+                }
+                &.clicked{
+                    .route_clicked_msg_for_unregistered_user{
+                        display: flex;
+                    }
+                    .route_msg_for_unregistered_user{
+                        display: none;
+                    }
+                }
             }
+
         }
         .route_card_owner_info{
             height: 47px;

static/v2/js/widgets/w_route_card.js

@@ -131,4 +131,11 @@ function respondBtnClickEvent(el, authentificated) {
         $(".b_login_modal").addClass('open');
         $("body")[0].style.overflow = "hidden";
     }
+}
+
+function clickedUnregisteredMsgRoute (el) {
+    if (!el) return;
+
+    let $parent = el.closest(".route_card_text_container")
+    $parent.classList.add('clicked');
 }

templates/v2/blocks/b_login_modal.html

@@ -12,8 +12,8 @@
             </div>
             <div class="modal_title">{% trans "Войдите или зарегистрируйтесь" %}</div>
             <div class="modal_description">{% trans "Чтобы увидеть контакты - войдите в свою учетную запись или зарегистрируйтесь" %}</div>
-            <div class="primary_btn">{% trans "Войти" %}</div>
+            <a class="primary_btn" href="{% url "login_profile" %}">{% trans "Войти" %}</a>
-            <div class="registr_btn">{% trans "Зарегестрироватся" %}</div>
+            <a class="registr_btn" href="{% url "registration_page" %}">{% trans "Зарегестрироватся" %}</a>
         </div>
     </div>
 </div>

templates/v2/content_widgets/w_route_card/route_card_info_data_for_search.html

@@ -33,10 +33,15 @@
             {% endif %}
         </div>
         {% if not user.if_authenticated %}
-            <div class="route_msg_for_unregistered_user">
+            <div class="route_msg_for_unregistered_user" onclick="clickedUnregisteredMsgRoute(this)">
                 <img src="{% static "v2/icons/widgets/w_route_card/unregistered.svg" %}" alt="">
                 <div>{% trans "Текст сообщения доступен только авторизированным пользователям." %}</div>
             </div>
+            <div class="route_clicked_msg_for_unregistered_user">
+                <img src="{% static "v2/icons/widgets/w_route_card/lock.png" %}" alt="">
+                <div>{% trans "Текст сообщения доступен только авторизированным пользователям." %}</div>
+                <a class="default_btn" href="{% url "login_profile" %}">{% trans "Войти" %}</a>
+            </div>
         {% endif %}
     </div>
     <div class="route_number">{% trans "Объявление №" %} {{ route.id }}</div>