From 2ac1d34f1b439007d8e05059ce2af6eaad4ab9ed Mon Sep 17 00:00:00 2001
From: "Vsevo;od" <96574851+vsevolod22@users.noreply.github.com>
Date: Sun, 24 Dec 2023 00:32:39 +0300
Subject: [PATCH] usersadd

---
 src/Components/AddUsersPage/index.jsx         |  45 ++++++++++-
 src/Components/AddUsersPage/style.module.scss |  73 ++++++++++++++++--
 src/img/AddUsers/delete.png                   | Bin 0 -> 688 bytes
 src/img/AddUsers/permission.png               | Bin 0 -> 740 bytes
 4 files changed, 110 insertions(+), 8 deletions(-)
 create mode 100644 src/img/AddUsers/delete.png
 create mode 100644 src/img/AddUsers/permission.png

diff --git a/src/Components/AddUsersPage/index.jsx b/src/Components/AddUsersPage/index.jsx
index 3c2234a..7bad770 100644
--- a/src/Components/AddUsersPage/index.jsx
+++ b/src/Components/AddUsersPage/index.jsx
@@ -1,7 +1,8 @@
 import styles from './style.module.scss';
 import avatar from '../../img/profilePage/avatar.png';
 import Header from '../Header';
-
+import del from '../../img/AddUsers/delete.png';
+import perm from '../../img/AddUsers/permission.png';
 const AddUsers = () => {
     return (
         <>
@@ -38,6 +39,48 @@ const AddUsers = () => {
                                     <span>1</span>
 
                                 </div>
+                                <div className={styles.delete_container}><img src={del} className={styles.delete_img}></img></div>
+                                <div className={styles.feautures}>Отправлено</div>
+                            </div>
+                        </div>
+                        <div className={styles.profile__user_container}>
+                            <div className={styles.profile__user_img_container}>
+                                <img src={avatar} className={styles.profile__user_img}></img>
+                                <div className={styles.profile__user_role}>Участник</div>
+                            </div>
+                            <div className={styles.profile__user_info_container}>
+                                <div className={styles.profile__user_fullName}><span>К</span>ирсанов Дмитрий </div>
+                                <div className={styles.profile__user_spaciality}>Junior PHP разработчик</div>
+                                <div className={styles.profile__user_socialMedia}>TG: @dkir</div>
+                                <div className={styles.profile__user_email}>gmail@gmail.com</div>
+                                <div className={styles.profile__user_progress_container}>
+                                    <span>0</span>
+                                    <span className={styles.profile__user_progress_line}></span>
+                                    <span>1</span>
+
+                                </div>
+                                <div className={styles.delete_container}><img src={del} className={styles.delete_img}></img></div>
+                                <div className={styles.permission_container}><img src={perm} className={styles.permission_img}></img></div>
+                            </div>
+                        </div>
+                        <div className={styles.profile__user_container}>
+                            <div className={styles.profile__user_img_container}>
+                                <img src={avatar} className={styles.profile__user_img}></img>
+                                <div className={styles.profile__user_role}>Участник</div>
+                            </div>
+                            <div className={styles.profile__user_info_container}>
+                                <div className={styles.profile__user_fullName}><span>К</span>ирсанов Дмитрий </div>
+                                <div className={styles.profile__user_spaciality}>Junior PHP разработчик</div>
+                                <div className={styles.profile__user_socialMedia}>TG: @dkir</div>
+                                <div className={styles.profile__user_email}>gmail@gmail.com</div>
+                                <div className={styles.profile__user_progress_container}>
+                                    <span>0</span>
+                                    <span className={styles.profile__user_progress_line}></span>
+                                    <span>1</span>
+
+                                </div>
+                                <div className={styles.delete_container}><img src={del} className={styles.delete_img}></img></div>
+                                <div className={styles.permission_container}><img src={perm} className={styles.permission_img}></img></div>
                             </div>
                         </div>
                     </div>
diff --git a/src/Components/AddUsersPage/style.module.scss b/src/Components/AddUsersPage/style.module.scss
index aa5edc4..39b42fc 100644
--- a/src/Components/AddUsersPage/style.module.scss
+++ b/src/Components/AddUsersPage/style.module.scss
@@ -18,6 +18,7 @@
 
    
     &__search {
+        margin-top: 150px;
         border-radius: 10px;
         border: 1px solid var(--gray_stroke, #D0D2D8);
         height: 70px;
@@ -35,24 +36,30 @@
         margin-top: 200px;
         display: flex;
         justify-content: space-between;
+        
 
     }
     &__user {
         &_img {
+            width: 180px;
+            height: 180px;
             &_container {
                 display: flex;
                 flex-direction: column;
                 margin-right: 50px;
                 
+                
             }
         }
         &_container {
             display: flex;
-            width: 50%;
+            width: 48%;
+            margin-bottom: 110px;
+            position: relative;
         }
         &_info_container {
             text-align: left;
-            margin-top: 20px;
+            margin-top: 18px;
             display: flex;
             text-align: left;
             flex-direction: column;
@@ -60,7 +67,7 @@
         &_fullName {
             color: #000;
             font-family: Montserrat;
-            font-size: 36px;
+            font-size: 26px;
             font-style: normal;
             font-weight: 600;
             line-height: normal;
@@ -72,7 +79,7 @@
         &_spaciality {
             color: #000;
             font-family: Montserrat;
-            font-size: 32px;
+            font-size: 22px;
             font-style: normal;
             font-weight: 400;
             line-height: normal;
@@ -81,7 +88,7 @@
         &_socialMedia {
             color: #000;
             font-family: Montserrat;
-            font-size: 20px;
+            font-size: 18px;
             font-style: normal;
             font-weight: 400;
             line-height: normal;
@@ -90,7 +97,7 @@
         &_email {
             color: #000;
             font-family: Montserrat;
-            font-size: 20px;
+            font-size: 18px;
             font-style: normal;
             font-weight: 400;
             line-height: normal;
@@ -129,6 +136,8 @@
         display: flex;
         justify-content: space-between;
         margin-top: 120px;
+        flex-wrap: wrap;
+        
     }
     &__card {
 
@@ -141,6 +150,7 @@
             width: 48%;
             border-radius: 10px;
             border: 1px solid var(--gray_stroke, #D0D2D8);
+            margin-bottom: 110px;
         }
         &_text {
             color: #000;
@@ -168,4 +178,53 @@
     font-style: normal;
     font-weight: 400;
     line-height: normal;
-}
\ No newline at end of file
+}
+.feautures {
+    width: 90px;
+    position: absolute;
+    right: 0px;
+    bottom: 40px;
+    display: flex;
+    justify-content: center;
+    font-family: Montserrat;
+    align-items: center;
+    color: #60AD1E;
+    font-family: Montserrat;
+    font-size: 16px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: normal;
+    background: #E7FFD2;
+    height: 15px;
+    padding: 10px;
+    }
+    .permission {
+
+
+        &_container {
+            width: 40px;
+            height: 40px;
+            position: absolute;
+            right: 0px;
+            bottom: 40px;
+        }
+        &_img {
+            height: 100%;
+            width: 100%;
+        }
+    }
+    .delete {
+
+
+        &_container {
+            width: 40px;
+            height: 40px;
+            position: absolute;
+            top: 40px;
+            right: 0px;
+        }
+        &_img {
+            height: 100%;
+            width: 100%;
+        }
+    }
\ No newline at end of file
diff --git a/src/img/AddUsers/delete.png b/src/img/AddUsers/delete.png
new file mode 100644
index 0000000000000000000000000000000000000000..9b46f7522448f19d7e53e49fb9d36392b51e5670
GIT binary patch
literal 688
zcmV;h0#E&kP)<h;3K|Lk000e1NJLTq001Ze001cn1^@s6N1|)U00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0!2wgK~#7F?O5$`
z!Y~Yd>Ggl<1h^Yy1el;~P&Vjw0_X(o24#b?0dxZB1aT(-CP?Mt97ZVE&R6d^-kmOy
zBg+ptvJ`+TE*uGJAO{9?NlAJoCR>s@EuzsSh**#0lOzw6kG%Xxv_fzdL9UPmx&SRS
zu0XDkF(MKD4%$czoS`q0S&8{0$;i={wBQgCxP?q2WsY48n4XcS65Ag>mwZo4Y-d5q
zL=F_mrp7i_m5r20Hv&h6E;H@`vu5hGvPVev4-w3y2qq;Y6%GgR8;&QwV1EEtLE*1}
zCV92@=0K14YqFO8QiX~z$;W&xeRFQ$$ByX=)xo#W8?g|AThAhOu<;pmO;9m?=bO+q
z!RRf%g&(?X5vStlgq6E|KW?786`~b_kO<mrUO0L`u}22oPjDz{&!j)tBcv6A+{vB2
zDz@M>ckZ3>qCzZjN>BsM6TG+AwOv3#Cgze@+xtEu5t1aD>3>nMTQ<b`D41u%GZjLk
zE^K#mR5OL=o09HCG22yaRq{qKphtUxeDw6}GZ*)fzQe#H<cv=Ox|E4ypG$t4AgH-x
zq3{<iQzne30>La~?T{pq2rFS&W1loq;`D?$Ra-WZ&_a5->H6+OPC53<iR8?VMYmcp
z1n1280FlV|A55-~dC0ubEpDUb^0rzAT@qAG_qJLFp#(M4{a;_FNIgD9gmyD)rkf6>
zPuFjR!Pt&HKC2^d{!=tV(-5+-j*QR->{(VPl3DB#Rp}pATe=kDvU!~}`QBY|Dfk5`
WkwK;IghV9(0000<MNUMnLSTZ3Hzw`?

literal 0
HcmV?d00001

diff --git a/src/img/AddUsers/permission.png b/src/img/AddUsers/permission.png
new file mode 100644
index 0000000000000000000000000000000000000000..35858ce5e270bbe52836c7474c5699b0a5a62edd
GIT binary patch
literal 740
zcmV<A0vr8_P)<h;3K|Lk000e1NJLTq001Ze001cn1^@s6N1|)U00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0(nV9K~#7F?O5S;
zoG=Xj($@jlpc;Wr5V}D(2qR>JyA8?)M<+-(xZ5D<1h^BBOwgiYda|*N%^CV9-+Ow`
zU|If<WZ4FI$8ESn8b}MH(Bi}EATNWcfUQdFDXp7~YLI4-Zjj$Ar1RK3dvt3=qVyP9
zBN7i0`Ug3{6=F8RUUP+y!|?`x*lgW)kRQTsYw7&ddiU1*FN0iMMrn{9<`<nXh9#75
zORzoH;hM|Syw9Tl>@#$>jFh+?uCN{*dSvMoOA3T-$g%WrM??vonRAY!^Md^3I+*Em
za*XLi1Z8+1k)IrCyYl@Lu912~xI7u|t&pGGgckFVKUvR>%WyD3Gm)FnAY9yM^B0!V
zmgFYXn3pu~m;wv&&rELBm>Of%Ppy5skXwtd$WJcE=I|E;Glycx(E_<|2rQITv`7z8
zxiCf{P^h_3o+2kAn4YK+57uqqo=3q`iwO}Y32Tx`{~7t9U=jR)D?vEgK0Ju__kdo7
zagQh5hzjv_kPvt3k*hT(DhvgW2UAd429?#%tB+S>E8eAE&SoIQd+-d?gC|X@)_u|2
zmjeo(RZNH@Xz$reazR@DDOjoV5ow@EJ-*}e;%Sfx1oO*7=-~ENuL)IH5AWhjId1X5
z7p<o<kdg>;kjYKh9|Q+MS!UiuJKKpO0VLZ0{?kZ;7t#J71S`@0<x*I@Rc#Ep_-dB|
zFBF-F2keIf;<iuY^1cVjX<L+Y8nyGzF@TRxB;F~E`N@BxIC)>SOnosR(Ju8o_ZY7X
zg*De_Vc%=aSB$q5+cAqc?nJcLb2;xIF~^`vOR2w*4Sm8oaQT@2Nwe@ZcS@UgY=S>t
Wd8@AsswLR~0000<MNUMnLSTYR-%b4h

literal 0
HcmV?d00001