From 2a12f9b1cf9c4ca30e6eae676b60af122555297c Mon Sep 17 00:00:00 2001
From: Kostya <ckutls228@gmail.com>
Date: Sun, 19 Nov 2023 14:53:34 +0300
Subject: [PATCH] added style for component write, for chat

---
 .../src/assets/css/ElementsStyles/chat.css    |  38 ++++++++++++++++++
 .../src/assets/icons-chat/sendmsg-icon.png    | Bin 0 -> 1017 bytes
 .../src/components/WritechatComponent.vue     |  18 +++++++++
 luckydiamond/src/pages/ChatElement.vue        |   9 ++---
 4 files changed, 59 insertions(+), 6 deletions(-)
 create mode 100644 luckydiamond/src/assets/icons-chat/sendmsg-icon.png
 create mode 100644 luckydiamond/src/components/WritechatComponent.vue

diff --git a/luckydiamond/src/assets/css/ElementsStyles/chat.css b/luckydiamond/src/assets/css/ElementsStyles/chat.css
index 97248b9..a09d47a 100644
--- a/luckydiamond/src/assets/css/ElementsStyles/chat.css
+++ b/luckydiamond/src/assets/css/ElementsStyles/chat.css
@@ -1,5 +1,6 @@
 .chat {
     margin: 9px 12px 0px 0px;
+
 }
 
 .chat__content {
@@ -71,3 +72,40 @@
 .content p {
     margin-top: 5px;
 }
+
+.write {
+    position: absolute;
+    bottom: 0;
+    margin: 24px 87px 22px 16px;
+    user-select: none;
+    width: 50%;
+}
+
+.write__content {
+    display: flex;
+    align-items: center;
+    text-align: center;
+}
+
+.write__content input {
+    padding: 14px 35% 14px 12px;
+    border-radius: 13px;
+    background: #22252F;
+    color: #A9A99D;
+    border: none;
+}
+
+.write__content input::placeholder {
+    color: #A9A99D;
+    font-weight: 800;
+    font-family: Montserrat;
+    font-size: 12px;
+}
+
+.write__content button {
+    padding: 8px 9px;
+    margin-left: -20px;
+    border-radius: 6px;
+    background: #3D3F48;
+    border: none;
+}
\ No newline at end of file
diff --git a/luckydiamond/src/assets/icons-chat/sendmsg-icon.png b/luckydiamond/src/assets/icons-chat/sendmsg-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..50cf62bffef9eec36e920ef6f985dccdb93217b5
GIT binary patch
literal 1017
zcmV<V0|xwwP)<h;3K|Lk000e1NJLTq0012T0012b1^@s6R+DEB00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1CB{VK~#7F-Ihy8
zR8bhm&mG2mAY{>F6KNDJB52bhi9%9J3M2%_XXX&t1H&K+O=B#~#2#oyL=@Vf;|q}%
zEyPM~Q42Rhw6F+WM3E7>u_VWterLQ#kE7#UZC3r^aK8K9bI$*Jo_h_U!Q=59vfJ&&
zh@1U>|A^1$tIf^L9TO3Tp@fc(jw&Ws(0f1QR#a3}U1nzH4-rYywzjq;o6R<=>3=fT
zY0qPfs_g9Sry>HdnRBY9E8+0<hG95OGKnNcGtn5qz`Y_8q!6r83a{5YBxi@i(L6IV
zvk$R`;WJ<FBqBqdot;fGI%1WuE%!1nFYg;(S5Q#fDJ+lDBNt)lu&jgr{(ifNB&mX|
z;GCSCe8hBNh8)thOs?_q@sE(76e~c06w7C<EXM0z#x^`ZEf(i{&}zt4PN$TDK6QlK
zgy)Y~m%_d$n);yZ04w<pv`kM=Pr~%{^e7%Dm`2DVx@P5KFx%}u;xVP;oUfcwOH}TK
zB$a4yZ_i<2oA%Dj^KItqRPt{T24-HX#B8_~#xTG|J-C-7mFVi~IzYbM!5hU2E(XZU
zAv%Y_TQqew`>!rZszAt25wgl)at<oN>*pd2WXM_TViYMI&ZLp9mmx_d+-~=#=;-KD
z#0!i#r6<?B>EHLl0$N*JlPS12=Ho-WJu8KfeOg#pIF5CFh#z!4hiniQ5fc;hMSF~&
zJ7cNEl>H8-Msky`slALk!aFD|fZQJ8N^RCuFO;w#yiH9_3GwmqWq5dAXdwlC=!&hh
z5C$hR)nIVS9EoAP%gV~y!z@3Q^PZZ?AK>sr?TokR%B^_E55NXOUkO=h(5t%1$;q3F
zZ~-aR+Rvm2Wu;a?<`EVk+l2L()#YM(_lgVWVt#)9aPay7DgAjE50gyYv)I_!yo`*D
zU*X7zPAbMeMofZGsmI9W8OVA=?F*3723xUA>F$OjY-wrP#V<?)Vw#xuYy#ptw8afE
z`<o+{B?VDRft6FC7Ry45i;KI2cqQmnJ^O0q_g7eer4KM3804)KZzS19O+O%S9=v-k
zR)Dai<ShllY7XD8bjaUHiIWxzdnJY>r5OIGLO>39(%s#iNXQ-_9@WTX-s)+A2B*_G
zAyx_X3z}lKjD&2L0p{a+3m~^*L|H*W!DsQ0(0{hOnKBnGFbsJyxU61(R$$i-chIYi
n%qPU`<@^cn8Yz+n@ju`%MCXkMtyW*;00000NkvXXu0mjf%;(q+

literal 0
HcmV?d00001

diff --git a/luckydiamond/src/components/WritechatComponent.vue b/luckydiamond/src/components/WritechatComponent.vue
new file mode 100644
index 0000000..9b0be2b
--- /dev/null
+++ b/luckydiamond/src/components/WritechatComponent.vue
@@ -0,0 +1,18 @@
+<template>
+  <div class="write">
+    <div class="write__content">
+      <input type="text" placeholder="Напишите сообщение...">
+      <button type="submit"><img src="@/assets/icons-chat/sendmsg-icon.png"></button>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file
diff --git a/luckydiamond/src/pages/ChatElement.vue b/luckydiamond/src/pages/ChatElement.vue
index 2c383b4..ce53c2e 100644
--- a/luckydiamond/src/pages/ChatElement.vue
+++ b/luckydiamond/src/pages/ChatElement.vue
@@ -93,19 +93,16 @@
         </div>
       </div>
     </div>
-    <div class="write">
-      <div class="write__content">
-        <h1>123</h1>
-      </div>
-    </div>
+    <writechat-component></writechat-component>
   </aside>
 </template>
 
 <script>
 import '@/assets/css/ElementsStyles/chat.css'
+import WritechatComponent from "@/components/WritechatComponent.vue";
 
 export default {
-
+  components: { WritechatComponent }
 }
 </script>