From 641a879fac05c9295b8d61b7db5889912c561437 Mon Sep 17 00:00:00 2001 From: gdamms Date: Fri, 22 Apr 2022 16:16:47 +0200 Subject: [PATCH 1/7] feat: title bar --- src/front/index.html | 103 ++++++++++++++++++++++++++++++ src/front/login-signup.css | 110 ++++++++++++++++++++++++++++++++ src/front/logo.png | Bin 0 -> 1902 bytes src/front/pixels.css | 6 ++ src/front/test.css | 127 ------------------------------------- src/front/test.html | 72 --------------------- src/front/title-bar.css | 40 ++++++++++++ src/front/utils.css | 20 ++++++ 8 files changed, 279 insertions(+), 199 deletions(-) create mode 100644 src/front/index.html create mode 100644 src/front/login-signup.css create mode 100644 src/front/logo.png create mode 100644 src/front/pixels.css delete mode 100644 src/front/test.css delete mode 100644 src/front/test.html create mode 100644 src/front/title-bar.css create mode 100644 src/front/utils.css diff --git a/src/front/index.html b/src/front/index.html new file mode 100644 index 0000000..7d86a64 --- /dev/null +++ b/src/front/index.html @@ -0,0 +1,103 @@ + + + + + + Popup Login Form Design | CodingNepal + + + + + + + + + +
+
+ Pixels
+
+ + + + + + + + + +
+
+ + + + + + + + + + + + + + + + + +
+ + + \ No newline at end of file diff --git a/src/front/login-signup.css b/src/front/login-signup.css new file mode 100644 index 0000000..a80b99c --- /dev/null +++ b/src/front/login-signup.css @@ -0,0 +1,110 @@ +.login-container, +.signup-container { + --width: 410px; + display: none; + visibility: visible; + background: #fff; + width: var(--width); + margin: 30px; + box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); + position: absolute; + left: calc(50% - var(--width) / 2); + top: 30%; +} + +#show-login:checked~.login-container { + display: flex; +} + +#show-signup:checked~.signup-container { + display: flex; +} + +.login-container .close-btn, +.signup-container .close-btn { + position: absolute; + right: 20px; + top: 15px; + font-size: 18px; + cursor: pointer; +} + +.login-container .close-btn:hover, +.signup-container .close-btn:hover { + color: #3498db; +} + +.login-container .text, +.signup-container .text { + font-size: 35px; + font-weight: 600; + text-align: center; +} + +.login-container form, +.signup-container form { + margin-top: -20px; +} + +.login-container form .data, +.signup-container form .data { + height: 45px; + width: 100%; + margin: 40px 0; +} + +form .data label { + font-size: 18px; +} + +form .data input { + height: 100%; + width: 100%; + padding-left: 10px; + font-size: 17px; + border: 1px solid silver; +} + +form .data input:focus { + border-color: #3498db; + border-bottom-width: 2px; +} + +form .forgot-pass { + margin-top: -8px; +} + +form .forgot-pass a { + color: #3498db; + text-decoration: none; +} + +form .forgot-pass a:hover { + text-decoration: underline; +} + +form .btn { + margin: 30px 0; + height: 45px; + width: 100%; + position: relative; + overflow: hidden; +} + +form .btn button { + height: 100%; + width: 100%; + background: none; + border: none; + color: #fff; + font-size: 18px; + font-weight: 500; + text-transform: uppercase; + letter-spacing: 1px; + cursor: pointer; + background: -webkit-linear-gradient(right, #56d8e4, #9f01ea); +} + +form .signup-login-link { + text-align: center; +} \ No newline at end of file diff --git a/src/front/logo.png b/src/front/logo.png new file mode 100644 index 0000000000000000000000000000000000000000..8ae5c03ffc9d9160d640ba54a6ea5d064cc6910a GIT binary patch literal 1902 zcmeAS@N?(olHy`uVBq!ia0y~yVA%k|Ow2%$Y5vhMK#C>Z(btiIVPik{pF~z5Um@8e z$d`ekN{xY`p@o6r7f`6-1p`B=0RzLU1O^7H84L{K1#@-<+5jbZ0(?STf%Jb@hX4Qn z0~v4Y<~{{dj3q&S!3+-1Zlr-YN#5=*OljOTDL@W;iKnkC`!g0sF>Y(_g*Dq57}$b5 zT^vIyZoR#5P>?}@hhc+Wrl+@2L;Br?lLUp{8c$U8o~9GIDdprO)lmj%fe`hDed(f9 z()5gmGCZk8Z+2@MO?hPIy47yiG~ppR${?)>TT{L1R`Y0yM_%SzvnW#d#N}%&T;Gqq z2Ua+$C9V-ADTyViR>?)FK#IZ0z{p6~z(m);FvQ5n%Fxit)Kc5Pz{nC} aQ!>*kacfAM&ME}dz~JfX=d#Wzp$P!1#ujP- literal 0 HcmV?d00001 diff --git a/src/front/pixels.css b/src/front/pixels.css new file mode 100644 index 0000000..707f68e --- /dev/null +++ b/src/front/pixels.css @@ -0,0 +1,6 @@ +.pixel +{ + background: #0f0; + width: 10px; + height: 10px; +} \ No newline at end of file diff --git a/src/front/test.css b/src/front/test.css deleted file mode 100644 index fe0d485..0000000 --- a/src/front/test.css +++ /dev/null @@ -1,127 +0,0 @@ -* { - margin: 0; - padding: 0; - outline: none; - box-sizing: border-box; - font-family: 'Poppins', sans-serif; -} -body { - height: 100vh; - width: 100%; - background: linear-gradient(115deg, #56d8e4 10%, #9f01ea 90%); -} - -.href { - color: #3498db; - cursor: pointer; -} -.href:hover { - text-decoration: underline; -} - - -.login-btn, -.signup-btn { - background: #fff; - padding: 10px 20px; - font-size: 20px; - font-weight: 500; - color: #3498db; - cursor: pointer; - box-shadow: 0px 0px 10px rgba(0,0,0,0.1); -} - -.show { - display: none; -} -.login-container, -.signup-container{ - display: none; - background: #fff; - width: 410px; - padding: 30px; - box-shadow: 0 0 8px rgba(0,0,0,0.1); -} - -#show-login:checked ~ .login-container{ - display: block; -} -#show-signup:checked ~ .signup-container{ - display: block; -} - -.login-container .close-btn, -.signup-container .close-btn{ - position: absolute; - right: 20px; - top: 15px; - font-size: 18px; - cursor: pointer; -} -.login-container .close-btn:hover, -.signup-container .close-btn:hover{ - color: #3498db; -} -.login-container .text, -.signup-container .text{ - font-size: 35px; - font-weight: 600; - text-align: center; -} -.login-container form, -.signup-container form{ - margin-top: -20px; -} -.login-container form .data, -.signup-container form .data{ - height: 45px; - width: 100%; - margin: 40px 0; -} -form .data label{ - font-size: 18px; -} -form .data input{ - height: 100%; - width: 100%; - padding-left: 10px; - font-size: 17px; - border: 1px solid silver; -} -form .data input:focus{ - border-color: #3498db; - border-bottom-width: 2px; -} -form .forgot-pass{ - margin-top: -8px; -} -form .forgot-pass a{ - color: #3498db; - text-decoration: none; -} -form .forgot-pass a:hover{ - text-decoration: underline; -} -form .btn{ - margin: 30px 0; - height: 45px; - width: 100%; - position: relative; - overflow: hidden; -} -form .btn button{ - height: 100%; - width: 100%; - background: none; - border: none; - color: #fff; - font-size: 18px; - font-weight: 500; - text-transform: uppercase; - letter-spacing: 1px; - cursor: pointer; - background: -webkit-linear-gradient(right, #56d8e4, #9f01ea); -} -form .signup-login-link{ - text-align: center; -} \ No newline at end of file diff --git a/src/front/test.html b/src/front/test.html deleted file mode 100644 index 554f687..0000000 --- a/src/front/test.html +++ /dev/null @@ -1,72 +0,0 @@ - - - - - - Popup Login Form Design | CodingNepal - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/src/front/title-bar.css b/src/front/title-bar.css new file mode 100644 index 0000000..5c43ea7 --- /dev/null +++ b/src/front/title-bar.css @@ -0,0 +1,40 @@ +.title-bar { + display: flex; + flex-direction: row; + justify-content: space-between; + background: #3333; + height: 100px; +} + +.title { + display: flex; + align-items: center; + font-size: 50px; +} + +.title img { + width: 80%; + height: 80%; + border-radius: 10%; + margin: 10%; +} + +.profil { + display: flex; + flex-direction: row-reverse; + align-items: center; +} + +.login-btn, +.signup-btn { + background: #fff; + margin: 10% 10px; + padding: 10% 10px; + font-size: auto; + color: #3498db; + cursor: pointer; +} + +.show { + display: none; +} \ No newline at end of file diff --git a/src/front/utils.css b/src/front/utils.css new file mode 100644 index 0000000..ef2f190 --- /dev/null +++ b/src/front/utils.css @@ -0,0 +1,20 @@ +* { + margin: 0; + padding: 0; + outline: none; + box-sizing: border-box; + font-family: 'Poppins', sans-serif; +} + +body { + background: linear-gradient(115deg, #56d8e4 10%, #9f01ea 90%); +} + +.href { + color: #3498db; + cursor: pointer; +} + +.href:hover { + text-decoration: underline; +} \ No newline at end of file From b26762a4e44e6fbfa89389fee26e435236e96ecf Mon Sep 17 00:00:00 2001 From: gdamms Date: Sat, 23 Apr 2022 13:37:12 +0200 Subject: [PATCH 2/7] feat: ca avance doucement sur le front --- src/front/index.html | 144 ++++++++++++++++++++++++++++++++----- src/front/login-signup.css | 8 ++- src/front/pixels.css | 29 ++++++-- 3 files changed, 158 insertions(+), 23 deletions(-) diff --git a/src/front/index.html b/src/front/index.html index 7d86a64..fba7c86 100644 --- a/src/front/index.html +++ b/src/front/index.html @@ -81,23 +81,133 @@ - - - - - - - - - - - - - - - - -
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ Description +
+
\ No newline at end of file diff --git a/src/front/login-signup.css b/src/front/login-signup.css index a80b99c..e8b07eb 100644 --- a/src/front/login-signup.css +++ b/src/front/login-signup.css @@ -10,14 +10,17 @@ position: absolute; left: calc(50% - var(--width) / 2); top: 30%; + padding: 20px; + border-radius: 10px; + box-shadow: 0px 0px 5px #000; } #show-login:checked~.login-container { - display: flex; + display: block; } #show-signup:checked~.signup-container { - display: flex; + display: block; } .login-container .close-btn, @@ -89,6 +92,7 @@ form .btn { width: 100%; position: relative; overflow: hidden; + border-radius: 45px; } form .btn button { diff --git a/src/front/pixels.css b/src/front/pixels.css index 707f68e..5740757 100644 --- a/src/front/pixels.css +++ b/src/front/pixels.css @@ -1,6 +1,27 @@ -.pixel -{ +.pixel-container { + display: flex; + justify-content: space-evenly; + align-items: center; + width: 100%; + height: 1000px; +} + + +.pixel { background: #0f0; - width: 10px; - height: 10px; + width: 80px; + height: 80px; +} + +.pixel:hover { + box-shadow: 0px 0px 0px 3px #333; + z-index: 5; +} + +table { + border-spacing: 0; +} + +.pixel-description { + position: absolute; } \ No newline at end of file From 2259efb048cc8757da55f3566a7a2f3577330856 Mon Sep 17 00:00:00 2001 From: gdamms Date: Sat, 23 Apr 2022 20:46:51 +0200 Subject: [PATCH 3/7] feat: generation auto de pixels randoms --- .../pix.scssc | Bin 0 -> 3013 bytes .../pixels.cssc | Bin 0 -> 6499 bytes src/front/index.html | 205 ++++++------ src/front/pix.css | 301 ++++++++++++++++++ src/front/pix.css.map | 7 + src/front/pix.scss | 7 + src/front/pixels.css | 2 +- 7 files changed, 419 insertions(+), 103 deletions(-) create mode 100644 .sass-cache/701f7d84ab64cd4a26addac3794c39ecb3ea7c98/pix.scssc create mode 100644 .sass-cache/701f7d84ab64cd4a26addac3794c39ecb3ea7c98/pixels.cssc create mode 100644 src/front/pix.css create mode 100644 src/front/pix.css.map create mode 100644 src/front/pix.scss diff --git a/.sass-cache/701f7d84ab64cd4a26addac3794c39ecb3ea7c98/pix.scssc b/.sass-cache/701f7d84ab64cd4a26addac3794c39ecb3ea7c98/pix.scssc new file mode 100644 index 0000000000000000000000000000000000000000..93f9f881131cb82bb36f8debc532f530e37883ab GIT binary patch literal 3013 zcmcImU2_^Y6vZ0}e8Z6;H@=>rctVi6!`S?x$m zY}dnk`%C&W+p7f@7DFa|2s6M+E1i4Kz4u({^!WL4HGNXCX|q%QmHm;C+$kbII$~dM*54SKo2gcQV3m2#t`~V2>*>}v1ODcc9%OX$=pUqg{$sjXp^}89w7KaT78%Msu4rmq{Up(<8EX&ON8Vdm~_B3BaTxh zc;;}Iftz`vL|@v>lGN>h4{N`BMN(G)}3GaDALTti-)JGGL z6chHUTjjG}5|AV$r(XJ|+!Z}mZqXiRZuu4WU-z5kw^Cd&{}0xLC#P>_r|*8ka3 zAd2>wK^7tWH$9n*sBkaa@`ig&GCXPc5;zSN7 z0q{!m!|90G*gdmB-ob2Q#%uzzvK^Y$qr$XVT#Dc>rZW$BFM?Z&;O-Ae%&4vJu%VJ5 zx$xXb*Gq|gsR;`7c%F*tE>wyq9I8uj4a%>{+Cnk|q}byvf%fKYdPgOvO^0P5jXH6G zVs(*hk-pnvQrQ5}3KBnl1(8e6L@o)j%7+Z~Xd}W95)ay@ZE(;4WnOoo6qQFoYeOGR zFgG1%jOXgX8b2=td@Xs8FDHWiNr0*lrr zbQDk5<|=;Dh}TQGCbi#pq=146^tY@}g}II1?7KE~oSZ&E;9nP>p<|kqon}BHO{nas zMpEGO9IgfLGSH4&q8A_|t@Wvvvh?q)xRWPmXRuUvmDEg;rhx2WNLG)I#$GeINXK+thBOa*5Qn#*8Z&1=@*C41E-ZMsOpI4=mR;sHs z#D&fo9KiSGOqTwNxH3_3VR)lj+yb-(;6axDp142uEo}4T=MY}Ej0t>RpZ(VOHh4Lq zHSY{ehamcF-4E@(oZ2_U4{>;$6B3pW*APMX&XeeYt=4h!1S|y&83RK`G&@v;wskOUPY2L<4v&h928TE> Xt@jUtr$KrUbhP=GpD5$_6yyH@YmE4d literal 0 HcmV?d00001 diff --git a/.sass-cache/701f7d84ab64cd4a26addac3794c39ecb3ea7c98/pixels.cssc b/.sass-cache/701f7d84ab64cd4a26addac3794c39ecb3ea7c98/pixels.cssc new file mode 100644 index 0000000000000000000000000000000000000000..065b81b20086e0a2033f3f0415dd247a89639e52 GIT binary patch literal 6499 zcmbtY&2k&Z5f)G>5Ll1`LGhm!g@6{N{E!5TmPpN9CgrkXrcy4I$x049pccCWauomz z?=D0!F28^ex!bRhyh8FEd4uE?l2f{8=LfSGNMZS)5{5hTb$|VJ&-Bd6;pyRL-pkMU zi_;)DISXH%_FtZcL7(@|g0s#kKR)gCUY+olXUE59yyyL_8k4OHKTQd_OgJax>p0H7 zibK9g9V<}J`g{JuBy zJsOS&T+OQIv$l(~J|6(#D)>I~hy1*~T6CP&F5%+7h%o-OMj9;5{3Pp+V}RJPr@V>N zD2w9J0&Ri^i!AQD%>8@vkrWNNfQAD_3k(j++QC!p++h*f$Rq-llLUen!}v~u6irD@2d*WgWh zmu7s3K~5l}&f8CqZsH+73jJZkM@PSnvM(pSqc=(XmS=zDy(r@VcL_mBxIgILXUQf@ zL7OfL)V=kSQ8c!^jtGQXEb4`}7eD4k`8_zC_=76lpPBFnTu8`8mVhTUx_{oT^#}aDfL&to7H5eBDBqP><9dSzvH8UP)_jrCH)os zHHNEN2v-#Xw56TJ(Nkp^!$lA1p&cI=fQgR{aFi>C0~`m#TW zu15!uVnZx42km+Q5rG{RKcbMDaIHYNCNe_RGmdtYJvU(&fFW!HD8gTB!ub7>HeeH$ zuCNRB-4OO}qcFR1Q>`6$I!|YbdIh2$SZ-)PaAf>&D(eC;L~Q^?G_(vXDI(M+DqUe* zeK$nwH$1w&nUl+PVA>grjlveSUf@~>cFWoo9IY!;Zc$wThN}&rxW2OtJk$nkuF@5D ztH0~5rJ}rMn;NPDzUqR2a}rL>u4*zaW4h3wRosf}c`G4Q_hMSFigTPU<)=Pnpv7k3M>82^($pI8Ok0N>3@9GL{b z469sKjnIvrAN=V$i6^6QPFnBv`~BIpUM{%13}#k!_;9qTBkfFU7l4u422fI$ey}X8 zXbZO1(ic|xQB5#>KUl$M&a7@0s5XI|sbCy^q=H=lhN=yqss2?{#R*11o2vAMmHswM z^@BBBb8}rOa9si0rh;*_stma+*acv?+5npC-!)g9Ft3EAFRb(r?Sii1hVq-0zSm%O z>K{+lZ8NW1audIkhm$v_dKY3>^{zqnnqFAn5Zy?1hQGP_T#D`Diewk}dgo%1+)uGMtz6D|OgP&R;0sDJ4kzzOsA z3F!+f{ad+U_%HtXAR2{vH$23=j+oS-|} z!bvZEVWs~nrlzxAQ+~73KQ)-09n+=b!8K(d?m%>2&A?sclj2SGivb@(D_9dXpdsKI zh1Vg`8)Now-#`27I{U?9#E>|4_HRRYO!ngl&Qo&%fm0DWc9s2)dT|o+AnMYOjm)UEz9amAMXM%Nniu0Bq;y9q=my7rpdAo3+W6iw@cayy@PHm z&sllJz}az{&Vvp4iW2fvTsYyfD8ey6Dda}FoH~xarBW!*acuTw*j=~-x!f_ zhB;Ym&80J}oH#UZE6-WEXW;BG&1io7u_Aw^70#zNqy3+vuvm;36313}AGjNZar6@v z?mPDMXDUuo;b&mRD2$_zDC`0-3fll$;UA17IAfl|(iv9%(V_6Z@|=~wH*j{CjxSLj zc$AGhMvuK)l5 literal 0 HcmV?d00001 diff --git a/src/front/index.html b/src/front/index.html index fba7c86..c0f5818 100644 --- a/src/front/index.html +++ b/src/front/index.html @@ -8,6 +8,7 @@ + + + + + +
+
+ Pixels +
+
+ + + + +
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+
Moi
+
Petit desc oklm
+
+
+
+
+ + + \ No newline at end of file diff --git a/src/front/profil.css b/src/front/profil.css new file mode 100644 index 0000000..3f45914 --- /dev/null +++ b/src/front/profil.css @@ -0,0 +1,31 @@ +.menu-container { + --width: 410px; + display: none; + visibility: visible; + background: #fff; + width: var(--width); + margin: 30px; + box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); + position: absolute; + left: calc(50% - var(--width) / 2); + top: 30%; + padding: 20px; + border-radius: 10px; + box-shadow: 0px 0px 5px #000; +} + +#show-menu:checked~.menu-container { + display: block; +} + +.menu-container .close-btn { + position: absolute; + right: 20px; + top: 15px; + font-size: 18px; + cursor: pointer; +} + +.menu-container .close-btn:hover { + color: #3498db; +} \ No newline at end of file diff --git a/src/front/title-bar.css b/src/front/title-bar.css index 5c43ea7..d3156d4 100644 --- a/src/front/title-bar.css +++ b/src/front/title-bar.css @@ -26,7 +26,8 @@ } .login-btn, -.signup-btn { +.signup-btn, +.menu-btn { background: #fff; margin: 10% 10px; padding: 10% 10px; From 764f32ef9b0ac34b3878151c8cb938a288bd3ed2 Mon Sep 17 00:00:00 2001 From: gdamms Date: Fri, 29 Apr 2022 16:45:18 +0200 Subject: [PATCH 7/7] feat: tous les menus vides --- src/front/index2.html | 59 ++++++++++++++++++-- src/front/profil.css | 117 ++++++++++++++++++++++++++++++++++++++++ src/front/title-bar.css | 1 - 3 files changed, 172 insertions(+), 5 deletions(-) diff --git a/src/front/index2.html b/src/front/index2.html index 4a6d30e..0264876 100644 --- a/src/front/index2.html +++ b/src/front/index2.html @@ -10,9 +10,29 @@ @@ -25,13 +45,44 @@
- + + + + + +
My name is Amogus
+ +
+ +
+ Wallet +
+
+ +
+ +
+ My pixels +
+
+ +
+ +
+ Settings +
diff --git a/src/front/profil.css b/src/front/profil.css index 3f45914..d907e2a 100644 --- a/src/front/profil.css +++ b/src/front/profil.css @@ -12,6 +12,7 @@ padding: 20px; border-radius: 10px; box-shadow: 0px 0px 5px #000; + } #show-menu:checked~.menu-container { @@ -28,4 +29,120 @@ .menu-container .close-btn:hover { color: #3498db; +} + +.menu-container div { + display: flex; + justify-content: space-evenly; +} + +.wallet-container { + --width: 410px; + display: none; + visibility: visible; + background: #fff; + width: var(--width); + margin: 30px; + box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); + position: absolute; + left: calc(50% - var(--width) / 2); + top: 30%; + padding: 20px; + border-radius: 10px; + box-shadow: 0px 0px 5px #000; + +} + +#show-wallet:checked~.wallet-container { + display: block; +} + +.wallet-container .close-btn { + position: absolute; + right: 20px; + top: 15px; + font-size: 18px; + cursor: pointer; +} + +.wallet-container .close-btn:hover { + color: #3498db; +} + +.mypixel-container { + --width: 410px; + display: none; + visibility: visible; + background: #fff; + width: var(--width); + margin: 30px; + box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); + position: absolute; + left: calc(50% - var(--width) / 2); + top: 30%; + padding: 20px; + border-radius: 10px; + box-shadow: 0px 0px 5px #000; + +} + +#show-mypixel:checked~.mypixel-container { + display: block; +} + +.mypixel-container .close-btn { + position: absolute; + right: 20px; + top: 15px; + font-size: 18px; + cursor: pointer; +} + +.mypixel-container .close-btn:hover { + color: #3498db; +} + + +.settings-container { + --width: 410px; + display: none; + visibility: visible; + background: #fff; + width: var(--width); + margin: 30px; + box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); + position: absolute; + left: calc(50% - var(--width) / 2); + top: 30%; + padding: 20px; + border-radius: 10px; + box-shadow: 0px 0px 5px #000; + +} + +#show-settings:checked~.settings-container { + display: block; +} + +.settings-container .close-btn { + position: absolute; + right: 20px; + top: 15px; + font-size: 18px; + cursor: pointer; +} + +.settings-container .close-btn:hover { + color: #3498db; +} + + +.wallet-btn, +.mypixel-btn, +.settings-btn { + background: #fff; + margin: 10px 10px; + padding: 10px 10px; + color: #3498db; + cursor: pointer; } \ No newline at end of file diff --git a/src/front/title-bar.css b/src/front/title-bar.css index d3156d4..e59d474 100644 --- a/src/front/title-bar.css +++ b/src/front/title-bar.css @@ -31,7 +31,6 @@ background: #fff; margin: 10% 10px; padding: 10% 10px; - font-size: auto; color: #3498db; cursor: pointer; }