From c27f05fea8ff04a5b882c97e05d78096121e2007 Mon Sep 17 00:00:00 2001
From: Aelita4 <kontakt@mikorosa.pl>
Date: Sat, 8 Feb 2025 15:02:04 +0100
Subject: [PATCH] Redesign resource bar

---
 public/images/resources/deuterium.png      | Bin 0 -> 1222 bytes
 public/images/resources/diesel.png         | Bin 0 -> 1153 bytes
 public/images/resources/kerosene.png       | Bin 0 -> 1129 bytes
 public/images/resources/oil.png            | Bin 0 -> 968 bytes
 public/images/resources/stellar-quartz.png | Bin 0 -> 1058 bytes
 public/images/resources/tritium.png        | Bin 0 -> 1508 bytes
 public/images/resources/uranium.png        | Bin 0 -> 1088 bytes
 src/components/NavBar.astro                |   2 +-
 src/components/ResourceBar.astro           | 168 ++++++++-------------
 9 files changed, 68 insertions(+), 102 deletions(-)
 create mode 100644 public/images/resources/deuterium.png
 create mode 100644 public/images/resources/diesel.png
 create mode 100644 public/images/resources/kerosene.png
 create mode 100644 public/images/resources/oil.png
 create mode 100644 public/images/resources/stellar-quartz.png
 create mode 100644 public/images/resources/tritium.png
 create mode 100644 public/images/resources/uranium.png

diff --git a/public/images/resources/deuterium.png b/public/images/resources/deuterium.png
new file mode 100644
index 0000000000000000000000000000000000000000..c063598363dbd2bd3440d021fb21fe625c1e6766
GIT binary patch
literal 1222
zcmV;%1UdVOP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800004b3#c}2nYxW
zd<bNS00009a7bBm0002&0002&0eL8Ky#N3J8FWQhbW?9;ba!ELWdL_~cP?peYja~^
zaAhuUa%Y?FJQ@H11Vc$gK~z|Uy_acBR96(of6NTb1`IgS5NrvyK)|K8l_s*-YKx%*
zMB1d(YSIr~V%wytO<IkqZHVa}sm2&3e!xa;l|>O*5=*B*tRYxTX(>%>2SGtZ9A;r4
zGxKKc2Rnp;c>^@SKY7W!@0@$@FXx_j&U^5m6bi*Tz`qn%oK|}=u&*p|<8(S(BvR=s
zU!3}$7)>0DrKYpralP%Q)ENN4X|-B?NMCy)I{on{77bwZ-f+-(Du6I<vwf<st@+x1
ze;9>Au_yq>+x@uRZnu~{My^me%FE0Bi>1=iQh&Tw`)goB$uxj*!Rb7Fu&m7Q^?K3k
z_4s_gMTvwM0Kk!ffdOA(VIjrE#aJwsB?lOhN+c(no13Yqs6eaLE;#^#An4=b;(XcJ
z*;G|kv3biDqN1Wus#I(%E~cre34_59($?76h{0f>y1IIXt)Za-v)LT9SA+=IR-hR`
zsaB)gzJpv{5pI`&zV<wA4VQ4cT;Xjh70++q!6sc1Znuk;x>{Q6>u?DIF&fSF@v*U|
z!U1Fgot3}*Mp8;Dkx@~>5pp;%jf}87F>zitmmqNT<9*bfI@#g0+p{3J4osC9AUZa7
z#v%Z6rIN(t<d74?*`nlfV&db2o`uW-zye^iT1CtYCozDrh=>UPxOH(~!EgXRsZ3_K
zg{T3>yF(21_v5tNXI<Ru@nF0=^uGX*%4D|jX-6=4vzLOjWL{X8M*gamv^QTCU3mER
zEnZxoPC;5SZ{|IN;Bd?jAVMOs+NK?WePRNDOFag*zEr}A&ku+KRG&DGCVm;GuXND=
z_g}QuUkvFd3V_dV7R!OyW$~=vn1j_cDmvY2Hj%P+9T`t<AR#FU%V=m{Q2>wEV+@r8
zV(MzY%I_WRbM~Jdz~wU9Eao}2!egcTd0UsquKZ^?e&CaZ0RSu(lgT4yyf-+2N*xWr
zoxVQ4sjB6@&%WZv^VI;T)Y04@8bWY5uo#V~qGLj?BUT9kEMq29Pz0p12kzT4Qkbxf
zvG?#%0KPnP4woQstaLw{3W@+I-1#bR>7HYAqL%pOD|ouFX#M~;OK|6UBx5y)YU&W2
z4wBQ-Nm;XY(stydy;w~qUfZ(|fYlo^xzP0|hMqroY-85shi-JN2B}0c5tt{|i~wGa
z(Zro;88Xgn2Gi75U&o%EC6w%Xhn##JIr%zKU!TuMPj_ef8@ahRV3r)PPmG6)(4_w9
z=_cXfBz~x_r0m1@MT-u=gl!CcRaHV@94-QxK<AYaD@wI`E*x``zP5&gAMF0tY&5<;
z8^EJLZ_|x_R;+wz!2kd}QqQU^rScYpKLRT(d`lkeyUFf?g6zO}Hh=|h$(Jk7(tYjP
zyK@2X$|55j^C`!3ksm)yIr^|!E|tpewAR<9D%I+6xiT+xUH#eX@py)3_k5tdNV$B3
k1^hLaD-^xJn!pDC0)VhNM?17(kpKVy07*qoM6N<$f)PSJ$N&HU

literal 0
HcmV?d00001

diff --git a/public/images/resources/diesel.png b/public/images/resources/diesel.png
new file mode 100644
index 0000000000000000000000000000000000000000..58df3f452466ca8c1d9e655268e3d7ac1585fcc7
GIT binary patch
literal 1153
zcmV-{1b+L8P)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800004b3#c}2nYxW
zd<bNS00009a7bBm0002&0002&0eL8Ky#N3J8FWQhbW?9;ba!ELWdL_~cP?peYja~^
zaAhuUa%Y?FJQ@H11O7=wK~z|U<(F+tTU8jxf2a5MwzQN|ESJ$m=LR@HjgmFs1_{Yj
zB<R?jx)_297-Q5W1N|f)j57<#7NSf1rY@P9&BUn_ln7Y_gJUqm*kp4~rhzfWOBNj~
zlv3LJ;s*n3vn`s~k{JKr&Utd5|L>gVoaf}i|6L-%`MkiI+r$juS0I=yfO5BNJ(g=r
z5vCBjCP|^#ppMC<;G8+HYxe_FOY?G~+|y+1*6nF`D9>lCA~n-%b$Zh6v2hcq`{Db!
z{y(mk0If^&iQIuak8C}u36TLHBq=U?RMT_?F%*bK%84mMqR+slqN1Xnrluy@>-FMt
zxt0Uv<>jGJD3k###(uB_AX}~0msM5WVX;`$NF)+AO*6c=dG9;>-`&4uYHF(BpSVXN
z5hrj@PEL-HWf{pLEyo5<4HzD`=d5n((}6&s-7t*z08Ic+RaMXX{r<Zu9<30W-b{oL
z$g+%ogP+UemzkWL{FfVZL&0E>*0$F9-rnA^*}2(b;q&<pS5#EgG&VHiaeELV(N(#%
z_B8JaANlOa$Cf}Ku)Vgn7Q5X}<7<tSm6vg}^=Q%ocD}OHzPPyftZ+CS(Vm_jIXx{M
zObCa=xLhtQ7E970^78W*<NAQjX2WK)CEa*Q0%67hG`!lt;OW8Tam&6IHa@g5sSt4h
zE&EznSXfvdyWQ@jn%@MVC<=<AB;7PtaVKq8<E|CE1xu0vB9RDfU$wDH_40UC6^;}K
znx-Mk@o&|{!~|X4U5t;9psGGfOUo!MD7-0YUtb?T4xM2(FvHq)c~m}DdE0Udr^BIr
z@Me|tb@xwfD9j=fH8^qZcg~Mor}nve)~_!h7!1<&Z3q4Ry*#}+hr6>=xjGZ(i|<BR
zedjv1Zrg#Xs*H_Y;*-N4;<81lDE8rUSh+AZOZ)Lrs;i%*xMUNGqA)acnuq;9o_XO7
zO{6)k#_;<ELiXItOK%Ty>gQ=*uPde~KZ`>h!;DPK<4BPxdmxJ)kL00PZ}fM=H0eAs
zN=N?$*XN^TXV`ga^IA&o%Z^*+%v_j5-~7Uvi!(@)ME)8V^;-%ksyP%75S847!W!;W
z8!OR~*F14Ri@ya{DQ<-;p*Vp0-JKjia|Hl_;NV-8ls&k5<p2)uu1u=gt(5#1=kEY?
z12o+PQ>T7+C%Ib>@aeJPq#J9xfnk`)tGsD}fs3K^Qvd9Vmf+;MDbmxN6VlA=LjS;T
zk-E}cQ)H?tLQ4KyaAEWsFE)2auT0Nu695i}RP9Q!f1d7?WN(Jc#G)7=%tRSl1nh6x
zHviF=1GbLdVd+{Rv>2FMsL^%3J+|FgfIJ{IQN}USfwO=QaPrqLnvn#b|DgT^dsScn
T(5k3l00000NkvXXu0mjf=c+3=

literal 0
HcmV?d00001

diff --git a/public/images/resources/kerosene.png b/public/images/resources/kerosene.png
new file mode 100644
index 0000000000000000000000000000000000000000..02d9209480ea3cfd584f652df0a7e0d3da53918f
GIT binary patch
literal 1129
zcmV-v1eW`WP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800004b3#c}2nYxW
zd<bNS00009a7bBm0002&0002&0eL8Ky#N3J8FWQhbW?9;ba!ELWdL_~cP?peYja~^
zaAhuUa%Y?FJQ@H11LjFYK~z|U&6jUzTU8jwpWJhsbMH-Jmtt3%2HUbWm^PNW55vM_
zqjomTeQ@N%U>kE5ZR|k9D55a8rHXD&ilCdYD08}f2yT{Pp>#zuYh8yrP&#Ty!eGpd
zv?6W#FS$u>Zu}q#Nq2AaXYKTX3+LvX`#!(JdCxg-fd8r708)7#ch>lg0Bis>#Tv0{
z9cD`l%x1G<UoaR%&_9uWt)o;sVK5jpk>yAn8qGi?67d2U1t8@EV2UMPDVAjq?B4x?
z_L^@%@AY~rx?kPj)zDCXg;H%;uh(A!@FD;~_50O=YjhPVJ;6*%5cs`2I<`^I=NA%}
zFAs_i$1eWN=@0dUF!1@t9799jKR@}0pK_emySTXA1wbxjVs7Ng0iNgnrj&ld^IY`z
z-+ZZ>n(74r-GU%^I7%0qtd{w{zBlC?<3p*R#s*VWRh3HswmdLNC3i|`ugO%^cj=oi
zbd*v>!l~N<3=jJf#tr4N-QG?+?Rz9ymfHZ_1W*RRuGi~agpg-Pf4HJ;YuhPCMX?^h
zbaot~5PK`nbLTF6{h7{aELSu?_oWxXU<ikL4wBYZ8_Ti;axy9Z84Mj@7>$b%cB3Ro
z*W>X-pt;GitFFG5ULCo1Hx`SZSQ$$x2RiocbqFR?6`pF@rU(E4eeSn1ZI0vMayeO-
z%gIhn`Gw(O-|OEEj&#q?&T*Zc?PTo7aY+<o-zvpXOhShIyE$%6jH&{t$!fL0YPFOd
zKKxpl-+u?SwPqZ5pGvSS>0%fzE{fu@9Iv7sijc*!36xTtJaLpifBw@-Q527^9J8(f
z*|I*_Snyak@*l$w^W;b|2lOrNFtj`e00><?g2vvn1=D9M(C<X`{`WKQp^HZz7*o^|
z1p1wswj7J#{#WlHHgm5exS|09{Z2IYp3Oik`ER1SJb}5P(~y?J>kp7NPcMh$AH&BV
zwBn6dYB4|Jfx_~xEkGIq03vrMA*2>z-%*X@Z#UzK4a-=X`ne>4Rc}KzMSmH<nRlD<
zQr9>L(ct8<ChT*K0M=*LA0R$E1BhWvPe*b4`aA$&a&s69Gk-zt@?KK_!U>2*5;*nI
zBs_Ib0|55C_bVQ&e7pqv5>7%Q7+~CDM`%_=SV~|n5l2LnP}bZ5Aa|=4qLOkzw|OUO
zv;tf=1_6x*rgjH(wyil^wa~+>Bme*qY}+B&w&(m-tU0g_mr<$5cDCI3uP>vXo`X2l
z^YTN_WTliUtVdE0tXA5UoP<gyw<bmv%_=I4MFGUZbMr|kSInwP*N<v-WH`J4LKrET
v%>TcnK@j-+SmWel7)CM}4E@DS>XGOl3apksZg@Il00000NkvXXu0mjfFW>$<

literal 0
HcmV?d00001

diff --git a/public/images/resources/oil.png b/public/images/resources/oil.png
new file mode 100644
index 0000000000000000000000000000000000000000..495e8b1071c0653b34ac591d277b56ddf8a82ff9
GIT binary patch
literal 968
zcmV;(12_DMP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm0002&
z0002&0eL8Ky#N3J8FWQhbW?9;ba!ELWdL_~cP?peYja~^aAhuUa%Y?FJQ@H1164^x
zK~z|U<yT2)6HyrcCX=LTCyPz1k+@W<Q7dApdsRFX5w{{*<DoY_SaCr-2%;V$f_Uhm
z2!hK&!L>vy9^AkRwpFn%ShuLyB`(!WZB3e_(_}I;9%7qJCN*!gsNfF+!}tF8{onlW
zpZ~o_VHmA*^D;Let&^kFMf=ek&Y|W|sesezq<vwXivp&o6;PDLms)6PY%&%QsE?kA
z?!E-Pu`#^M?RE>v<JwdbHmoh9fPHF%1Ar%@O9zhy;G_U__37>axRpGpN%iJq+7<w>
ze?`F0jq(U0-=aW=a-X$mxkN%6?Cl{6|MuB~w6PQ!_|ukFRoRNlf-o2EAR*wm5K*9f
zt8K#VYv;VFxS|LFK!8+b$YzL$N&N&0n*i)h#s7K@q|HDkD;lT6{2~MFRvLUX2Oqyi
z(D*!rS6)svmns1THXU|Vm{Bq@D+$d30Bl`tL-Xqp4xIT6uP;K(N&FW~pP<LF?fJ6c
z{e1ixu(?x>IJ>71#S?ReSAf-|!J!SgFlEb^@oAfYXC1Q63UdyPnl0mzXC_N7k${a$
zO~^IUGK?31Q@44XtdD`0Ye1e^i>g&4hev>3OJV6uWlC!sd9<?<+I%7|G{qF-<)yjM
z>xTTv$OTNYYrz=gM4x&jT)3O~?Ak^iAHIq*AI6};<T2U5FTiS|71)t$QSh-uo8SfD
z=uKr7@-51_ss)7m<^AaMHwlkhMTOtvRslZ0+&9Q6{ZtER_wf*ucn4B_`gk=;W=tEz
zB?<6$B?1Z((At@~A7m8Z4~cm4E<t3o#Ooo@8^rFNRam@W&fwVS+(fN3dqVJsl*^)8
z005l05rp{T;|fM;Fvp>R>)>HD-g`9YGqaG!xV$)>C`veTg(acJkX2$I?{E#gvwi_F
z5t!|WcfolM8myng^*b$K*-k7e)?!Dw9{L}>r>2g@&4&RQU$^hm{&aCv?S^X>FxXaZ
zhC!cx8W$B&UHb*@2IUSpEW6?5dto%a<WRAY!Tcfv#^lq01iWV>XnGOC`TA~j1v0OD
zvi<e*Kw5C|%F4AuG<u1IIL1eb1Y|MBiiWG_>QeE4^H2)>&&TqCyJ26@zn+MIqPj`^
qvW=E{Rd++iG=hXzjg|hBcf;?$oI=snnyEGb0000<MNUMnLSTXg4ahJ6

literal 0
HcmV?d00001

diff --git a/public/images/resources/stellar-quartz.png b/public/images/resources/stellar-quartz.png
new file mode 100644
index 0000000000000000000000000000000000000000..ddd727920d438858c3ec6ebac50bbab10dd7ebe7
GIT binary patch
literal 1058
zcmV+-1l{|IP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm000Ei
z000Ei0rlH}(f|Me8FWQhbW?9;ba!ELWdL_~cP?peYja~^aAhuUa%Y?FJQ@H11FuO$
zK~z|U?UhStoK+OZfA`++n{OuRRKi4)F^XbMeJsS%)SzxGZnO(s#Dzgn<085dVxg!}
zu_A@K6ST`h1*0NZYE*1DE-ZrDSW2N<;wy=XlcaWD&CGnS`&}35OiVj7Ws>a7SzRvw
zbIy<R;J~K+-%YH=$^YQt=VdPUEGBB|FH&76)YB*4+<1V)I|C77S!Yi-)I_)LAiRIT
z#1?+)5d%jvjdZfr<l%?A4^dvUjK7G!dq-W3>Fz~8_$0zkh%nK4q*=U{E8rjA8Bkud
zs_wcRCn^+H1WI8)@*-HyGEC^2*!)DpDp;)~_YU<9;$~NTgrG7vg?58gy5z-aWY_j(
ziRFk;$i2Y6dNEsSL6HCD8#fyo>~;W*wdJbh0RH)t%a166-;cxGsjnNwYzbh?Yo!H$
zA>)^3a^PG?kT2E;o%;i{55FFRi|36MiiXqLQVRfN%$g1VS=_edR!BGz?MbJO%3#hM
zLFf_)F)3b}%5NBeWy{kVw&|ry#EgyfuWkWApqIEj;}gx|wY-KXdA#~Gs{RrgTTxpu
z!>J7g&@pusu^c>Vw8fUHJ;g>>pkseNFJr0#5SjWKW7RsVE!R7<E&%V?Q%_Vr87SuW
zw*6dqb?Y7gW!qB#VIu<jas>?M#J+{nngR6Z&%7?W?)g;q+?x!_?p@0Dz6{<@P0BW_
z0HAe!08<5!&CA~uz<vMD?V9i{j1eL%lWKElQwVE5+iNEi_W?wquJ3HuX5g9t4cAan
zzQxRZE1CTsYc>l}fCwT0Vui94LJ;Z*YyoC<C8{&v(%!WH(4+z;A`L*~V~h_{)}~Gt
zmXL7^44D5+e9bqeh=k(g%?A#w9l-NK|H7rfyHLaxV1m`<ZdU?fTNrso2r1Ai&Sb{`
zk&NvgA0L0b89>u>TzF$^e^d%S3QO*709GPKTteIph@2ST^&jN+zdpn9S8jr~9M1N>
zK*hek`c+A%)17^NedU$`s#Y9LJ{Od{ccV&>1Q52xpSxaWKGlCs-yjI^Jnx;s!NFJ7
z3;<yEBMWZ(!O-q_Xzr#*cg@`RSS>*&lOdbUl1in}S`&sLT5Gh{xUNe&oxWpuczAMM
z096|s8{3n~WWLJfaukb2JkJ9_N=bKj_i|7nP)bEgDV<0pCPqd^9%vM=<!d-KHFd-E
z^fUmrZJT5=S&ql!za<ihFFHFrKXx4F@1dcghUa(P0FLAQ*wfQ9X503AqobogwCcZU
cn|7uB3xq;?S`(c#RR91007*qoM6N<$g3mGTOaK4?

literal 0
HcmV?d00001

diff --git a/public/images/resources/tritium.png b/public/images/resources/tritium.png
new file mode 100644
index 0000000000000000000000000000000000000000..61068f30923749a94680eabd1a5dd6c49d0ae4b5
GIT binary patch
literal 1508
zcmV<A1snQ_P)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800004b3#c}2nYxW
zd<bNS00009a7bBm0002&0002&0eL8Ky#N3J8FWQhbW?9;ba!ELWdL_~cP?peYja~^
zaAhuUa%Y?FJQ@H11z|}<K~z|U#aC-kRAm@`&e`2_*$WFxy8;&G45(;O%4C8Y5ITkh
z+QhhN$vEn$2>#fqri-_%m~kp)rkWU?ewd*St}|&y3{HxWg(e_3!%*0iRRb1HVBKAo
zv*+taLhJ=N>p0Uh^ZhvA_q@;hoO8a*`vKB0gXj5XilRgSWTHk<l*sdZ6M%Rr!ju#e
z$8o2Vlan*HZ{IGH%jFYt1wlYjQIWTyp`ps{b}yMsdt$W*plLcLH8oY1m6auhj;g9E
zSz}}4R4H6ZUjV=wilPqa^?DD(FcT6z9uMqxJ3|Or1EBO#832IUa=H9adV2a?lgSj6
zV6j+GQ&ZC@2*PRrZ6Rn&1Ix1IX0w@$2ea8sSe7jhMU#G%28~7|G#X9K|7IXJHy3uh
z{p(O-WFc^;Q52OwI5;?^si_GS6%|NGNPteK8zod%S0gPgt$ko%ph>EzlrIp^FwAj^
zqO7s8v9nTAQvM63eZx79!=62RJ|cvewOZ}l0A@%v64V?`)7xm89$vU`;ZS*bIq`bE
z<4!<-WM^l)Wir_?P18FhzNqiZuq<22vaGOg-#*Dn{ZUp{MpP=5hh^DH0G!n1a+O+r
z1^~&=&nH%^l~}D-vUl%Zl9-f4wBg|-F)4`@7Z*z!D=aJ|0Ek+xJ_{*xPA-@43XhER
zu77tcnG!Q~^pKenGnH)Ex`TXj_$b-1bw@~J>)v^vXd@!LG)))z=kwnQXVEfQ+wO0V
zP?^hLg(!;X>bM2~h>eT)nRKC!Ri8Y8_wrVXUavO+z}27zIG!&}od4V#B|rWY$`&md
zo0l#kzt`6tb-7%tM*7B{hMZRrR+{p+1SGe0cHpnB8)J+rk+dMip9WDBaph72bOr;W
zW2Xg-ugEW?n%Cy#0#E~R_>X7G6$<fOZ$GJX4EwZ<Wv}=Y9U5&oIeWX$hjVezLyTE3
z5dcIcmy@Ccr2#s>_6-ubLLmZJJd$+m`kWg#dk*20$^hq|9XW<N$1oU<!xzWPQFY4>
zb(q$NbG`i!{8Cwg!?pD=Z7M)n$(I2-496iZVGaTCOfUlmeN^;A|9i*4007|088b00
zekL6K{Xu#9=x7RnA(#PH#wa8kXltm4Wq%27U%wub(FZvc!3=cw*la|K$mP0=ShwhT
z9QwQ%dB*v;Ywwk8pu4L}1aK>uf%EMx%~b#0JClmIocEDuehXz68*$$;h-<Aa2#bgS
z0JPTqhO4bj&^&k^i-CK8<7#UQ1>nL+-`HhX%W|CK)Ul&#)24!;i8+o3%k!9LOvAJ3
zFW{>Wwm}~qgL%d@C>RD=rd7yax)?0aWB0)$0r96SWnfs=>2|qB4fy}_U5`(nzSGih
znNkEPKJB+}Au=i&G)<%a=V}z@WZ~1p7Nln{8|BzKJD}C+5Eh~Hi4}&2@mg{s>9Tef
z0oXax?|(S7c!q|yusqK^y&yHffJzevilT7uP9HYEyabU31EQXYg-&mPRu>5X(CTzx
zc|IW4vcCjpPo8jl1z{xs=XeHOf*|xZpRdhH&t699^acdO-QHfbHPnF+f<N1@AZ|_~
zV&lfY2z7N_!?rcAi!P`0O#nVMW3XjMDV6FIk3~o296Wb{^51Ym#gNN|^_fOu>+Cq~
zbUI(ezq{!uf>kQS>2$2V)6;GHaN}Bd1>vESi=v34f(@`)JA0f?r^!D#Fn)pH8TNQ8
zdv4xb+tJ#}WaKOdEeoZ71w^kG9~W%Ind9HN-7Z%KfE&ShlkI%7l`2*3{1-B{D>fB|
zWZ;L=Z%}>m`}=OUD-FP<kb?aXr_yM;G0C;uzwt_CAAqMO6aNQcOw!VsyR`HG0000<
KMNUMnLSTZnM6jm-

literal 0
HcmV?d00001

diff --git a/public/images/resources/uranium.png b/public/images/resources/uranium.png
new file mode 100644
index 0000000000000000000000000000000000000000..6b96fa215036ab4141a1a3527b6a979ef36ac7ef
GIT binary patch
literal 1088
zcmV-G1i$-<P)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm0002&
z0002&0eL8Ky#N3J8FWQhbW?9;ba!ELWdL_~cP?peYja~^aAhuUa%Y?FJQ@H11I<Z9
zK~z|Uy_QQ*TU8i<zjG6ykN_o6OmX_KHl!)JI0~kYduQw(M_b*vq1B;9UFcG`F09I9
z#FfLM?aGZaDBW4dVSqBNGtkEjL$yLknm{fIB)Q3j92Ybg@}g-%&mxO+{(HXf|Ihi)
z1ommX^U>wro{#%S08uQ?v|n%uBS5$7^)rX>&rFRyH-QYeVEd=5m_$VdzPR#1e<)Nt
zL{`}abh$j9=KHs%$M;QOa#`(lxK@Vz-iE}QR%^~)7YL72b=x2Ob!S&4Dk3nstoBO8
zh@wd0><F5Jk1c4cb-Q8=Jw{TGbvsnmK0i0NBT=@%gjelDh+&?TT~Q<s*9w^uh91Mv
zqv=m}Nt7ipxvchP!qY=hB(XMyWq$*DAdv~rkto`ud%-0lZ=Vl6?B?pC8@try@jsS?
zEvyyV=6j{maG!4F+F}Rx>KOh*W-<L?8v&;^-!@XfLdgQf-~e-xR&0ua-&_aBVx*cj
zx&3aAgcQ&}cK!NbNk>o!E)k6RPx9yL5$=XwU?tE5uWHbm*ojfLB;8lN@s@??fixUS
zxP-+r|LM^ye7E2s9J3HwIS4Orz>)Z_7^w(+9aeM0W8<@%L!$%f`KPMDUS)rK;ypyN
zinZegG#Ox$`NAZKe%ikr%$&@5u}X!{Mp{WFs#)KxftH+hD+=FJpxBv@{;Tq{*M%Oh
zVMDXRsr8cKMFomw{)^ASkAJ_0Wm6K}s@aAg%bR^sctL@^%6@a@D3+}h(Gy8H^lX_I
z6qxX;eG)N{4<1a`F&l2>-m0Bw*aFQPWx;a<KL7UpPg1G7S4^f<4t)4w7uS~D)TdH}
zSL?T1E&nt2)Nsgn2YN1Ex}b&X2EB_7`l*g!m7@ILN;BGFzMg**o03F3Pz@(G;AlMG
zekH+o1bQxBx_}Tr03xzhTjlrF<8%c{OZ*x*$)m81P>Ts18(`h42pqta2~SV1X|?!$
z^+fDu#sUt0^R^QV*uc3C)v1cX0n7-|L7ofu&w`C<t&MrL0e`R=UW$Tsv!ZYS)4iFg
z@zb6+nt(Iei`9{cB)l&CZ<&xUCh~k<9vq(BfqS>6Ze&XsdK4ob6P9p-#??6f)AdLt
z>p_%U#`)FIv%+@-vLy^XilN7Lf-E6}MxUN3v7LFD@Ld9FiS|y_X6Uh;<FJGb4le0&
zpWAAdic(hD3km={xO02F-R*8h2v7D}oo1LDeaTOkd%hXSUaOb@!2I0YxTCW(`(jD~
z{l5>7Rt#QH0APN0_C|(;%={bmJcl@Y?%crH^XL2a3-BK*<-^yoOPLb@0000<MNUMn
GLSTXy%L>f^

literal 0
HcmV?d00001

diff --git a/src/components/NavBar.astro b/src/components/NavBar.astro
index 1dda2db..ae8db23 100644
--- a/src/components/NavBar.astro
+++ b/src/components/NavBar.astro
@@ -190,7 +190,7 @@ const hasUnreadMail = await checkForUnreadMails(new ObjectId(userId));
 <style>
 nav {
     background-color: rgb(56, 59, 99);
-    border-radius: 10px;
+    border-radius: 10px 10px 0px 0px;
 }
 
 nav ul {
diff --git a/src/components/ResourceBar.astro b/src/components/ResourceBar.astro
index bd2eb53..b729649 100644
--- a/src/components/ResourceBar.astro
+++ b/src/components/ResourceBar.astro
@@ -35,6 +35,12 @@ if(!(planet instanceof SystemManager)) {
         "hydrogen-tank": "hydrogen",
         "oxygen-tank": "oxygen",
         "helium3-tank": "helium-3",
+        "uranium-container": "uranium",
+        "oil-tank": "oil",
+        "diesel-tank": "diesel",
+        "kerosene-tank": "kerosene",
+        "deuterium-tank": "deuterium",
+        "tritium-tank": "tritium",
     }
 
     resourceArray.forEach(res => {
@@ -53,21 +59,27 @@ if(!(planet instanceof SystemManager)) {
 }
 ---
 <div id="resourcebar">
-    <!-- Energy: <span class={`${planet.energy.consumption > planet.energy.production ? "prod-full" : planet.energy.consumption >= (planet.energy.production * 0.9) ? "prod-almost-full" : ""}`}>{planet.energy.consumption}/{planet.energy.production}</span> -->
-    <div class="resourcebar-item">
+    <div class="resbar-item">
         <Image src="/images/resources/energy.png" alt="energy" class="icon" width={32} height={32} />
-        <div class="text">
-            <span class="line1"><!--{getName(lang, 'resources', 'energy')}-->Energy</span>
-            <span class={`line2 ${planet.energy.consumption > planet.energy.production ? "prod-full" : planet.energy.consumption >= (planet.energy.production * 0.9) ? "prod-almost-full" : ""}`}>{planet.energy.consumption}/{planet.energy.production}</span>
-        </div>
+        <span class={`res-amount ${planet.energy.consumption > planet.energy.production ? "prod-full" : planet.energy.consumption >= (planet.energy.production * 0.9) ? "prod-almost-full" : ""}`}>{planet.energy.production - planet.energy.consumption}</span>
         <div class="resourcebar-item-tooltip">
+            <span class="resourcebar-item-tooltip-title">Energy</span>
             <span class="resourcebar-item-tooltip-name">{getName(lang, 'general', 'production')}</span><span class={`resourcebar-item-tooltip-amount`}>{planet.energy.production}</span>
             <span class="resourcebar-item-tooltip-name">{getName(lang, 'general', 'consumption')}</span><span class="resourcebar-item-tooltip-amount">{planet.energy.consumption}</span>
             <span class="resourcebar-item-tooltip-name">{getName(lang, 'general', 'balance')}</span><span class={`resourcebar-item-tooltip-amount ${planet.energy.consumption > planet.energy.production ? "prod-full" : planet.energy.consumption >= (planet.energy.production * 0.9) ? "prod-almost-full" : ""}`}>{planet.energy.production - planet.energy.consumption}</span>
         </div>
     </div>
+    <div class="resbar-item">
+        <Image src="/images/resources/stellar-quartz.png" alt="stellar-quartz" class="icon" width={32} height={32} />
+        <span class={`res-amount`}>0</span>
+        <div class="resourcebar-item-tooltip">
+            <span class="resourcebar-item-tooltip-title">Stellar Quartz</span>
+            <span class="resourcebar-item-tooltip-name">{getName(lang, 'general', 'avaliable')}</span><span class={`resourcebar-item-tooltip-amount`}>0</span>
+        </div>
+    </div>
+    <div class="horizontal-divider"></div>
     {resourceArray.map(res =>
-        <div class="resourcebar-item resourcebar-iterable" id={`resource-${res.id}`}
+        <div class="resbar-item resourcebar-iterable" id={`resource-${res.id}`}
           data-res-type={resourceTypes.find(x => x.id === res.id)?.type ?? "solid"}
           data-res-id={res.id}
           data-res-amount={res.amount}
@@ -75,11 +87,9 @@ if(!(planet instanceof SystemManager)) {
           data-res-capacity={res.capacity}
         >
             <Image src={resourceTypes.find(x => x.id === res.id)?.icon ?? "#"} alt={res.id} class="icon" width={32} height={32} />
-            <div class="text" data-resname={res.id}>
-                <span class="line1">{getName(lang, 'resources', res.id)}</span>
-                <span class={`line2 ${res.amount >= res.capacity ? "prod-full" : res.amount >= (res.capacity * 0.9) ? "prod-almost-full" : ""}`}></span>
-            </div>
+            <span class={`res-amount ${res.amount >= res.capacity ? "prod-full" : res.amount >= (res.capacity * 0.9) ? "prod-almost-full" : ""}`}>0</span>
             <div class="resourcebar-item-tooltip">
+                <span class="resourcebar-item-tooltip-title">{getName(lang, 'resources', res.data.id)}</span>
                 <span class="resourcebar-item-tooltip-name">{getName(lang, 'general', 'avaliable')}</span><span class="resourcebar-item-tooltip-amount resourcebar-item-tooltip-avaliable">{Math.floor(res.amount).toString()}</span>
                 <span class="resourcebar-item-tooltip-name">{getName(lang, 'general', 'production')}</span><span class={`resourcebar-item-tooltip-amount resourcebar-item-tooltip-production ${res.amount >= res.capacity ? "prod-full" : res.amount >= (res.capacity * 0.9) ? "prod-almost-full" : ""}`}>{res.amount >= res.capacity ? "0" : res.perHourMiningRate.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") ?? "0"}</span>
                 <span class="resourcebar-item-tooltip-name">{getName(lang, 'general', 'capacity')}</span><span class="resourcebar-item-tooltip-amount resourcebar-item-tooltip-capacity">{res.capacity.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}</span>
@@ -90,97 +100,53 @@ if(!(planet instanceof SystemManager)) {
 <style>
 #resourcebar {
     display: flex;
-    justify-content: space-between;
     align-items: center;
-    padding: 10px 20px;
     background: linear-gradient(135deg, #565656, #4a4a4a);
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
     position: sticky;
     top: 0;
-    left: 0;
-    right: 0;
     z-index: 1000;
+    border-radius: 0px 0px 10px 10px;
+    padding-top: 4px;
+    padding-bottom: 4px;
 }
 
-.resourcebar-item {
+.horizontal-divider {
+    width: 1px;
+    height: 32px;
+    background-color: #b0b0b0;
+    margin-left: 20px;
+}
+
+.res-amount {
+    color: #fff;
+}
+
+.resbar-item {
     display: flex;
-    align-items: center;
-    margin: 0 10px;
+    flex-direction: row;
+    padding-left: 10px;
+}
+
+.resbar-item span {
+    font-size: 14px;
+    font-weight: bold;
+    margin-top: 3px;
 }
 
 .icon {
     width: 24px;
     height: 24px;
-    margin-right: 10px;
+    margin-left: 10px;
+    margin-right: 5px;
 }
 
-.text {
-    display: flex;
-    flex-direction: column;
-}
-
-.line1 {
-    font-size: 14px;
-    font-weight: bold;
+.resourcebar-item-tooltip-title {
+    font-size: 18px;
     color: #fff;
-}
-
-.line2 {
-    font-size: 12px;
-    color: #b0b0b0;
-}
-
-@media (max-width: 768px) {
-    .status-bar {
-        padding: 10px 15px;
-    }
-
-    .icon {
-        width: 20px;
-        height: 20px;
-    }
-
-    .line1 {
-        font-size: 12px;
-    }
-
-    .line2 {
-        font-size: 10px;
-    }
-}
-
-@media (max-width: 480px) {
-    .status-bar {
-        flex-direction: column;
-        align-items: flex-start;
-    }
-
-    .status-item {
-        width: 100%;
-        margin: 5px 0;
-    }
-}
-
-.resourcebar-item {
-    list-style: none;
-    display: flex;
-    flex-direction: row;
-    padding-left: 15px;
-    position: relative;
-}
-
-.resourcebar-item-icon {
-    width: 50px;
-    height: 50px;
-    margin-right: 8px;
-    margin-top: 8px;
-    margin-bottom: 8px;
-}
-
-.resourcebar-item-text-wrapper {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
+    margin: 5px;
+    padding-bottom: 5px;
+    border-bottom: 1px solid #b0b0b0;
 }
 
 .resourcebar-item-tooltip-name {
@@ -198,21 +164,13 @@ if(!(planet instanceof SystemManager)) {
     margin-bottom: 5px;
 }
 
-.prod-almost-full {
-    color: #ff9900;
-}
-
-.prod-full {
-    color: #ff0000;
-}
-
-.resourcebar-item .resourcebar-item-tooltip {
+.resbar-item .resourcebar-item-tooltip {
     position: absolute;
     display: flex;
     flex-direction: column;
     color: #b0b0b0;
     background-color: rgb(58, 58, 58);
-    margin-top: 220px;
+    margin-top: 32px;
     border-radius: 10px;
     min-width: 134px;
     transition: visibility 1s, opacity 1s;
@@ -220,10 +178,18 @@ if(!(planet instanceof SystemManager)) {
     opacity: 0;
 }
 
-.resourcebar-item:hover .resourcebar-item-tooltip {
+.resbar-item:hover .resourcebar-item-tooltip {
     visibility: visible;
     opacity: 1;
 }
+
+.prod-almost-full {
+    color: #ff9900;
+}
+
+.prod-full {
+    color: #ff0000;
+}
 </style>
 <script>
     function numWithPrefix(x: number) {
@@ -231,7 +197,7 @@ if(!(planet instanceof SystemManager)) {
         if(x < 1_000) return x.toString();
         if(x < 1_000_000) return (x / 1_000).toFixed(3) + "k";
         if(x < 1_000_000_000) return (x / 1_000_000).toFixed(3) + "M";
-        return x.toString();
+        return "1B+";
     }
 
     function numWithSeparator(x: number) {
@@ -247,17 +213,17 @@ if(!(planet instanceof SystemManager)) {
             const newAmount = resourceAmount + miningRate;
 
             item.dataset.resAmount = newAmount.toString();
-            (item.querySelector('.line2') as HTMLElement).innerHTML = numWithPrefix(newAmount);
+            (item.querySelector('.res-amount') as HTMLElement).innerHTML = numWithPrefix(newAmount);
             (item.querySelector('.resourcebar-item-tooltip-avaliable') as HTMLElement).innerHTML = numWithSeparator(newAmount);
 
             if(newAmount >= parseFloat(item.dataset.resCapacity ?? '0')) {
-                (item.querySelector('.line2') as HTMLElement).classList.remove('prod-almost-full');
-                (item.querySelector('.line2') as HTMLElement).classList.add('prod-full');
+                (item.querySelector('.res-amount') as HTMLElement).classList.remove('prod-almost-full');
+                (item.querySelector('.res-amount') as HTMLElement).classList.add('prod-full');
                 (item.querySelector('.resourcebar-item-tooltip-production') as HTMLElement).classList.remove('prod-almost-full');
                 (item.querySelector('.resourcebar-item-tooltip-production') as HTMLElement).classList.add('prod-full');
                 item.dataset.resMiningRate = '0';
             } else if(newAmount >= parseFloat(item.dataset.resCapacity ?? '0') * 0.9) {
-                (item.querySelector('.line2') as HTMLElement).classList.add('prod-almost-full');
+                (item.querySelector('.res-amount') as HTMLElement).classList.add('prod-almost-full');
                 (item.querySelector('.resourcebar-item-tooltip-production') as HTMLElement).classList.add('prod-almost-full');
             }
         });