From 3c7901ff7a04629bd182c8b322c2de7489ff2195 Mon Sep 17 00:00:00 2001 From: Filip Rojek Date: Mon, 20 Nov 2023 16:52:40 +0100 Subject: [PATCH] css layout --- config.toml | 2 +- sass/global.scss | 13 +++++ sass/header.scss | 22 ++++++-- sass/main.scss | 27 ++++++++++ sass/vars.scss | 8 +++ static/img/pkmples_logo.png | Bin 0 -> 6827 bytes static/svg/facebook.svg | 12 +++++ static/svg/instagram.svg | 1 + static/svg/youtube.svg | 1 + templates/base.html | 99 ++++++++++++++++++++++++++++++++---- 10 files changed, 170 insertions(+), 15 deletions(-) create mode 100644 sass/global.scss create mode 100644 sass/main.scss create mode 100644 sass/vars.scss create mode 100644 static/img/pkmples_logo.png create mode 100644 static/svg/facebook.svg create mode 100644 static/svg/instagram.svg create mode 100644 static/svg/youtube.svg diff --git a/config.toml b/config.toml index 04f98a6..8756aba 100644 --- a/config.toml +++ b/config.toml @@ -6,7 +6,7 @@ description = "PKM, kamarádi z Gymnázia Turnov pořádají ples pro studenty v default_language = "cs" compile_sass = true -minify_html = true +minify_html = false # Whether to build a search index to be used later on by a JavaScript library build_search_index = false diff --git a/sass/global.scss b/sass/global.scss new file mode 100644 index 0000000..c4d89ae --- /dev/null +++ b/sass/global.scss @@ -0,0 +1,13 @@ +* { + padding: 0; + margin: 0; + box-sizing: border-box; +} + +body { + font-family: 'Kanit', sans-serif; +} + +main { + margin: 0 var(--container-size); +} \ No newline at end of file diff --git a/sass/header.scss b/sass/header.scss index ab8b44a..c97eb2f 100644 --- a/sass/header.scss +++ b/sass/header.scss @@ -1,11 +1,27 @@ nav { display: flex; - justify-content: center; - gap: 1rem; + justify-content: space-between; + background-color: var(--clr-melon); + padding: 1rem var(--container-size); + + .nav-right, .nav-left { + display: flex; + align-items: center; + gap: 2rem; + } a { text-decoration: none; font-size: 1.5rem; - color: navy; + font-weight: bold; + color: var(--clr-murrey); + } + + img { + height: 2rem; + } + + .nav-left img { + height: 4rem; } } \ No newline at end of file diff --git a/sass/main.scss b/sass/main.scss new file mode 100644 index 0000000..96d7e82 --- /dev/null +++ b/sass/main.scss @@ -0,0 +1,27 @@ +main { + display: flex; + section#news { + width: 60vw; + } + aside { + width: 40vw; + display: flex; + flex-direction: column; + align-items: center; + margin: 2rem 0; + + a.vstupenky { + background-color: orange; + width: 80%; + padding: 1rem 2rem; + color: var(--clr-murrey); + text-decoration: none; + font-weight: bold; + font-size: 3rem; + border-color: var(--clr-murrey); + border-radius: 15px; + border-style: solid; + border-width: 3px; + } + } +} diff --git a/sass/vars.scss b/sass/vars.scss new file mode 100644 index 0000000..2839ada --- /dev/null +++ b/sass/vars.scss @@ -0,0 +1,8 @@ +:root { + --clr-blue: #576ca8; + --clr-lavender: #d3d2ef; + --clr-murrey: #79214c; + --clr-blush: #cf6379; + --clr-melon: #ffadad; + --container-size: 40rem; +} diff --git a/static/img/pkmples_logo.png b/static/img/pkmples_logo.png new file mode 100644 index 0000000000000000000000000000000000000000..28aafb93853c4363198dedc42341e089be8c5bb4 GIT binary patch literal 6827 zcmV;c8dT+pP)+7nz;k)^+&YX3Nv}g@z z4crqN$fp5)PrOI{5LyF50~*kJB4`cVLmJS4zK33>eiW?%4QM?Fvyg?lQe7Q zTFT1G^8J=SUp^W%qyyc$b&KZD-C%qF=U*C36)KeW`|aR?<23unwYKeFfAeuFUcAUX z^s4luXbq?};0e&y?ix3#N&N@3BLLkEpidl6rfE}F(#@NhzOER{H0Y5I)TnVy+Pmkd z6wv(#wWFp@Yx@mh)yf^TdDA`(X!U#6E%Jy4f&w&j)Une;)Uk6jC7@H1&(Zha{zQNL zal;SH0|vFHhnmz9e{%wK^A>feZ~s`o*Mj~|98b}J&LfjmKc-p(j)1OE>3*sbRW`eq zTlwhf)oYY^DwQ&>{^9GnK>mF6;>$y6+HWbtMVXg#5|222_V2+*)p&z!#6*G-$Y4e8po z>wbW)S+fe=;O+3qlV|)C-luOHYSFT;?Mui7XjshH@@+`>o)1%-*oNYN7cXS1`mSuN zx}}-;n_i*yJkN_7@C<0Un|_?Jh7KP}^yzEh;P!OlM2a7v?UY%+L3J8BtdmsFRzTwn zZ(iNa*H8R%A*G(lUim9Wm80aOG{1f|p!4E%*3aw+=xWgwsRpmKhGg)z`qRY^9wP`@xw(Qq{*7G^fYanR16~NT9SIb;(E171acr|_M*?yFt!EF^Qpb?yM-+cvW z-`-=srmy|wG5(;W)0FR4`2L0f7W0{2Z@KgQyw0-<2nx_xK_3~~QCOa>fhC4U3l}cv z=X=KAyLN9uZQC_+1?XC}s?gFUTYPOF8{U;tQ!mh(RlkV8VTbU>o5ShD4`%2UI?qmH z{osZMJOLUJVP(sfPBlo>-nrT5Gg=I)2C0LrEk7kVs<3il2h} z58xyXj_a1K&B1M@k2#YG^>`O*{+FiC&@oUw*^^joUAnzk&9|AN3mv zTwo0w*N_4_ZqpuGy>h4DHLt!tj7pX&c1HmH&E%zYDlsSH%!;We$MmL{>e-1TTEe3N z4QRy*9Uisco4sm4-}(2d0j&WYvRSAB9Wqr0+>r*f26Vua$9ka#bjVa0a7P-@8qfhx z9u4S_sV-z4X+Ud0hio$G6*^?947ei=XbtFqCy!pCL#Dcrb)*3uB0z&E@BowC@85Hb z&Yef1L8?07>Z#M{sQ^)2mJED5PJB~DJD2LE7(Y`T)sxv{U{Zw}?Ds@e8ww2Q z6*_QDU%YsQ_WXL3KxK6y{W4`_To*+V;DU^ft}NycSZGudNv%#k9XWEEl1`;D z!)=COsYTvEv0_E|Utua+z7*B0Rh4RSbR)(Zs9a>ij>G)yNgM%rCiy(`@ntZD*A2SP zxI(T1;xd4zavTX+sZv=c8Hpk!JGl{`9~$|^n>Oy1UIXeNPyit?WWl_R{*=5nSCuMN zoO<1`QtCLEJx% zb%B>`m64-+x&pM9aa-HI{OV9DU8Y3H0w@0Q@oWN!WP%)Xe`3El$Tes|E#-06w3CERihG3&c)v0sW7QQ?L zH`gU5o}qPX;wjtCvP@c8-<9oAWFCuD+>HYjZq zDnV>GV#K`w8eqn@+DSB^0|PYj*0*Cq2O!{vM=GyXf&ug|+kd0w%eGRMhs8-Y^v+$I z@y_re>687mbSv%HelUP1x4#5j0;9(CvRx!y13K8z;DzFAW+$h(8pk)2mj(Uxvi6N! zY4i5m%>+B3W+Zap5RSfzY??p~9f}OxD)26IoyHk?m zv?_Cd35tp;PsK|V5#^@Nre35oTp7kmu;m6-we?sTFrZ7Zm9IQo;ci^dBov~P)tE95 zDym93!T)8J%a=3glMjDX4!%jV+Ejrp+Qmy0WrJLX-~m6l|AejK%G}xWFAn7Lx7mi3 zNCFzU+Jy?|Og`0z!u&gEmrC$+x*4y^=!1Um2BVnu`H`axT4q?1Q@0gZPO(8tWu$G*47fd*0oM><;zO>#Cc6%cTt7Y* z+8Mg=5tuW3Ex~9flgFRvN)OiYH)eVUbfH4`5s3AX+GtqYU>)4NX|E_)r#g~6{ain) zQYFW|w3l69^XIOY4jN?pqeu73_2t6_XH(NfsU36iJZncru63jV9g1wLdlAqehJ-!E z%*_r9{PJbne8i8k$pB`W*WMWBTa~=(=MuYDKmTNwBQQ&rEXqX`+fl9BRsDtm`mBZg zF|ZbNFgL>L4C9}%YJ$wtOmJy^E@T)!KBAj+?&HIQ50Fd@3T^Z6o&b$)#mG@T1k3}~=x%3KKO6fb20Gm@k+E2m7bl>}M7A+T=m-4{|hE#-oBJGpS3OzJm?5i5e*34nH08MK3V7gE+jGi<(x2DHD%Rr)|{9Jg@n zk_pbYpMN@s^V@SsAgyf?EAYsp9bLaq^O5BHZ@8W~AJt@H=NYlKb>g=}+otR%?$1RU zA*lHB>BqCA_rnLIPrq2(!i~m7Smkf>)*VEfS(&#O+*y=)lmDBQN!Tq%$5i&~-}MTO zuj(sYh6bHD306z2noeQ_PB=Dl@gufD-+jF-7d4UjQZr|nn=d-HOXFS~B>2ajL^Xk( zR_LVDX#}1$nSg}_dUiA3|1W1~6fabLoS~1ov)AzlK0&G*5K8{})ki%88oC_MtDRGf zgWZ|bIuO-18i6q5*lq*C@$-ZKovO4iVHenpcdm8nRU-ss1tYEj-HeI#`whtc@;C|3 z)9M!+J?_Owu|bct7e^SC9R59#W=vn@*bF;7uSP=|(WLoCZVDU%#CxjtfGwU0n3*!P1QNH7~#b+97KW;P%q*d(5PU6sugbJVy5s= z>|kIuh6~9_tS%>6TSS&QEhI1eX)pnpkQ8=5;T-LBjF8CbifIT}_mn zQi*Fon-BY{PA5-VEUHGzB(_~c4(ZErKbYGko=g={HCTPIA_ps80X>Q>>Ikn>iE08n zZMpN}3JvQtjEO3NtLOc9raCqo&X(cYY$5gn=>2;WXzrYKs@sR;_otreE9@|aU_K*S zEEvHN4ECT_ts6*<(&*ncphu7GmFoa58{n)T*Kl%0cI_!UvD?1Gb+LHiW|906O7RM4 zv)|fj92(I6+HukcR+_i}{-k44fw?!Fb)789#`fI{pm*&&L`xRMg>q_1`-0^f7HqTN zBaWmW)e%uOK6EbQ#~=kZs7Ho$%B54+fcBDN2i|R`l@{44{rIIo@Zu&-SU_<4 zyA}Auu`O=E>74Kln#;{v`_O>CJ0iv2`nM6%3?b_~1J|~bHQG4-c>y#stENx&=Yw}U z-@LX%W@4kp*}ihC+_;fR@w*O*VDmB5$^qpFiUF|xaeJgJiM0y>LNJNMXK*)pzb1&@k!0&i+66*_^~p zYML?GRjvg18pm;Acx1$u67%o>pk|@ySQCe09a`#(|_549S z0|v{3S&)hH*+1qwrox45%dLuNvJ0FybTaYFg_LTkm2Lb6!_mM0J;#7F{{0z_&lkf- zktf*$VJ8TFm^^6_rKQP3aU%t20C5~DLEiSy+KpGdPY(TbGIE+DvAnF%xF2$$vEaxA zyFjGdI#K+%1v?C1t9d8pBwhK~32GrHQOz@JhL z5$8S#%=n-jl1WRB+Un&HwWW&VM!(?#w91!^eASm;9wNx^%<|j86Eth)8tF4*!Xq%j zkgxx>MAX)HlJ*@NQ-@AX{oEKx3|O*gi(__>(Pt!9Xxs}aiKEB%whbS~@o~JKc=RPVX~E`9Kv{p_V8gCOCdjQo zj)ftf0F8?V9LXZ>61YctqQ}T1>lUWd` zzKPGx>(}p58WO?<=)?R{Q4!Ng5SQDrOH*MC0w3G4qsg?1Q%n&BClhmUKia6s8;yPt zv{8vuO%Z^A827X^_fd6`0yM^o82L_Jno(^wY8B$Sl+LW5VApOI8+{=v_Z!|Bb_C!SkO{(I5e_R8 z^Zn4qGoZ~K<2>ypqz&y~d2OgKV#tlNAFQFVv5lw{C&QoPts_F|_QW4?Ol~lbF?Kvlpn{~k#|2Qz=LGen$#AzlHE>lQ88=tu(T`#`e& z<^iV8y}xV;VW2v~l+vnq4ZFvmcvohGkhhaz;$L&*+Dq4-A zK>^y!q(NIN;{;ZcNqn9Rr-Td881std+X(4&p%R>@uuZoHV9dr=RFNkf%oy$zpuLV6 zWB?!q2nNsqCn$)Vm_WRa%V>|J9vle_Nlm>#UvZ3uis{5?j~x7>#fu7?i5uoyd<1ZTn!VxTo6!%o85S=6V_;h z`+UX5E#wP(l|r`z`kg4EA_C|j=Z_t`M<6RS^tW&CF`73=&XVI*$7m1hIEVtR1~p{W zVXGbvu{(pi1~f8|;2y$Z->U$`AlI{Ff`I!5Zk&KcF;T(^Xp9*VNN}BbIeOSVD_jq7 zLC6GjOEade6^U)F*t zCx}JL&~bE3B^u7bF2={x{0`CmPs^NHbpo0DV6z2rhjlmS8qgg(Hx(s0;PkhvC?OjZ z&K1LkcOke}WP;Gmojc?-LbB`dFn#;CWrNBAO64<$orD|E2B;Cg?z-}VWuQn)MXbFUg7KovFZR|9{FTXVSu$tFn~s1Sg98; zjPo>~tz$rLJyu8%^~%)y_zczgqwuQ@s+`D@zn0Qtk9$ zK#gtNK)BNsCKt zzCs1F3$pP_gWXE42dj!BNGO6BRF9&Hka9!4qq>JGmfM^kj`xfJj|2M?IOacH6g$M6 z!utiqP@Ou_B3sERLQpjxufJmLSGY@2H=OxylL;ZuFAU;=$X`qgc{X+Q(o zo4z96+G%yQMwQtO4z81l%*5&>aFwY@5mgVa0j<(dWPaCxj*OlIzRQF!7KnlZc7k)} z^UP3Mj_Vf7M3vbE-{+g0tL%oa%IP6ApaXuzA-zxoI;83heP{5O!Wt_R7@CHU=xz&0 zzUP2q+_d_gEg13DC1489Ky=-_o2_8#Ed{%RuEGQDnZAhq3@ix8bRclLVkVS}dOBENhf*FOgPOejSII+WTBye|#tz;$;=u0)t^94Ef- z-ub(yWDvx@gGmEfI^hrv=x}J&d!HK6-gS0YT!HiS(Zi=jy<>2WUA>YWdkm_a!bLc4 zyjT$`!-NS)?W<9_002ovPDHLkV1gtRPTBwf literal 0 HcmV?d00001 diff --git a/static/svg/facebook.svg b/static/svg/facebook.svg new file mode 100644 index 0000000..591d6f3 --- /dev/null +++ b/static/svg/facebook.svg @@ -0,0 +1,12 @@ + + + + + + + \ No newline at end of file diff --git a/static/svg/instagram.svg b/static/svg/instagram.svg new file mode 100644 index 0000000..be4a940 --- /dev/null +++ b/static/svg/instagram.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/svg/youtube.svg b/static/svg/youtube.svg new file mode 100644 index 0000000..8fc2648 --- /dev/null +++ b/static/svg/youtube.svg @@ -0,0 +1 @@ + youtube [#168] Created with Sketch. \ No newline at end of file diff --git a/templates/base.html b/templates/base.html index 08aa49a..47255b8 100644 --- a/templates/base.html +++ b/templates/base.html @@ -4,25 +4,102 @@ + + + + + + -
- {% block news %} {% endblock %} -
- - - +
+
+ {% block news %} {% endblock %} +
+ +
\ No newline at end of file