From 7e09edd11ea76f3794b53d5f01ed554f9a3bf673 Mon Sep 17 00:00:00 2001 From: etherware-novice <73374039+etherware-novice@users.noreply.github.com> Date: Fri, 2 Aug 2024 18:25:51 -0500 Subject: [PATCH] adds some basic background --- _includes/background.html | 4 ++++ _layouts/default.html | 1 + _sass/background.scss | 21 +++++++++++++++++++++ _sass/main.scss | 6 +++++- assets/images/decor/bluedither.png | Bin 0 -> 1013 bytes assets/images/decor/grass.png | Bin 0 -> 1495 bytes 6 files changed, 31 insertions(+), 1 deletion(-) create mode 100644 _includes/background.html create mode 100644 _sass/background.scss create mode 100644 assets/images/decor/bluedither.png create mode 100644 assets/images/decor/grass.png diff --git a/_includes/background.html b/_includes/background.html new file mode 100644 index 0000000..2609083 --- /dev/null +++ b/_includes/background.html @@ -0,0 +1,4 @@ +
+
+
+
diff --git a/_layouts/default.html b/_layouts/default.html index 5cdf6fd..9467d1c 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -15,6 +15,7 @@ navbar: topnav {% endif %} + {% include background.html %}
diff --git a/_sass/background.scss b/_sass/background.scss new file mode 100644 index 0000000..26dc790 --- /dev/null +++ b/_sass/background.scss @@ -0,0 +1,21 @@ +.background { + z-index: -99 !important; +} + +#bg-bluedither { + image-rendering: pixelated; + background-image: url('/assets/images/decor/bluedither.png'); + background-size: contain; + height: 100%; +} + +#bg-grass { + position: absolute; + width: 100%; + height: 50%; + background-image: url('/assets/images/decor/grass.png'); + background-repeat: repeat-x; + background-position: bottom; + background-size: auto 15vh; + bottom: 0; +} diff --git a/_sass/main.scss b/_sass/main.scss index e5f6d5f..dca39b6 100644 --- a/_sass/main.scss +++ b/_sass/main.scss @@ -2,6 +2,7 @@ @import "statuscafe"; @import "fonts"; @import "mobile"; +@import "background"; html { background-color: #2196F3; @@ -26,13 +27,16 @@ img { margin: 2px; } -.overlay { +.overlay, .background { pointer-events: none; position: fixed; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; +} + +.overlay { z-index: 1000001; } diff --git a/assets/images/decor/bluedither.png b/assets/images/decor/bluedither.png new file mode 100644 index 0000000000000000000000000000000000000000..eda099120beca45d49d36cdaf4bddc51011234cb GIT binary patch literal 1013 zcmds#v1^n848@<-L0V6!liJSWpdbWkacjMDp2$(ox;tfXanN14NnONAGB~)|p@o8z zE`m#k;Hcu{DmV!K0r8jb&oFTJeId!qdoSPf-PvTcd~sRQXnJcr=Xr|X)6*yUUpu?G z;Bn&7e6p>>FYCXgrDwZ$_I9cxtD?%QtV*3_Rz{^)TBW)eSrHXpVHN6L&+;huaw}Jl zT9!qbmsy!WDrG53Ua}Gi*g%8DFx~1s9g*pomZ@G#7Lnl@mZ4@r(Ief{EnQ8DUW+tO zvoyhx(Nv^7Whu788Zb!15?a()3^veUF{~EUIpGl&q1MM*GWT!`SIdP3Me{HV6Y3#F zZ^%OyLLPoVlWFWgKO|5HYrr54OIqQFW6h gR}QZB>yzR2xWEyz*LOekh$TP87Zh-XSl!d$dkR;2xqifSV~J?H)zo%`eL-TS`J`#jJ4 zeMfwi74F2$L?Uu~H<$TwTlm@W4*a**c2(mtLjHb;!x6H!c?Z(E>T=_8dAN^zx_ zQluj(l@v;HC7F_>lR_#Xl;BD*B}mtDskl&_E6x-r-O8k5LNTrwQ;dM5NGcMFxFV(q z0k8oLEHtB<^c;PJlw3+CCF!wBSi z7zuqCi-_TIi9QWlZgj!esNQFENt#sDcfH=Im6~JJ9lhx)*+#@b<@e7Lf1P^OueO(L+U7 z_dmJ7TX+BI+MRn^Un%yisagN`(4y_dGeaHDFY4#tu+HQrzif6^oQx(Q*badf4YZ#w0zT*6G~U#jNl^ezlc47|Dq>lecb;Tr)n6J03Qh-8Wx7R$7$m z3OcM?RZ}xt^46^qETMz9DrmYO7(adCyz|0$Mw0RMZ}`TiRHqLvUfa^JsG%h$Kk?g)EA-T$ zCm8UpewzwfjR%@vTV=MTCIzmI_HA64ymhQ8<;#cvvX52M+3vL~=4bXrEPvpF literal 0 HcmV?d00001