0.0.8

static/css/styles(boris).css

@@ -198,4 +198,74 @@
     /*border-radius: 3px;*/
 }
 
-/**/
+/*messenger*/
+
+.container-messenger{
+    width: 100%;
+    height: 100%;
+    margin-bottom: 30px;
+}
+
+.block-chat{
+    width: 70%;
+    height: 100%;
+    border-radius: 10px;
+    border: 1px solid #E6E6E6;
+    background: #ffffff;
+    box-shadow: -1px 4px 10px 0 rgba(198, 199, 203, 0.20), 0 -1px 10px 0 rgba(198, 199, 203, 0.20);
+    float: left;
+
+}
+
+.container-header-chat{
+    border-radius: 10px;
+    border: 1px solid #E6E6E6;
+    background: #FFF;
+    width: calc(100% - 40px);
+    height: 60px;
+    padding: 20px;
+}
+
+.header-chat-left-part{
+    width: 50%;
+    float: left;
+    text-align: left;
+    padding-top: 15px;
+}
+
+.header-chat-right-part{
+    width: 50%;
+    float: right;
+    text-align: right;
+    padding-top: 25px;
+}
+
+.chat-avatar{
+    height: 40px;
+}
+
+.chat-username {
+    color: #000000;
+    font-weight: 600;
+    font-size: 18px;
+    padding-left: 10px;
+    position: relative;
+    top: 10px;
+}
+
+.header-icons-right-part-padding{
+    padding-left: 5px;
+}
+
+.container-messages{
+    height: 63%;
+    width: 100%;
+}
+
+.footer-chat{
+    width: 100%;
+    height: 60px;
+    background: #FFFFFF;
+    border-radius: 10px;
+    border: 1px solid #E6E6E6;
+}

static/img/svg/info.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="filled/action/info">
+<path id="Vector" d="M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM13 17H11V11H13V17ZM13 9H11V7H13V9Z" fill="#FF613A"/>
+</g>
+</svg>

static/img/svg/phone.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="filled/communication/phone">
+<path id="Vector" d="M6.62 10.79C8.06 13.62 10.38 15.93 13.21 17.38L15.41 15.18C15.68 14.91 16.08 14.82 16.43 14.94C17.55 15.31 18.76 15.51 20 15.51C20.55 15.51 21 15.96 21 16.51V20C21 20.55 20.55 21 20 21C10.61 21 3 13.39 3 4C3 3.45 3.45 3 4 3H7.5C8.05 3 8.5 3.45 8.5 4C8.5 5.25 8.7 6.45 9.07 7.57C9.18 7.92 9.1 8.31 8.82 8.59L6.62 10.79Z" fill="#FF613A"/>
+</g>
+</svg>

templates/blocks/profile/b_new_msg_to_user.html

@@ -1,11 +1,32 @@
+{% load static %}
+
 <div class="title-profile-cont">
     <h1>Написать сообщение</h1>
 </div>
 
-<div>
+<div class="container-messenger">
-    <div>
+    <div class="block-chat">
-        <div>
+        <div class="container-header-chat">
+            <div class="header-chat-left-part">
+                <img class="chat-avatar" src="{% static "delete_later/Avatar.png" %}">
+                <span class="chat-username">Сергейко Сергей</span>
+            </div>
+            <div class="header-chat-right-part">
+                <img class="header-icons-right-part-padding" src="{% static "img/svg/phone.svg" %}">
+                <img class="header-icons-right-part-padding" src="{% static "img/svg/info.svg" %}">
+            </div>
+        </div>
+        <div class="container-messages">
+            {% include "widgets/w_message.html" %}
+        </div>
+        <div class="footer-chat">
+            <div>
 
+            </div>
+            <div>
+                <img>
+                <button></button>
+            </div>
         </div>
     </div>
     <div>

templates/widgets/w_message.html

@@ -0,0 +1 @@
+{% load static %}