From ab907135dbe2694cae998dd4b78bd71b3a47dfa3 Mon Sep 17 00:00:00 2001
From: Kostya <ckutls228@gmail.com>
Date: Sun, 19 Nov 2023 14:14:54 +0300
Subject: [PATCH] added template vision msg

---
 .../src/assets/css/ElementsStyles/chat.css    |  26 ++++++++++++++++++
 .../assets/icons-test/person-icon-chat.png    | Bin 0 -> 1017 bytes
 luckydiamond/src/pages/ChatElement.vue        |  11 ++++++++
 3 files changed, 37 insertions(+)
 create mode 100644 luckydiamond/src/assets/icons-test/person-icon-chat.png

diff --git a/luckydiamond/src/assets/css/ElementsStyles/chat.css b/luckydiamond/src/assets/css/ElementsStyles/chat.css
index b355f74..0f81d56 100644
--- a/luckydiamond/src/assets/css/ElementsStyles/chat.css
+++ b/luckydiamond/src/assets/css/ElementsStyles/chat.css
@@ -36,4 +36,30 @@
     padding: 6px 6px 6px 7px;
     border-radius: 6px;
     background: #3D3F48;
+}
+
+.chat__content--users {
+    height: 70%;
+}
+
+.card__user {
+    margin-top: 24px;
+    margin: 24px 70px 0px 23px;
+    display: flex;
+}
+
+.user__icon {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+}
+
+.content {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    flex-direction: column;
+    margin-left: 23px;
 }
\ No newline at end of file
diff --git a/luckydiamond/src/assets/icons-test/person-icon-chat.png b/luckydiamond/src/assets/icons-test/person-icon-chat.png
new file mode 100644
index 0000000000000000000000000000000000000000..0f4ff1026ec1eb05202d60e708896ac8c97bf3f5
GIT binary patch
literal 1017
zcmV<V0|xwwP)<h;3K|Lk000e1NJLTq001cf001fo1^@s6F7$F(00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1CB{VK~#7F#hFb=
z6;Tw&&nxX?QJJYxQ5qsqnvkj0B9fNjBBDh`Q9;{~h!#aeP@AHNq81UMk@VflXwk+8
zN)Z$mW@t%TnP~+oqNt^}|6%UrdBgZ-?&yqv_;F|6J?Eao+_@ifUyP<8rBn)va<Cng
zfDF(N20#O-iN#{AG*d!?2f$C|t;ZmTq7(wo2A3U)^nwSV3RHszM|~gIO;HKK?ug(m
zpd6&S*sTIrz#m~>L17C)PK$ugK$;JqQqZG)`avOuC4R5Km=5+C%r)>W0)yJOj>3|D
z-)!ZOq2O~?_-~>xgoZnGfEo%Qel@^|ZsVMZ?<_w?XmlNlY<*ix0fhOo55;SJTWa9y
zFG(m%T(?tjz1L+P8OU#vQoR&hLli)MlN=D&YbdzZ>hd=k$ZwLo{*LMEVhS!h$qy8U
zcz)9(vkNRBL&0aSn1c3D7(&B4M34)HzKcP-_T@5#!V(&<7m4ok>65Cg&4;Z+6s8bh
zx$bUTyo$_DVxJ2dh5b#6LI{*Ey3X#t^PmhAYbtnU0;9t2QK;SQk|=LB-YS0@2B&DI
zgy8!@9Q<`j?iaYuT~1R}%*y~l7NXb%Hh>jmt-sY+i@Svlx5Ml4JTMO0Q2)cx4sY#_
zlJzar173kR?7mP?abR#vS)T?@wJU?U4z}AslS@0iKjpzUpG?IsxJsNhSY0lG?t(2z
z+Sv?lJA9hKH^*<EKqi?84rfFIt^6cJ-9eQ&x>@|KQw2_f<KTu$oO)Q?BbCZ}HMpHZ
zHL;4Z?wcf-D;yi`MjbYp${G}d%3Iu}x4_a#;?)S-a=%GF)DA<+<1>K+>nHmZw25Hd
zpjJP*G><lT$KI*^-jR<4^F$z{^?52ntivL1nU`^;FwUWfgjkEz#4K{j%lNrAd_fTl
zG4JWvADwm1O>coNn<#qOA8D(R=n`4+KS^D&Oy9nt=+&%C-h^b!3i%`p#C01*uV!(*
zURKB?<-YJcMK2k1j;xSLri<%gidfiajEmb0StpY;U*xA>cA^Qn$RtN;=4IzI==LK^
zo^6*<#KP<%&xcx)8QQacoFbN*I9ePBS;-7fh-L8!SV<vEZ!j*3xYwLEF^2=6eZK@7
z^-p|U7bolSPxpxD!NJ?Noxt8Hb%3oH>77YE`B8(bDtgs{bhn&hNs=u>aRlT8K8*K$
nM($H1;47#n>rbgk&(i+^fRZ4Ndz9#b00000NkvXXu0mjfw&%}@

literal 0
HcmV?d00001

diff --git a/luckydiamond/src/pages/ChatElement.vue b/luckydiamond/src/pages/ChatElement.vue
index 284e622..b8ebd90 100644
--- a/luckydiamond/src/pages/ChatElement.vue
+++ b/luckydiamond/src/pages/ChatElement.vue
@@ -10,6 +10,17 @@
         </div>
       </div>
     </div>
+    <div class="chat__content--users">
+      <div class="card__user">
+        <div class="user__icon">
+          <img src="@/assets/icons-test/person-icon-chat.png">
+        </div>
+        <div class="content">
+          <h3>User Name</h3>
+          <p>msg content</p>
+        </div>
+      </div>
+    </div>
   </aside>
 </template>