From 9bb37679c0cd5aa31aa03a226bb2a0ec511f4e60 Mon Sep 17 00:00:00 2001 From: Gabe Kangas Date: Mon, 9 May 2022 19:02:10 -0700 Subject: [PATCH] Add some images+icons to assets section --- web/assets/images/bot.svg | 1 + web/assets/images/fediverse-black.png | Bin 0 -> 4262 bytes web/assets/images/fediverse-color.png | Bin 0 -> 8234 bytes web/assets/images/indieauth.png | Bin 0 -> 10089 bytes web/assets/images/logo.svg | 1 + web/assets/images/moderator.svg | 1 + web/stories/ImageAsset.tsx | 77 ++++++++++++++++++ ...ors.stories.mdx => StyleGuide.stories.mdx} | 44 +++++++++- 8 files changed, 120 insertions(+), 4 deletions(-) create mode 100644 web/assets/images/bot.svg create mode 100644 web/assets/images/fediverse-black.png create mode 100644 web/assets/images/fediverse-color.png create mode 100644 web/assets/images/indieauth.png create mode 100644 web/assets/images/logo.svg create mode 100644 web/assets/images/moderator.svg create mode 100644 web/stories/ImageAsset.tsx rename web/stories/{Colors.stories.mdx => StyleGuide.stories.mdx} (65%) diff --git a/web/assets/images/bot.svg b/web/assets/images/bot.svg new file mode 100644 index 000000000..a39c87f79 --- /dev/null +++ b/web/assets/images/bot.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/web/assets/images/fediverse-black.png b/web/assets/images/fediverse-black.png new file mode 100644 index 0000000000000000000000000000000000000000..1bc6a79b6a0fce539415e671fceafd7c2cdd75ec GIT binary patch literal 4262 zcmV;X5LxeuP)QkFuyrTpqvDwGm8H$~C4R5;ei zk}OFHN%sBsnoh?&GiTePc%=^sD^L)Rb?{|Wr|CgbaPcu?<{#u== zS2nw!G;SfH%vL-VY=#El%GITs)qhbDz&fY+#nN$wQ6)L2m>vVJJe@Hn z;|8OHNAop423!SN3g?a!kTZvgG2p77I4)lN9|B@Ej6tA*6rFJZ@?<453~1os`EdZ^ zahy5GqSSE!vimA?5c%RBjxi6iCxki3oZ{ZG4bm~8RMyvpImnXaF$~eme%DH=;J1{2 z7BdHN@g1WOeQc2y>Y4B*PG~PsQYv5ulBY5TA^J&C>$QNL{P>A`8yI6)L^cVHIgIGF z+G*&^L+VhFDFt#DWY*|1ks+W1^FScd3en4Z?bf_!v{`3gs}7p5sGIZglpoolzAzbIv zXk@9SE_$OuA;+(<33dn&_<Jyv)Rg~lA~5ZuM9y62FQ`=wLb)? z52?WDqlE69T8F(z$*TJsAn3K`x(B3wTnV9LS7?zU-ckVevJQifmCfetrXAtvp`p{G zoE#a7n>W!89BdP7jCY*7Yy0)LN_cY(kiZR+yX&0-e6*EM9B_S~7}9zt>S0m5jtmp2k&YsW60@iqgjGfS4Hk;P6E(jcxV8D;L0x!2=fb74-%-jyK@pAjQ zjP`8|&r)MN+rzcsNZVkf#oG;#f)cQA6&A(Yb%+>kyvVOjRCQ8Qb%dI>-pEyD>Q-@( zv%zJ#QVP_7k(SwI-JIx=PnTm+d|ZYElB>$xlN0!nrRMILsop5eOe~17AeMV_<|At# zUu%sxcI?yTd?P{mn+5#|8c1IV`+NK?^2ICS4_pYgd9GJ3(>?(^S2w3}K4`FfL|tsX z2-QHL)--J#Gjs(O<+Sq<3~^RK(zMkmSQ%QXLN|HW)c}XMRYeNTg0TE~Ycts6@EPnf z0Ak+Uf^Sjtwha>{V*zsv-uCSIl9j~muz9}YdJm^U5oiTB3S-Y@4461>-UJFI9m<(M zSOWPzQS>V_koh?jGDi>NKH--4%uyzwd%b9ycJ1_DcH~?q+}V3+?Z&ahVk`Y!0cRmB zn{G1$@p21rV20YoC0_#ghhN)xS3iaZCN?V;8a;Lh2;G^yq*AJB()-!TORnxZa6v!O zIF?w8k6SgN9X)@JYCq|<)>((Wmv@G`c}1DkO~DyPA+z@}x=6w1N=a95)g16u#nyPk zJDb42&mGF1Pyc|*l^8w#Db; z+H!HfMPv_0gGiQIgoVd(%kTx6Q@^kQ@ERFi+%n~$b=%3a{28M;xw|AQ7o~3d)7SZt zX}eR9&+%d@UmIU*iQLXmqLGuo z(HTp&XmCwOuEAUY&JP`C+Lt`6QH1jY?t=6@i_z-$0`<1 z{61WqU#3w?wFK6;$5sNHtU)AoQLJ&CQJQu(`Np;YN7*v;u+3rgDBmVc`wTc^m9*ce zm;Lj!42?Th?w;n6WQyol(vU$;9l3abSs$qidJE%cxw+LO#w12P6TTDc@7IXWevd)9 z)yIY&aq<}09%zTZ4mAkp&5K^^>ueLeG)bZg@fI1?GTycFRBER;2va( z8NGEfH;Bw5k^T;6iTic(c)4Y0EXZUI@^l5k6rePXxHcv7Sd<;tA!x%rcWDhZW5Mg}c|Q@xvmSY2FQ?`L6J6(p-LD1jY3$342aSOe+d0R0x~<2XQy zGShm6f2oJgeVwu(1Fwa>_wruGc|C&QqL-+TZ7))gz@Y328H#QL1{_Wv?dFU&U6e`? zY5d~r9BjMs?g!~3URYsO^Yx2mOiu;=0ztO)?L~@MlwF}i5CktG<91(3(Pem&;- zc^U-iCP4#oB~fO%^8)Qmqm}a&-f5@V2K~LNj}_;4<6S_Tx`5ZCQWA@@`|5C%X5FN> zO7u#vE%`@ImC5##Sn}TSQj}Icp>NMpyR)f!=5SHKNQp#MrPQ=9 zXn(}nw|eHFj+`-~Oo?zy!0dQOzpSp0f(9ZiYs9f8-JUC~%w8so*uGrdC347XF4W}Y zUnPn3e6S9^s0>-w&Qu3iYHS!T`eWF zp>woAD$Vi&{Y?IrO35LEe3=URWp6alt!txcEs+)eW%?1_oJwy28=$#HY*@h`qc||n2i5WzZ9+g$zOvXS>=p@*NMDE!q$cTJ z+D{xQ8T3@QfMc9b4>K5Ne-=nbiU5CE(DPpRfadkh_=NQ$J9wz~Z~cAj@)~TLsLv=; zLN(&$i$Mz)-cg2CLiQljsAnR_K_8lMnphrfR4+1Yka8LBF2p!1QlK8yO$ILr8=THjl`GkO<%4vY?5?Z$ zDhWrg)g4$H>?bJ~Fp87}?nOo3kB%Vj-aY}`?Ba~5K^T*07(E5-;=|E&QN;J?%4|GCYLx8xZtAYY+d5V6q=iCwUA;@WGWIDY>2m;dpc-zW>eYjN4E|4hYV8i`f)f(}8=GfU^0$IT#_1`8V zE$GDO^9M(qWb?=r)DO`~9(ym-dcB{u|034q8Qf(aQpjJX9`}HiFRX!4DLJ8o){m_Z z+1VQ>PyGVwx~=>p2FX$7Z&~x`!hu+mX9kIS;g;(j&@x5@TBxah71D>!2@+`KE1x9l z)rg%uDl(`P+M_hAPHt&Hk$JQRi87+%EViSPzm>22%)tG``uhgY);@IciC>Ycde{%P zvs``Pucw^+g$RNM%bz9a!`c)!6B{kZ!JZ%Xh5jlk0_wX471{THX7YgEy z!ofd7%Kv~oPpZlMw9ezKz&$);}$=z8yqi!mg zs;QjMijK^%pc7+olLN8~=kosA{Ip(0nGG=c2=BEf9m*M4J(~jDD+<{SC09q9kNAE( zU&dU>PtrAvhXyp>+%w09;RsN)uqe*H5JXjZIlCt}3N;<}1JgFhlp%>e_=R!u04??& zW=#|;BtpT)o}B#mU)mEAYn-7$QOi=xSa92VV>s6@i<{A-%5pJ%#2mytGQnV8?#jRS zUktQM(0@OxjhFenuNDfUmh1x;swM7PS%xdTn^HIJvr3*_(9`7?-*-bsQ8`m6Yumv6#kZY!vuX$;GkB+_(DY=mzXu9vY*4h z3A1W-2c3cmD&*5XYh+m6^*nZO1BLum6ul6nFN8fquCAAh!PqhSTZd#_XmrXkPv#&# zF8)re#L0ylRr1zGyL#W;lBQiF*24)w1xnLv1018*5|80)rKpVxNZKOi7nq{6{OM4$ z7zBRE7aKlt^$Bn+mKS1}+Ciptag72(z`;?7ggG2>y7hgpGL7SHt*GdQZGviBE$49;#WeNFi?3 zS^HgAb(5qjcsiKf&2(+%xKry!?Z3D1abd$v4?N+{SbHg#dA=;f=HU4i@$w~jo})#? zqczMyIJ-;bpwTKxx}fVr&7Mjy7>dnSBbK)4=2jOU(`c1En*U-N4JMWoRkprDMQAk3 zYfT?l>)R$V)?ufP;AKv;TKY*}MYGf*&5wKdJEGMw{L0@#4ZMx%QXz#e;DJ>oua6xX z`-SLRQlz?iL*t=QDvF!#lo=UxlNemu_lV3j@ zG~P;>wbm=dyy0y#dYrrj8n2~5>5i4Zc%~)wyxJz_f}lBYSk)^y0=y%JsBka|78{Lekkb1Y$!NhX#>}_a$M{KO+Dz1IA@bi0#URFaop@{wYdc$F%1`{)tmS zDw_}{{e1#b-V`#Iz0}_H2o#ZKI7owt(1A&t=?xlT8^WZ&M?l+X2cZ}Qp$B0+K>M>9 z3*P{cjR=$KS0Hem58-+k)r?P0VL!AWOsYQtkY>PsL` z?*~zztMu-uN$B#8Bw`FW`*1HLl>Lv|6dZfa2-xXkc&w%Jgnp)?Oa1=uCnS@ET1W_12MDDom zk@P@gm1HLYnk>KRkUESC5w)zcs9lOcEoe)aR6`KVkAoF2EbOEQn<^x`2$1YYv6}#e z%bsf>u-#m%WeYcl^uy-~ld3PWD0!g5Y0G`-q2{s@5C_a~Xup;oYAGcPqDDdH6iSVf zdpPbvhQzBCQRX7<$`>RlXh)c2TqG;CzruOj9qAt}inSmtOF-!3APRJ?_|lM%AW!WF zDT5Lrtg4P(H_M`aoddGO!9wnWcSSh_2w2l7Bq=m4T?QaH8GRM6cHER6ZYePeLgx;A z9RpLkY`MpFyltsuCJcl86^we(19akW4kY9?2_*z|y8r3{c46@3vit_vhCotPvD@t*}kx4FQu zcmRq0(jc}2R~rfF>#WsJfcN@mnVd3>&oYnJ!N5@hMaZ5WK$4>WzfedXt(U@eua)#j zTVb_89BiUgJYR25G7^RmI^~?*^(1;kD~K7>0YxWB+rGk^L;PV1Qy4fk zogeU%C*$enKjN3a`A~4|vXt4gkgWq^0EP9V|NlEEBtP#f<-7ftrN`Rys{;a;xeAB1 zPc#K_!-!InWu**>ozz1WJE0q(KOuHvcZeR@1`^D>LSpo@&1)k2b5;fS5-kbr4DwA zRe-QG1No!HE}Go%u|yThKC!<-|3v3;dgx09j0F2fu_3V#?Iw zHhL&Aqqv3LDuFT+L6Nj-crYG5w1DQ#WhFP?%#17@Wx&jv?+QX*d)d9oL6U7%gTUA2 z4;Q}C+PH2dV`dHzjHfGi8_2rGlS zsSAoTz9ULWg`pI5V;P4s%ZF@8P{74yu`v)v!OUOeqM-#&!6hoX@y0>e&2!Ua2TdYs zpsWMy+@nX9cSlR0Up;bzC?$VXS)sgvVU$_6s65}<_A(`o@k?-D1M#q!6qJr#H6x{+DI6NoxU z92-0hHGpN^fx7hgnf(MxHuDRjoRp-z+0KX&Imjg?Ko$nHfHMh;eereUP$I{03%YPB zf#QXrwD{+NWMuS(#*LMFAhmFb<>7PU{AU{kw7c76qS#R?8T~6#BX363LK(Z3P@+e* zHE>7a-SZa-BRUnofU+>4WeE`6m+Xo(&r*}hCUt}IA5S2Q|5+#y7B&vw)H(rKx9t{( zVSO;giGcJs%^}OZTXBx>(5!;cd48;f-){@DZ|{<_d}k^p8U09=*k~mqiU^n)GrD~_ zcXWn?IRm&V9=j`HM0eAFzhAo2!pqmX;IE}zMPZfC`KlBVW4Q&LD}gfipM`?^jyeO` z^xJiAf%U<(SB)UUwJl`4ZLI~9{<<-s@8LjSH-${MPDJpM5# zP*~UH6q;P8CNvNbHNNB0&s)4D4-22rE~xcD3JMl1HN88C}HEc1)YpT z;mmVKP@4ZUPn1uZ6jbXf3rCRO^qlbVAJgA7(*vkZyln;9o;?L>C8J0Bwx5He&D$Bc zgXLhit61niqabvF8z<@5B~jiJ3mG?bqN+ImOH!93gruzbqnrz8E+lVo-V;4JVSPv+ z!EE0~V4r!!8egvgl<^1(&$v^jQ$Y9MRD!Ho5oCUw3)EpuNbjqFdMp6o>C-hjAW&l< zUJlhxJPriPMYK+~0moMy&3W21#5Wvs9d{h(?JiUCGi~Eqog(LDc5<&aC zpmB+5&IEd2Gwdw)ikmUG{NG}Lm=*>+$bX7@zzDCUrn;;XX4q!_&`X`Gb$7V=V z1`|j%gAzJ{ThOr_6au*Prb@No!Vx+dG3GJ+dg~y3oB0bgm2Uz9wn7ude&|Je02U9k zA!2mhfv8lU!{o_<+1|al8YR0++UB_t$Q=e0w#(7Sh5brO8Z&)8a9q_}Xm+x2h*zm0J| zY8jOIOOP5_bCopbn_^DjRAG+YFKqNlE(~Ank?TJy72Q;^Am7GPNb#Rjenf&dp%Ryj z$$7E4MDX4y<5$+UuU{?(9pd5G3Y_lBA79op7GNDJSHx9y;LrU8=+Qk zIvaHKYCO8{!sZ~Ski}lJ9pU(?mH39E*bHW*vB1|?ptujK97xbKsvDH-?A|bCiqcy6~e%SX8U*T~V)v%Pw8^C%PI8Ih}B zaZ*m57ttNp$@vMxi}?>XtNEu-1;Vq{tFRMvFscp$FuZqg_9#(Tfm;1J*xGJ}@#90F zWlKp3gvOsK;JZF4@W=1xWl>3EqipEspAGZ`hwnYXahMklEfhbC2#QLguGZ4P^KxE` zHlND5qa!3O8m2AoQzK~JeHr*u{^^r%rd$4+804wifWpNEav^%p z&oL+rO#7PdGb&A>NbkP~dK7NZ!KiLn00G;eMKK$)dlU5~G9&w2jko_y(!+a>Iv{+S zl#=md;g#4wa&IU9;WCZFeA3Sy9EWRRl!dY}G5|rTv{WUPie|~HC#A)V?qKMSw~x0G z<)l#x+Mzr!NP_YKKhxT>C~oJ2{NUMvG@n7aneRF)&U*YlWZ9e}`LM^p(a9f6f)Ki+&3);w9Gb4N{M9T0E<#)sCQLyA=`69?aA z#kTqrs2#6BT-U1*+xik@t$6K?uk+JH!x0o_B~biTQbQ=DT-G9K`M9i@F=gF>cL%xd z&o>galxLB{Mt}C3#cATWk?dkxAGtKUkD4E2j(Zo}!xTm=cg+nLlbG%K6(6~$%o2rj zOGZhaLa<&p14)tR{F5*?Y<(?(;AL(<^rY8okCHL}MKHC^Wr*u`RU6dye?jU5`!rCK zpKGC{iblMe;%5|!|K>(Rpx zzeSBpv`OFdpllJy zkHUzU+5*9OWG{4M7DGKg?47sU+dj7CpE@8YI$6QTZ*PiKMUw6%$vH(d!ez2w(bMm$ zhN2b;+9xhC&qc}Gz#Y8zE^CN7$S(8H4LmZzPoUuO37!DsL1U3Dr&@_sqvUl^iV_E_ zIUYZ8Q!gIlv#38@gvkNxY6%2`JOcgGG@xo+Z$OG{q7KEhxTpux6+^iK#j%Vr1ePAk zNG+899u-5`66LE_LQ{dS)5^$!jmx^jygj6B_%Q+0b^D8Z71-`9KV-zC_(Z{nX+#Ya zn=hYi>5}ICGK_cR73{pYs+K@j0|B>Ti4#$u5_)9*jPiya2nw82_%5ld4a(SL;V73$ z*eQlk9`$|)0l&t2ssw`0v?FU>(449S2p*g81KgGobyPerU(m|^7&hn^=zrIP;Bv?XuNp#TOF4bDsI6^JZ}JrucujO(HYf*r%W z6nX|ihXNzA)F?2NvJ*hb1WHU-yGpnrO~lnB`Pcm*C3m42+CX zLp}c!A8Nk5W8#22T(nG;aY)Wq_m@T+z9gZ!%R~&ty<#Xk6Wla%MGM*=tKUR?X9j`~ zUJHqOkX$2e^=tU|1*Nxh@ksv9#8vJ@1^SrJn|9hQ&U1l{pB_Z1z<~BS#K+O)8AJ9$ z*MhY`z?N#}j$fdaBp1-rnDs3n!7Ods(|BsTQk7QQ%aA_9A%>_#Tm;2=q941$XGF5Z110`VU`2!mL7!w;rj z@`R^BjEhW&8FT=?&Z=ylg-0u^QS5*Y+(hu2Mf_c&S-8E9ZKcm6xF<ciuhW?ZO*XgP48oJ#2g! z%y5e>*!LnkV)won$H%#f^dZk+)2(gLT#9czjy3qtl1XnP&2?D#h5;!9h`&>ev%we3 zR9aoEAil>njXaGzh^Ru`B$3uB6)#^n(MNl!Wtw_xoL=Qx9W7mHX&=H4>PTjZ<3{a& zkw8Vs+9-&hF^H@0VT0WV=JUwx6M|x;b{~Ijgmu^#Z@0i4%AaX(@~G>Qm64PE!Fs1H ztbb$!3*Ov^HBa5);=x>q9YOpP;yq8YDBX+Tz|ErQefC_U8seuF4|SgCZxjmU*J#iB zf)dVlUAiEkMVU%#K|phe;k(Ye=AG?`a)luXog>yi_`q_A$UeiDDoT2+_ssZZecgA$ zFt2?u&|^3Bb^i^f`JK(VlH_xV__rjDD43`los_Ax*mq*~5ml(*)|tP!&NjORG);eF zP#$3@+oL_y^14HzNfL(R=X;lxdy>(Uado$I1nbzGYwry}tg{W`JPpe_&yy&=C{xgo zn#RjQt|WZtu?qt!iLYFLfxDUSPyA~@lm+516TZ1o9M{=OUum`Y6X=${_bUB8R^gX% z)4!48-9Ns^LklgG3H}_EQ;a}~!BA@bAOTY->%*0^dTt8+mXC5r2@sr9Y_oRU4oMTO zK)Is?#G3m-yvL!Le{v-93Lh78FN|5!_uURX44q461)j~5sulm<5e8DJX_7L=E{odX zFFlYpmmqVIQvgwk@~w|qV;J~M2Y#Z2?`gk*pRFF?Ji!k`sc`uU+!5nmQz$tc@ldPx ziO)9Lg>bl1dCxiBvaP6nrVU zygT~5+YZn3LUt1Wwz8JE_?7P1F`Sgqb~I9!7@|-ONpq zj&L6D%Qfbdz@0JgG>WRBn7+xR6vTzWe|fj{xMI-+yb1Fciny(oWXWJl!pdAWS{ zkSC$Ei^xe;&bHp>M{fMKoI3^}cgzhspC!{MTm0)l@(=jkLCaJL5WIXP^s7oih zWqDT)-9hfq&#WeY0k|{I+_y?Qy640T#ygGk>#?oZ7UFc_yS9E5iP?p)RdJU$k+58U|GX|7%2L|Lq58p~O1hMbM?ujio zWW+9!gyl~*a7R9^FLmlyGVBWdQM7K@B^qf;oO#K6#_=aQjq~AG2<00*kc{+`^OT)S z3Ix8i|7}X@o#l5Z#ic-$1pb~|Ecf?tp5xMr&WyzI{HoQgInl$m^)YbAE?Ds4VwwWM zY7js~ezZBLLoZYM;!>FFkhsZUDY>}M4()dsjMr($wmKVtrXna~%R+gA_Ew&v@LLrg zEYB(archAa_ikX?%@ubklG%C?27!BstKM0T+0uxSiz#gk&Wv~#+}mB{>`tw0IVb2G z4JB^_ceoZrttT3a05aE!{stRmyJ4Mk?2vqsq*9Lzn zGdweL;1*GZ9CJVHLW#Q!44l{(hg?olp+w(cfM~?ZHc3P7F{vF(4;e23ZN2N;G8NC+ z-=3D=E61;MPVaE2bl)Y4HY-#m`ZKC{|3h>t=1Tqy`2KuKMB-8b1D zCwT%%MJf!=jNoSRY!zolq-uHVnUpj1^6tQmp(lg7l4xj3pXC@;dfCDQ$Fv`wd<2qg z^uLGvsU?T}_3off{z56ErByj*;VG2eo>FNi*E|T~YC+tn7{p>72=uk;norUb8b>^g zD5sP03j)iZ8QC2~`)INc`?LU(JqJ|@MR_}AsV8Xe}$hk*v>^8SBgwYKY4EQK!Zd6<3Anpm(#QQRp zS`^t(|8;Es>$H_PZ%~mlV$srtH>#q|&Vj%!dkO8#Cdcx*1NR|$mk$_>SJ3dTn`1=w z=?!R@S1k}X{mCl(Xi0ps4s)}Qk^v_(&+LN&GnkEU$XQgl)$1F29=UP zDed@!|8W*_hXIg4R?>W;p{h8RIR-CT$%Aed<*t10&DigLkFn457T@vx_O#9B=o#I1 zfKEV_KIAV|6zUK83yYOqUPRH3TcGi_wzD<{Lf7PBP!~NCUZ=4|=Au;bkjR4x_Krim zG>^Z1r`=Eau$Ss$3<@0`MOYEkMYF8*cCKGjaHO3*Pn6T`Oz%^@D{#m92%Asa}MBJm7KPcYuJD>F9&^QJqN@+1RjR z613kE_8of(rClk9G>0om7A|G-mqOfilHXD8;8N}wsw;IvIH|LUhAd734DnhA_IKKV z@G1dNI&OXr%2z*vcdi%A5c)n^oxFHxCYP2y{B>Nu?#bpX@`i(_(RluJ6`c!@-!Taiu@?*V8>NAa@uf^39RA z0vj}p6g#lE-4dku=HI{o%(Ow41Oadjg*A%EV{lx;XY|_R6!~$6RplV?hS359;*@Kg zR|1_k-DsZ@$({bf{Jr?8F({UC22idhZ*-bpYRHJ)vN^OrN220)z}H!FVUG#EhXsQ@ zf7iQ1H$;r&W=w0aFwz}h6~56ngdT#iz_6@PME?ON{BsM|&b#ho2tx+~Kh<&KE!8J3 zk2|AURbB-5M-0W7Q$qH~y(|soIqm$}@&vLLSe!m&58{^-H9*)=Y`!?{19W0 z3zWEg-i-M-e6=9vArMDj#{@>_a18e1YXxPX5hw@Zo`VL=GK*tI;$;dqh4{Gi0{<4; ze*)06z~=X>X+9T`I}Ao7zs1;kG*}o)5wv;O4H!1H0D^N03NkNPGi}$~kmO_T(Z1At zPQ6tv%rMT3%AiCZN_oVSF?y~D?yOn;p_A+wbzGE9%3_!6DGQ%F<(@meG~}=NzV174 zd0XNRluO8ug50qU7D!P9jM2iV1rQv#0QhJFJH3Lq+o-{c*#ahXRm!1xy+RpTF%-LQ zt`KvPdMjLDzbu-YG|fFM>TZymD|CR~sC$QwZ=5caQZ{-KwJ1e^X?upbgCP*Y&|dX#!=z3SGLk);Xd-Ev{cmy5ufag`-Uo@%zFL_3WDJd8JCkU z1PWp7mv149cz^&rLh%H^>$3lJ7Wl|M;BEXs}QIaBZ^?@5Cm$_Cs2zAGhvl^5p4aD%{{b=8-I1b;MMaRk_$oa zWb4usl;e3U%@=All#IlM@!at*hk1&lwnx1Q6~d^N&p|{y)I%^9S}?W%`(ofPqM=JI zgXT}Zf$ZzGOzL+UgMuDLPW){lCl}ptV?d09GS`6`T7&^%P#Bo@dz+@PM3zgqsekSg zcs{-&z83IKu`c9p;fcab>Bv4FkgSJMbzt}4rOYW8mNs}O5y#=QuIz=Hmc8Ed;7w$p z{O1MV;hU-ZN8%e^Lr8j1`1jHK=t0f;ngK8Vl3co)2iu4T7)JGh;J`U% zfGeaZG|;p`1Ceu~S!AS^L&K%(j5rn-SMvYuz58#KAJkiiq7zC5?9IHA| zY;?oM1Z&uB{GZl?CLE^b%T%gzBE?l^;b1Mkd}W{D?SbXo#4Xd<{FS51E>TN|;$_M> zDD0MkK;57@pY@LjU6U2Xm3IbrN{Wn0v%a=B%lwQVkb1r-hfs-WO zf?tVRh$NwrfUD`6m8=>S>MdX4d{=Vn`eEVoBWrolzs_K@(9I{8e6I(ED>UpfoMR3z z;w1a#!AuOJEc1Gt7m2gtTFuzl9UBko5SO#BU!2+0n4 z8LIE2De{G`kE93hoDw}exrrCD^FJK=Dsz_7at=G^eGWN?cv?3gn=p|7HmM}gk{JP` zGo4^bI@+izpum)37IgksJ|x9ttHK<0zqAC=ma}zZ!}mDCjEW#XTr3voFT8$;iBEAYlot|-JPJY z{P?}uGmy>n0dG8hCrtWh#Zy2BKL$*@pAMUEros-FTv(hTg1&@FCYfZCNhXWd(vLNdoc!j8f3(Ghyef~)6!Hm1OO}~0AK@z_@JavSlbu? zNM5}*g1t1feZ}tK^}^BF)q(w`zlQ_6gP*e_0Qh~Y$#VAEl%tNg-K6!#1tNRAn5(J0 z!)0#*)xNY;^L7Mqsy~mB(8P)~7i*k%zx}y7a2=PS86)Ie*|xRkUy3x}%QXt=`gY0^ z*xq?qcqK!!I>7SIFHbEhqIij3yDO%}8xLK=M+xIVX+jCv?6TQX4*j!^u z{6K(0$$+ZcDsS7&iR&-FM-pt()@2Hcp26;i)~Q{~zm@s@ocTz!;w=ytyB6*weTt9e z2Krv5bq788BS-&=MUkhMW3}bn^Uuw~gVkJxfj5mdA8-B7Hm>H`HcvK&uS6dQhj45U zw+0H)yrV}BWZ7RVMy6h04EVCX^ESEfwA!)Dw>fb&SRs(qGa#`vcvq|Tox@6Gl9zSu zt4*t*^VDQvB{L6?m4|ov2O?=rw$~$qSe!C5GdB_=?c-C|=3%A8=DBvB+Gpgv5a)&x z>T1RhG`2Fq->7SS7MoW{)6-4YW*IV}mg~3c`@tO-T_2Zarz~j$KV7R@!%dq$ekP5} z4f3YPBKk=s{fYVN_y%fzOAF&byl!i2Kpza;?;k%(xA5vWYt@%s;ik1TOCs{1auN89 z%Ym(!dd)##V+Z9}8_*7wLuzPwQic`Wp;!NW_ieF2y}CutYMRF~ljM(Qy>OZ^gCWCc z-Bdl4q2Wn+i8i?po$mYW=4U?Nnw*CCT*lg-;zBVbBRjsl$ zA#@)u$_HghmT$Sd634H_-Cq>7#Q*$3SKmQAT5esTSbO-*s(M+oCPZEc<@}ZI)hcYX z>_MrN&I=}*66>dqG{Z+hEt_ABq)%d7YsL&tMjW_3-WoTZ8m~Z)Hz&w!UXoQZ-6omS zV~zRypd2n+2ps8IbVg54N80ZGg1&$9MX&8O^Ge;2=HTV`b9=2y$DUzGhLoLO+32L3 zU2ghfsG8nkz&mF}rtA+X@-0zYI+{36&ouAc`1Nt7XPVj0M3;{dec}r+SZFzC8H}d- zLiC+{@sZbT3=yq-QF|BZE2YC{)q0RrT9#0*tj*ciYjW2daGOC?`8MS`{?=KKB(pApfoiR&J($c z@F1~yh`JAVvJ#VDUPN9rc`n^^i{_|CN>&mzh#US6%*;YpRcNF~n^V8);IGw{{ z8%r7Zr}Fa{qG>}0Ci;m*sNiuP%||BEH=O#)h>@j$Lzss0d)JfVjLGwo>fIAf6MAp` z!t90o_O40Zq#LpaQ4h55{wr?E* zxATRPhRmy5f^T3FIqkYj(5pzMFs}24GIpdsph$I$_BW+T{6o3MjZB=6u_(2{sTNW! zD3N)-L2tyuALG!}(02x|Wchp1BQN>#CF|RLGPkQ+!dQhZhS9;(zu+V->mRx|`2}No zDj1urC3tmx6Zc27AIFa6RVfoYlcq$qXBGhd2IQ$yGLA~RxW#=m3VYHxv=qt)-zPj? zkw!9O{q>-Z@S7dUf6)dlHpsvJ(JA{jm}{UaJ&pxab$0 zXOH!1*lT~kiFzU&f79aKK>hsOp6p{Zfagm$sq@`p6-jSv-jOaAQvJO`8kJN6492!J zyyhV*Q}wIjkR$dXcM^Ub)2786dCjD?f@RbV^tM}D1T2t+C9sf_BnUmE+l>D1fSrF| znWcws_dzW5ON1nCD-M7E-~M*4-hDGY=ie1~7duHaP1W&Fala**STZ2TNGiF-R&uw! zY%?Y;-u`P%3iYFwm;7#1VrPb>TS#NBGu~?vI=4Q!n|z)rSVlIPvc1Do*4{89Et5>C zO_SvRnk~ zpMF|S3zssJHyRzu9W4eQ6kY{HTqU9^tD7oTTaIE6IC1V~IVlUX+oXO|+sG9ZSuQJ& zNW^9Cy!7C7&i+S1cyhD7qO3bcdES!E|HGG*h=Qg{F z+@^nj-Xf&VdWXOzd;a%sz;bK}%=E7OUaY!D43rFCTz#>dJP1eTO1=?3r#>Yumi_iF z(av^msb>gwfx-ABlf0ZZehO^6$s!5RY*Ub==rt zXJ(7V#`;iq$9W9*-<5waOJ3FdXht%y=^kX?P0#*iDAt6lzh@`$rR;FU2N90=CbA8^ zMCoy7{KnL$7KEQz#*@E`J!;fee*BTB`TZ$g4!+hzzCoS&2dZ6PoJhVV@m?;e=^mEz z4ayhRC*15i4K8t$KAqiv&P|(Hr+00hCnC6pg1hv(}Rg;1qTvjF4P{7`FEeHlqIth z2wXQ0ItYHW#hq+?#2)7+t$g*WL4%@6q-w7QsgJg22OW600H5s3aG`S^Y-#k$%M23Zfg-!RQM1A_CYEk6{Jl^CEZV^S9 zyjp0}y^4#K!s3T`V~!`0`Kl^pmbWgBF#`dFWfY%1o>$Z6UXEGLxxbI#6;SSzWRBRJwZ+O{qy`*aZi+w{ zTY0daJTqr&+h%{9T_#K_A=bk+`RDF0LidLu>vu)eSCq$>uDF!IBr&td* zM#h&3LsH#Wm*=WYS1Y2d_&=?^Z_*VCcrAQ^xt0Hl}(OBIf-R zN4WTvw>-mCus8#=yz`u;x%YiKMmLQVThh_5O7IB}D8 z<#HvX;}8h>G-4z!Ltc^XP(tm=k!nTvu#T{Z;#xw3+wqroQD(%?i}p83hp$BQx2(>8 zZku@V-~?hHL#N2%{KEZSPff}m(rCaQ8%BSP86a(EKjxZq$XJ!3XFmHq5}l$qN}~}S z`H*SYZ6r2ITS1N4*eK!TnlXcJ%p!NjD_!z%$cACeSzy?*TrvU|Qjbf8{nY63Lq>>Q zlS@ga=7j%JuhRB~n%B^G{;(8#EV_zhW~B?ZtAm=Xcex&^J)Q-d{VhsSVdFyM6$@wQ z^={I7q21yhrOj9Aaw5OAUe}bWC57g@t!=cI4h3{?k&7Ia=tON{Bo(&Ab6XhzoOJ`IRd9fLnhsR@tb9$&6fDjKx-L zYQgb`5uY^gqN@~qst9@$sFXmloba>KOEN|;PSw9}?cK41S8 zd0N3YgTF$Y!L(DthX>ly6VNgj3Rr5Y-^%EF&n>X$8z z%Idks7j{_dvZ*$}6i|YTh?IA<(FP8f&<`P%dFN{PUB?VF;pkDU1zyK?2)c)?(+FEc zlm^-=T0r_vAPoKhrL31nO$e#2S0t79rXYeW(Iy8W%693Ymi9pmzPvD85_dw82Q<(} z6P>SYH>n$wn04VqR)`K?QX*4ZYMxp;9{!P2B-XC;~5>?TZtR4GKD2fGZNCM}#|UxX}702Ei>T z$pw1}RhB|#;|({I%yEoXboc3^;8J+$sA(t+GGHM9KjDFiY!`BZ)+0+9(}1#>^G}zL zP*6wIt_fUe$pxYI0sE-~sGDIgG*Jx&M}-IIqD0tu@AR%5wmqQ3jbo%;%cp_5cJC3L z?S_F$X8&%mzQmZs%rA8>4DO7iNw94R_!^;y%9O=2BZ8nOp=|1i0DTmE7Wd#ju1*_1 zH*lU0=OD4U?b$nrmlGq@1jt(n@JL>v{0R}Dk7mF#36xtCB7I9}66DhXmN+;%G|IQy zb&UjxB-IAgKmbY^XMNFk^-;;`r6TvjKZxV$T<1O`AY~}gf*>%)~cZj z?6J;E;OIR|tm z6vhMiLajW&Kv<)L z5W+&Tc0&in=P{@q!|#Oi#nL38zZ;;EbKqF#^>7XWrVxWJ0&P^5e!4QrD8bm2jZ*1t z@at2h_)Wjpb4q@0JKpKF*YBo6eAg)r&yNv-MYvO%8t%96snt3((Z^3zbC>Cv`j^1Cd5ci#Fh+ar)kVau3BGCv<%C@vFi^}FIuVrs^fGs&tq0S+2dyk zr6T*ksdLLj{N)oj)gCmiHPXKP`s7UjGgVT2p537ncwEPyahLviM6mBfuQanYtAO-P6(vTF2wu>Bo!<|&!DNe|}n zk3a@ywZ5K+{`aOTHvUi80RnFVcl$~^FubHmKCQ)u+Yuks;^A(Sj2%Q1;pN3dHa5j3qa zT1J%l>@)sNHZ;-!sTgso%gy77Y^NQjVoPk}5X!KYpUIrwkx8UTe=tyF;XDx6w8w3v zcwnu^wGlTxB$|hb5%gSCTko_ zS6Y!5PtJ=PbJWXm5o!a5b*Y}rY{-|mI%?})tW*@epKoZvymL5o^P*2&8(bffNz_lX zE%#{ClngAqWA-;q8I?I|^n;VL)B41vj|O+-cQobXfhXEds&U@HKl6-mkV%M_&k`zd z;GS;61Ezp@dPFSQPv_pPLJ!Y(B*=fH+U!QeHJN95O4fbd~PmLcVHWn;4iL!y~!RKAz#k zopd1MP1q5V6_(^gC9Vxm&JjaKvfwTqKnPY1m z11Xh3HQ+d$8v41CdTDT20bChQ9oQ|FsTDEAgK)6Wleig-T&1kE=P;2v0;w#9fXqUZ zO($E^Pl^yZ;<^;FP0uZorHmp(E|Y4naoCH6X_do=KmwF*fNo?L+fzaD^`z*XNAvKG z8$Q>xOZ=sUYNJvf5RF)R?&~Vz>F6mUPCPh#se;eV5L zY|X*{3ca~QDKK&LQUHNBx8nT}_001DDs8x4AK^d~PVLu<;c^Bj&51m0O+C(L8N|z? z`>qj+;hu>6^825W@P!l#u5}gbPhGu}rm|p>A|ym!$)S6!#3^|1;N+P90jaTVwE*`+ zRIMJld&_o!3W|Zf1I3KZQ-W|Hkvdqn&!gVn#*0hr?*+GSR6)^-ZK9So*LwzTs&UWF z_rT?%oAdoR+#W9q)DivhDgy`?VHoakJU+L_COfR9>DOg&iVroEHP@Y4YQwBC>&Vk|dkf@<|& zQec|ZY0cDxzvYLKMpSniBKlE(_~P;6;0tl~+#WS;GaF|vcyVTCXH+0k<22d3F2GU6F`v@W&c=aU4HZ8cHm03)Lz3wE0h!b0pw9|pl8h+WU zCgHu~v~T{Aqs-y~s&)J6zWHQ)hBhyLd%6~O0M%DUunLs@nO;wuQM`IYtl)&JgWuWu z^#vW(DxZpvW#bOi4(vrfO5a1@O`MW_GCfffxM@9JPlybxQJV61o6ZD9$4?$u02j>inb^Ov2K$sku?TKd&@Wt_ zOX(SH)ZQrn-iI`qn=aFsPtR}2j9B6fvWi#EEWRAu&zl~PP(c^Sv{A1Hf>uc~{&u9# z@tFL6c~BD~1BJORech@by)skT>NpB8c_|38^kl(Yj|0-cpE=Q$3MA(SrfQPi;T{M7 zLOVvUVBHsM!k_HxJE4{l#NOMuab`F@Y8Aj8v^vyzcD3EfvVbc0fOz17oJ zKf)hGX~yqMQD;|F(17-xmjYX_m(H(~I>%Q9jW$j;H3|)D9hH1wUSO%=yZv|Nij6X^ zAf-BXf&CK9D-~(Pa~v=AI3Df)S9qepJY_g~;odB8JM9`q90&$Z1{J2*k!-b!8nm}A z70kuVoioeL)Hiw3$W62=f@QqQ#yfD+?}mpn7{brfDhHuY9j)Qqxa>UCe{$~Cd88~G z8-0kYJ(F$u*5)~?m1?&uxa%zFmXp(3$ju+>vqYXEF(f!^D18{@xf=E2NwuY;@|ZT;_CPAPtp%!XnRo=7D1))O1j)uk&Y(9HCmg z5q})}Q|DiLxY`~037Z!UrAp(}=P>-uR_Cf#OU}!d!^;m;$BxVcAJXx@Y)1P%trk-E zX1aLS9xbsaBNRe*qNbXw+DB0;BwI39(WR}_c<|J$efCCK$CCJR;*rOM5a))Q>J=?j zxwl|OsY5MC(E;YAUBEFD2#_2k&dM{H9E}E#j3r z>z7G%s=2a-G}9uJFD#b1r{NP6P%pO|d+%_A6G?E- zI)i+k4tn`^C38FezVaL=SZ#n^M%*|!*5FPUd_mY|38$u!woDC|5^Agsf-O;pq(EC> zCV>JMDyZ3l4HmK}mICbq1@d2kWfcIgM_?W7o}51FG292sG#1DK+ydZAohMh``UBVn zU~#1CdiU(3*yqqlzTk&e-UAzMBJdRL)$Tf3SRextG#z9A(-|V9GwEjt%0R7d-iQ&Z zCxH(E=TCP$_A2Ao;wGr4-+MJN<|3!?u?dl}e}cNGp}>~=+T46SAzdiKMz&TI%m*U& z_9g@uObq2o;ZZqA$IL>a{3$k&)r1bC??O36K&IIT<4WQXo>>S+=2tgJ7RW*pTI(*2ZXn9eoFRQQ_P>iJj0*7+pc45u=9 z+na;{DWB%))Awnw{z(&NR?X$;PgV^N*eXSh(jJTY@95ZeMV&g$dN;o~X=zrPZ@$hP zu&s;_;4#^hxluzc1&f1ZEWH^azjPrPI9$6wpy2zrt>4L8_!{|5`ePOiX!-g)wMX5@;>rc5voOtF(Ak#oao(_S?8;!fv!s2PZk zSU|?`QHE^Cm0?B?>5YRQQ^q9^ueN9&)0sW%z?PR;x!kB+?68Uf-ms)%ylbm&5^-nL z3z?^5TpRwX3i<*#rd>*(8@w&>(O%w-f(@jBc>Q-V1`+^K8uJina;zo0nnd(} zzOTHM>H{WH2P;$#Hrb{&CV)L&zik2#OG58s=qTCDoXp%6MH&St`^J$&bZmjY`$3Ww z(QwZqQSkN22W)m&EIEWt9s7~}%z03`JyyXtr@cM&+qX^L%UHN^?sx^{0n6@`P(Tj( z1G8Os(^-3%%|jGvt!(#qBo)*<*A@q55RlXNb-A7p5_&zqI3eUs5O+-%`kChhJb}aZ zzs}WR;U~0EpdBfN0O=M8_>l4Q;K6Q)G7$VBgX}7N_BIr_s&%=KsU;E@OL^QFyG4?M z_FjCQ!5rmI&3&sj%Y% zT#NTkouy7Fr$jxiBj^j}Dv9+vISdJ+z~+7cMCv^m5-o{)@5@~QtpFkjNJZNig5I|% zEpB;FiUAQ?;v!pdNPn!Rv}=9fPHYpx- zh6%9o#F}$6a_tKa;NIBm=)}2OSD*plCpQp^E=Q;ECUlTx9kD*+YbAQ8bIQC&JPX^)P)GOG6qSwAjR1o z%O9Ki4;37&oX{PnL@c)u8f^5$f{RR9SFto=n7)HV$G_F;nl!s7p~;w7|A9;_za zVx*VEkV^r8Wa9r!U@vce_ZNW|`WMqA0CA0HX9F#m5(=V02I-1rfSZ}@y05)pf}WWI zNT+PLR?JMLaQ6o36CY?hU8sY(3zI4eNIw1BrHi`QV1;M3{~=**Bp5De0W$%LZrBkH zz$%bEm!i+{1z%3W7Y>%YS0ykx0JQ+qkiGn404NT~md&0LyS0CfY+4&=^E+l1X}NG4O@%wu2{rlLA)o!FcHp$S@&` z(o(FR!h~7t&@6^&0QX5ZCMdE8yw6}F(D}Fg8Qis*DJk6Th69L>HkQkBD26jmlZEQu zNxsA|0ALmlCPTMXr=>h>vVB2&6d0VT2cvmSvFZ>0vHAbjNFA8JgaUidVbU=CW^6dw zyHzHPU*I?{f{{BW0L=7N5Y8<;uLU2N-8Uznb#?*PSbJ;!U)plCR-33+0iY`7GkWk( zvDlq3=!GVn1}QB;Fm}$jyU1Rse0#YLp1S4tUtN~r0wKV)vV#v3G2JauIf(unV!&ee z@@CMG0g(MffvlSA1KO05tZaAC^S(k}y)vGLJIwCHWTqu(0-n1A-};MEWmq z!)~wets2ARg-Ysa0bODR`gujzXHSK5cJ@Y7ZG%s2X`zCama88_3R%DZGWqP;lx7$* z=S6*HK5u8}@8L$7r{1R{X*;)|t*Y=i%CQycx&eNk_!$zoe4#eqWIsUg*xbA{p>|7x zGrtly=Mn$y%j?6=fb)Y}atexDdCr?VRJZT-T&ehPOG(}Q&kvSYLAfc_@!@+kOX11U zbD}GKY0{!9kG~)O&{vCB+}JZ~yr61k61w&F^Sd~2RY0BD7)7{@8CF~!&a7U1uf2V> zdaj}x$fT$A<4oC~j!HPFv4J#b_0>++5lj*SzK^sn$xu){8p;mexyPBvwJ{8;m^^%8 z=AN8eigo%#^&{QAII_%{W~YZ4`9$Q6Zc3VCQ{rpo9VYi~*eb7a$y?ao#eyGz04+5= J)!K(}#D9mB#vT9w literal 0 HcmV?d00001 diff --git a/web/assets/images/logo.svg b/web/assets/images/logo.svg new file mode 100644 index 000000000..ac3f9b784 --- /dev/null +++ b/web/assets/images/logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/web/assets/images/moderator.svg b/web/assets/images/moderator.svg new file mode 100644 index 000000000..24940eb97 --- /dev/null +++ b/web/assets/images/moderator.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/web/stories/ImageAsset.tsx b/web/stories/ImageAsset.tsx new file mode 100644 index 000000000..ec8adff80 --- /dev/null +++ b/web/stories/ImageAsset.tsx @@ -0,0 +1,77 @@ +import PropTypes from 'prop-types'; + +export function ImageAsset(props) { + const { name, src } = props; + + const containerStyle = { + borderRadius: '20px', + width: '12vw', + height: '12vw', + minWidth: '100px', + minHeight: '100px', + borderWidth: '1.5px', + borderStyle: 'solid', + borderColor: 'lightgray', + overflow: 'hidden', + margin: '0.3vw', + }; + + const colorBlockStyle = { + height: '70%', + width: '100%', + backgroundColor: 'white', + }; + + const colorDescriptionStyle = { + textAlign: 'center', + color: 'gray', + fontSize: '0.8em', + }; + + const imageStyle = { + width: '100%', + height: '80%', + backgroundRepeat: 'no-repeat', + backgroundSize: 'contain', + backgroundPosition: 'center', + marginTop: '5px', + backgroundImage: `url(${src})`, + }; + + return ( +
+ +
+ ); +} + +Image.propTypes = { + name: PropTypes.string.isRequired, +}; + +const rowStyle = { + display: 'flex', + flexDirection: 'row', + flexWrap: 'wrap', + // justifyContent: 'space-around', + alignItems: 'center', +}; + +export function ImageRow(props) { + const { images } = props; + + return ( +
+ {images.map(image => ( + + ))} +
+ ); +} + +ImageRow.propTypes = { + images: PropTypes.arrayOf(PropTypes.object).isRequired, +}; diff --git a/web/stories/Colors.stories.mdx b/web/stories/StyleGuide.stories.mdx similarity index 65% rename from web/stories/Colors.stories.mdx rename to web/stories/StyleGuide.stories.mdx index e1fc9be5f..70e801a66 100644 --- a/web/stories/Colors.stories.mdx +++ b/web/stories/StyleGuide.stories.mdx @@ -1,5 +1,13 @@ import { Canvas, Meta, Story } from '@storybook/addon-docs'; import {Color, ColorRow} from './Color'; +import {Image, ImageRow} from './ImageAsset'; + +import Logo from '../assets/images/logo.svg'; +import FediverseColor from '../assets/images/fediverse-color.png'; +import FediverseBlack from '../assets/images/fediverse-black.png'; +import Moderator from '../assets/images/moderator.svg'; +import IndieAuth from '../assets/images/indieauth.png'; +import IsBot from '../assets/images/bot.svg'; @@ -8,10 +16,26 @@ import {Color, ColorRow} from './Color'; `} -# Images +export const images = [{ + src: Logo, + name: 'Logo', +}, { + src: FediverseColor, + name: 'Fediverse Color', +},{ + src: FediverseBlack, + name: 'Fediverse Black', +}, { + src: Moderator, + name: 'Moderator', +}, { + src: IndieAuth, + name: 'IndieAuth', +}, { + src: IsBot, + name: 'Bot Flag', +}]; - - # Colors @@ -43,10 +67,22 @@ import {Color, ColorRow} from './Color'; # Font +[Inter font](https://rsms.me/inter/) + {getComputedStyle(document.documentElement).getPropertyValue('--theme-font-family')} -[Inter font](https://rsms.me/inter/) \ No newline at end of file +# Images + + + + + + + + + +