From e20b2af92121d006766419f3fc5e86df13c153aa Mon Sep 17 00:00:00 2001 From: Guuq <50501321+Guuq@users.noreply.github.com> Date: Fri, 3 Jan 2020 14:26:52 +0100 Subject: [PATCH] Greatly improved homepage and gallery mobile view --- css.css | 31 +++++++++++++++++++++++-------- gallery/css.css | 25 ++++++++++++++++++++++++- gallery/index.html | 17 +++++++---------- index.html | 6 +++--- resources/img/nightcity.jpg | Bin 2111587 -> 0 bytes resources/img/riverwoods.jpg | Bin 0 -> 5609234 bytes resources/js/navbar.json.js | 6 +++--- 7 files changed, 60 insertions(+), 25 deletions(-) delete mode 100644 resources/img/nightcity.jpg create mode 100644 resources/img/riverwoods.jpg diff --git a/css.css b/css.css index c8bae16..aabbde5 100644 --- a/css.css +++ b/css.css @@ -13,12 +13,11 @@ font-size: 4rem; white-space: nowrap; text-align: center; - height: 5rem; } .welcome { display: block; - margin: 2rem auto; - width: 50%; + margin: 2vh auto; + width: 80%; text-align: center; } .slideDown { @@ -45,15 +44,14 @@ width: 100%; box-shadow: 0 -1px 15px 5px hsla(0, 0%, 0%, 0.8); float: left; - height: 30vh; background-color: #33353d; } .infoBlockMe { + height: 30vh; padding: 1rem; display: flex; align-items: center; justify-content: center; - height: 100%; width: 33%; border-right: #454752 2px solid; } @@ -71,7 +69,6 @@ } /* About Website */ .aboutPages { - height: 30vh; float: left; background-color: #33353d; width: 100%; @@ -83,11 +80,12 @@ display: flex; align-items: center; justify-content: center; - height: 100%; + height: 30vh; float: left; } .infoTextPages { width: 70%; + font-size: 2.5rem; text-align: center; } /* Mobile support */ @@ -106,6 +104,23 @@ /* Support for mobile devices */ @media screen and (min-width:0px) and (max-width:1000px) { .name { - font-size: 3rem; + font-size: 9vw; + } + .welcome { + font-size: 8vw; + } + .infoBlockPages { + width: 100%; + border: 0; + border-bottom: #454752 2px solid; + } + .infoBlockMe { + height: 20vh; + border: 0; + border-bottom: #454752 2px solid; + width: 100%; + } + .about { + display: block; } } diff --git a/gallery/css.css b/gallery/css.css index 782f4c8..902ae75 100644 --- a/gallery/css.css +++ b/gallery/css.css @@ -4,9 +4,15 @@ body { background-color: #212126!important; } +button { + border: 0; + padding: 0; + margin-top: 8px!important; +} .gallery { margin-top: calc(3rem + 55px); text-align: center; + font-size: 2vw; } .rowImg { display: flex; @@ -20,6 +26,23 @@ body { padding: 0 4px; } .columnImg img { - margin-top: 8px; width: 100%; } +@media screen and (min-width:500px) and (max-width:1000px) { + .columnImg { + flex: 50%; + max-width: 50%; + } + .gallery { + font-size: 3vw; + } +} +@media screen and (min-width:0px) and (max-width:500px) { + .columnImg { + flex: 100%; + max-width: 100%; + } + .gallery { + font-size: 5vw; + } +} diff --git a/gallery/index.html b/gallery/index.html index 968d7f1..b36190f 100644 --- a/gallery/index.html +++ b/gallery/index.html @@ -15,25 +15,22 @@
x@8FMlcGj8l~-m!1TNM=B$Dhrzxn|1XoyRUM-dYJ8-ePSnSXUxv4yX<%6@A^#~
zD6Y*R=6spck?WRQk~@{RKJWW{>wIzk(C)z9Ul$k`Bp2M? LxjpQMAACNjJ%VQ&KhRsTWv-D8t1CI55Q3qaQjjIkm
z$}gOO061a20as@!N9VOuYaAkGO%N{*4SfZdrZ`ZKyG8#&X`X-E*6KKCo35)KP=Xs}
z=ZN|x)Xpx~>>|gx!QwDoiiAbeyxpX_ yEl=%g~a2x$`MbTyJIAyy2uj;Bp_yMkdtjhLbz
z1-p2T0Lq|7GPTsuNTy(JC^%wMvK-Gie~>c43GV7SXa(v=AuT44nGeWK1lfJdf=;3R
z$#VNb5#ok{q=Rc_ej`zbqYH`whwBIuHoNa+(T%#b+8&2A8HN?Nk`|{6A5rhA00vNj
z2VIl8+vPM&4Jp-apDEW;t+95TM8O_i%EeHz6O~;qx1C@s_T$Fm8rl#nKqp7s;utRd
zZUS?q*pka-oj=7MP$arR;mc>1lK3$(W!C<+S}>=}pygj9%tvLhT7DGRPOMtNFi*kM
zq@9avwCIpnI-MKX#{n%e^Ax)_pzb}E9D+h>e{zw?lMY@GFd1zVI|AXu%Z8i_NI^66
zRZP4%i_HOI1FfmKJ_HW>Dw@KI2!Y@=M=JSDa8+0=FCQViLu$UpdLNX0`_7{`$P}{p
zx{9bPLQCm7er$^Pz*vkXg0*smCzwqLC~yu4Epk8P(Kp(4g}eGYKLrfn`-C(k`Bs
z8w?s$R{QP-(_@EovD1x6*AWJZ*Bxcv2daV*GB89$NIsLB*H>0jB!(M!926LOs}ty>
zpDC!$H2td%vX=~&umF~EL$4Ae5X3NoO|EIgxxhSASwnw1d}Ut{i(w^hAR-4_^%h4`USaqe$mDbcM^s@WD_mf&rf4YjEn|6)kt2k&HHD8R^LSec
z9z(snr)!_O<-Hi-lfJq)wR}@roh|7P;VG2;d0~kPe9`tUY?W=<+_BvFUM>=Z>XG<=
zcj?{rwAhM)%(a_I$N4-G$+%&1zIUZCH|>5QcG*ylWQ~7b1z))qv#7#j1kRlio;C4v
z@2?kAir=nHyIVMurXu{dYRZn<@4r8
#xLav6JwHUo9I@Z;HmW`GXrwZMla)55j+$(PB@ueQ_KUlIn6_J;!Dkmds^A&q
z*rJL;mV0d3u3VDq+!{`X;%2&|5`XUfrn$gpG<{A`=_spUQO>KTJ?D*A^Fs{w*dA=n
zDV7(9zxEN#eY*D`R^qne_nGjx=(D^P_Z#*A5yXEdo3``_svZ0-f
z6{XasT9k)ETR7=U>avPNgbnYytO`3^g&9-IcVrYIVu21p8jG6vO4&V~yV5u)?FPbG
zp3Y{IO}RO&5G8fhQArXhRjJ18fqzQ1Rk&iPvYGfyUqArwhK~m0d~g^QoW+3z%4#10
ziabJ9XosaZN3U*qdO{R6o~l0BT9TvB@XQrhw|0jPmWa*IEj{P5LTcPhsCQzsQ{CpD
zTiIVq%v_hP_V-
z{%|5}xX^F4H2G}J6a8j+kA$tddnuOL$LOf@-Nr>OEL-h=d*RAqc`?6|z%Xps@2YpY
zMf}(C1VQ$Y64xt}zEUfm*<=Q}@$V}3MFk0?oYSq=k<4Y(pQAZq?>cMyp3a|X0~Njx
zt1wUW$TeIXqU^cK?nvK0xYxM+JmK;%=YYXRoL8k^{81rcLqcrIB?qY_ilvi&q}cpN
zjkfG|g}3Qf;0eY!G|d45v2h*Ap>q*w>u5DjCN=LNjK}q7Mu`?49yM$bp$+2$`k#wL
zi)-7({s)HCd)?KBFU0tY=sNdr4OV{$vgAMoZ0PBh4V#A9$EEx-b;EIDb7+;e`=Ni-
zp%d;jg>3|48hnN3^_3VFR(|vCciQOh<1!qr+_v9lR1hCf!`c~RT&ulJl#7>$QM9;*
zs)kmqhSibqy6uMzsF|k7ZY7KL9tkUSwlXn
>}`wd3V$s6^7$-(;q>8Co?l@7
zylkqbn{i&brjtHDV?%q3WUm1tVNvZ~3n{gl`qQRPXwPif!&L6A5#(ZU`OmCh74>yz
zb4>4Gw%jDHS@Cv?y#K`OIrQnXw-;I)(Bf|8zN$IL->Rjg9T>N<*A~PMC7dbxM)u|O
zaJ!`PE(P
`$&2ahKTPZhLCxf1bOtnGjU*?!12E76-J*
znRgJ;zuEiw#&H^PEWV+V*-`5^pW*k|RNbCMDemUa&ytjK_mnFKk^)mQ9#<8i2Jxt0h$}cC%
zca-16V7|zItE%(#eyil>!g;AuQcjy6lDJj$!tL@HGw8-{VnLi`##n<)YQL>{{IzmY
z74)&tQXo+zW}lmIJM^RTeJ683mizhIf8N#&X=DRy6ZiBMlqTvvL^b=3aob;?Y&OX&
zrD;_yj}9~$IZqo#9OjisyCa*{7Z`rZC%$-aPF`9mH((T;cRD|J@*lG5`YOIq