21 files changed, 146 insertions, 35 deletions

diff --git a/src/assets/blog/2025-02-24.md b/src/assets/blog/2025-02-24.md
index 6d2bf93..88bf891 100644
--- a/src/assets/blog/2025-02-24.md
+++ b/src/assets/blog/2025-02-24.md
@@ -257,8 +257,8 @@ to use that. There is alot about guix that I love, but I ran into too many
 problems. I am able to have my declarative system with nix without the hassle
 of guix.
 
-You can see my guix configuration [here](https://g.freya.cat/freya/dotfiles-guix)
-and my nix configuration [here](https://g.freya.cat/freya/dotfiles-nix). If you
+For reference here are the links to my [guix configurationhere](https://g.freya.cat/freya/dotfiles-guix)
+and my [nix configuration](https://g.freya.cat/freya/dotfiles-nix). If you
 are trying to learn or switch to either system, you can use them as a good
 resource. You can also view the guix repository I created called [sakura](https://g.freya.cat/freya/sakura)
 when I had to package things. If you need a recommendation to use either GUIX
diff --git a/src/assets/blog/2025-03-11.md b/src/assets/blog/2025-03-11.md
index 39f554d..412314f 100644
--- a/src/assets/blog/2025-03-11.md
+++ b/src/assets/blog/2025-03-11.md
@@ -72,7 +72,7 @@ In an itemized list this guide will:
 Flauncher is a launcher (default user interface) for Google TVs. It is simple
 and just shows the installed apps on the tv, no ads, nothing else. I am using a
 fork of flauncher that includes some fixes and improvements, but you can also
-just use the original [here](https://gitlab.com/flauncher/flauncher).
+[just use the original](https://gitlab.com/flauncher/flauncher).
 
 2. Removing all preinstalled applications
 
@@ -191,7 +191,7 @@ adb shell pm enable --user 0 com.mediatek.wwtv.tvcenter
 ```
 
 If that doesnt work try looking at the path `/system_ext/priv-app/LiveTV` as
-that is where I found the apk. I also have a mirror for it [here](/public/blog/LiveTV.apk).
+that is where I found the apk. [I also have a mirror for it](/public/blog/LiveTV.apk).
 
 #### 2. Removing preloaded applications
 
diff --git a/src/public/img/background.jpg b/src/public/img/background.jpg
deleted file mode 100644
index 79a8a12..0000000
--- a/src/public/img/background.jpg
+++ /dev/null
diff --git a/src/public/img/background.png b/src/public/img/background.png
index ea5fc7e..5b58f01 100644
--- a/src/public/img/background.png
+++ b/src/public/img/background.png
diff --git a/src/public/img/background.webp b/src/public/img/background.webp
new file mode 100644
index 0000000..e5275e2
--- /dev/null
+++ b/src/public/img/background.webp
diff --git a/src/public/img/headerLogo.png b/src/public/img/headerLogo.png
index c829aa2..b92ddaf 100644
--- a/src/public/img/headerLogo.png
+++ b/src/public/img/headerLogo.png
diff --git a/src/public/img/headerLogo.webp b/src/public/img/headerLogo.webp
index 5596d1d..e92ca7e 100644
--- a/src/public/img/headerLogo.webp
+++ b/src/public/img/headerLogo.webp
diff --git a/src/scss/_mixins.scss b/src/scss/_mixins.scss
index 0879b18..25eb0c1 100644
--- a/src/scss/_mixins.scss
+++ b/src/scss/_mixins.scss
@@ -65,13 +65,13 @@
 @mixin font-face($name) {
 	@font-face {
 		font-family: $name;
-		src: url("../font/" + $name + ".eot");
-		src: url("../font/" + $name + ".eot?#iefix") format("embedded-opentype"),
-			 url("../font/" + $name + ".woff2") format("woff2"),
-			 url("../font/" + $name + ".woff") format("woff"),
-			 url("../font/" + $name + ".ttf") format("truetype"),
-			 url("../font/" + $name + ".otf") format("opentype"),
-			 url("../font/" + $name + ".svg#" + $name) format('svg');
+		src: url("WEB_ROOTpublic/font/" + $name + ".eot");
+		src: url("WEB_ROOTpublic/font/" + $name + ".eot?#iefix") format("embedded-opentype"),
+			 url("WEB_ROOTpublic/font/" + $name + ".woff2") format("woff2"),
+			 url("WEB_ROOTpublic/font/" + $name + ".woff") format("woff"),
+			 url("WEB_ROOTpublic/font/" + $name + ".ttf") format("truetype"),
+			 url("WEB_ROOTpublic/font/" + $name + ".otf") format("opentype"),
+			 url("WEB_ROOTpublic/font/" + $name + ".svg#" + $name) format('svg');
 		font-weight: normal;
 		font-style: normal;
 		font-display: swap;
@@ -89,3 +89,9 @@
 	-dt-display: table-cell;
 	display: table-cell;
 }
+
+@mixin background-image($fallback, $sources...) {
+	background-image: $fallback;
+	background-image: -webkit-image-set(#{$sources});
+	background-image: image-set(#{$sources});
+}
diff --git a/src/scss/blog.scss b/src/scss/blog.scss
index 6fad483..665c5a4 100644
--- a/src/scss/blog.scss
+++ b/src/scss/blog.scss
@@ -17,6 +17,12 @@
 		max-width: $page-width - $outer-gap * 2 - $inner-gap;
 	}
 
+	code {
+		display: inline-block;
+		max-width: 100%;
+		overflow-x: scroll;
+	}
+
 	img {
 		margin: $inner-gap;
 		max-width: 100%;
diff --git a/src/scss/main.scss b/src/scss/main.scss
index b9ef3ee..f750dea 100644
--- a/src/scss/main.scss
+++ b/src/scss/main.scss
@@ -38,6 +38,15 @@ h1 {
 	font-size: 325%;
 	line-height: 100%;
 	margin: 15px 0;
+
+	@media (max-width: 400px) {
+		font-size: 300%;
+		margin: 12px 0;
+	}
+
+	@media (max-width: 340px) {
+		font-size: 250%;
+	}
 }
 
 h2 {
@@ -45,6 +54,15 @@ h2 {
 	font-size: 200%;
 	line-height: 100%;
 	margin: 12px 0;
+
+	@media (max-width: 400px) {
+		font-size: 175%;
+		margin: 9px 0;
+	}
+
+	@media (max-width: 340px) {
+		font-size: 165%;
+	}
 }
 
 h3 {
@@ -52,6 +70,15 @@ h3 {
 	font-size: 150%;
 	line-height: 100%;
 	margin: 5px 0;
+
+	@media (max-width: 400px) {
+		font-size: 125%;
+		margin: 4px 0;
+	}
+
+	@media (max-width: 340px) {
+		font-size: 120%;
+	}
 }
 
 h4 {
@@ -59,6 +86,14 @@ h4 {
 	font-size: 130%;
 	line-height: 100%;
 	margin: 2px 0;
+
+	@media (max-width: 400px) {
+		font-size: 120%;
+	}
+
+	@media (max-width: 340px) {
+		font-size: 115%;
+	}
 }
 
 a,
@@ -76,13 +111,17 @@ html {
 	color: $white;
 	font-family: $font;
 	font-size: 120%;
-	background: #181818;
 }
 
 body {
-	background-image: url("../img/background.jpg?ref=2");
+	@include background-image(
+	  url("WEB_ROOT/public/img/background.png?ref=4"),
+	  url("WEB_ROOT/public/img/background.webp?ref=4") type("image/webp"),
+	  url("WEB_ROOT/public/img/background.png?ref=4") type("image/png")
+	);
 	background-repeat: repeat;
 	background-size: 512px;
+	background-color: #181818;
 }
 
 .center {
@@ -361,3 +400,7 @@ body {
 		}
 	}
 }
+
+#main #ad {
+	padding: $inner-gap;
+}
diff --git a/src/web/_model/blog.php b/src/web/_model/blog.php
index 6446564..cabbc9f 100644
--- a/src/web/_model/blog.php
+++ b/src/web/_model/blog.php
@@ -42,7 +42,7 @@ class Blog_model extends Model {
 		$base = $this->get_url('');
 
 		$replace = "<a href=\"{$base}\\1\">";
-		$replace .= ie('<center>') . "<img class=\"center\" src=\"{$base}\\1\" title=\"\\2\" alt=\"\\2\">" . ie('</center>');
+		$replace .= ie('<center>') . "<img class=\"center\" src=\"{$base}\\1\" alt=\"\\2\">" . ie('</center>');
 		$replace .= "</a>";
 
 		$md = preg_replace($pattern, $replace, $md);
diff --git a/src/web/_views/blog/rss.php b/src/web/_views/blog/rss.php
index 121b747..830ae34 100644
--- a/src/web/_views/blog/rss.php
+++ b/src/web/_views/blog/rss.php
@@ -1,5 +1,6 @@
 <?php /* Copyright (c) 2024 Freya Murphy */ ?>
-<rss version="2.0">
+<?php echo '<?xml version="1.0" encoding="UTF-8"?>'?>
+<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
 	<channel>
 		<title><?=lang('title')?></title>
 		<link><?=$this->get_url('blog')?></link>
diff --git a/src/web/_views/bucket/main.php b/src/web/_views/bucket/main.php
index aeb6cf3..b85c773 100644
--- a/src/web/_views/bucket/main.php
+++ b/src/web/_views/bucket/main.php
@@ -1,13 +1,13 @@
 <?php /* Copyright (c) 2024 Freya Murphy */ ?>
-    <?php
-        $root='https://webring.bucketfish.me/redirect.html?to=%s&name=' . $name;
-        $this->view('head', $data);
-        if ($lightmode === 'true') {
-            echo $this->link_css('css/bucket_light.css');
-        } else {
-            echo $this->link_css('css/bucket.css');
-        }
-    ?>
+<?php
+    $root='https://webring.bucketfish.me/redirect.html?to=%s&name=' . $name;
+    $this->view('head', $data);
+    if ($lightmode === 'true') {
+        echo embed_css_ext('css/bucket_light.css');
+    } else {
+        echo embed_css_ext('css/bucket.css');
+    }
+?>
         <base target="_parent" />
     </head>
     <body>
diff --git a/src/web/_views/footer.php b/src/web/_views/footer.php
index 067bb2a..1f1ad30 100644
--- a/src/web/_views/footer.php
+++ b/src/web/_views/footer.php
@@ -7,11 +7,15 @@
 		$footer_text = '';
 	}
 ?>
+				<div id="ad" class="section ad-slot" role="region">
+					<span class="ad-slot">
+						<?=lang('adblock_notice')?>
+					</span>
+				</div>
 			</div>
 		</div>
 		<div id="footer" role="contentinfo" aria-label="footer">
-			<?=lang('license_pre')?>
-            <a href="https://opensource.org/license/mit/">MIT License</a>
+			<?=lang('license')?>
 			<br>
 			<?=lang('copyright')?> <?=lang('first_name')?> <?=lang('last_name')?> <?=date('Y')?>
 			<br>
@@ -23,10 +27,10 @@
 				<?=image('buttons/vim', 'alt_button_vim', animated: TRUE, width: '88', height: '30')?>
 				<?=image('buttons/gnu-linux', 'alt_button_gnu_linux', width: '88', height: '30')?>
 				<a href="https://www.eff.org/join">
-					<?=image('buttons/eff', 'alt_button_eff', width: '96', height: '30')?>
+					<?=image('buttons/eff', 'alt_button_eff', 'title_button_eff', width: '96', height: '30')?>
 				</a>
 				<a href="https://citrons.xyz/a/memetic-apioform-page.html">
-					<?=image('buttons/apiopage', 'alt_button_apiopage', width: '81', height: '30')?>
+					<?=image('buttons/apiopage', 'alt_button_apiopage', 'title_button_apiopage', width: '81', height: '30')?>
 				</a>
 			</div>
 			<br>
diff --git a/src/web/_views/head.php b/src/web/_views/head.php
index 1ca6954..8cd6f87 100644
--- a/src/web/_views/head.php
+++ b/src/web/_views/head.php
@@ -1,4 +1,19 @@
 <?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php
+	/* Html cache headers */
+	$current_app = ROUTER->req['app'];
+	$non_cached_apps = ['blog'];
+
+	if (ENVIRONMENT == 'production' && !in_array($current_app, $non_cached_apps)) {
+		$cache_seconds = 300;
+		if ($current_app == 'bucket') {
+			$cache_seconds = 3600;
+		}
+		header("Cache-Control: public, max-age=$cache_seconds");
+		header("Expires: " . gmdate('D, d M Y H:i:s', time() + $cache_seconds) . " UTC");
+		header("Pragma: cache");
+	}
+?>
 <!DOCTYPE html>
 <html lang="<?=lang('lang_short')?>">
 	<head>
@@ -21,10 +36,18 @@
 		<link rel="icon" type="image/png" sizes="512x512" href="<?=$this->get_url("public/icons/logo512.png", TRUE)?>">
 		<link rel="icon" type="image/png" sizes="640x640" href="<?=$this->get_url("public/icons/logo640.png", TRUE)?>">
 		<link rel="manifest" href="/manifest.json">
+	<?php if ($current_app != 'bucket'): ?>
+		<link rel="preload" href="<?=$this->get_url("public/font/FontStuck-Extended.woff2")?>" as="font" type="font/woff2" crossorigin>
+		<link rel="preload" href="<?=$this->get_url("public/font/CourierNew.woff2")?>" as="font" type="font/woff2" crossorigin>
+		<link rel="preconnect" href="https://john.citrons.xyz">
+	<?php else: ?>
+		<link rel="preload" href="<?=$this->get_url("public/font/Merriweather.woff2")?>" as="font" type="font/woff2" crossorigin>
+	<?php endif ?>
 		<?php
 			/* Main CSS */
-			if (ROUTER->req['app'] != 'bucket')
-				echo $this->link_css('css/main.css');
+			if (ROUTER->req['app'] != 'bucket') {
+				echo embed_css_ext('css/main.css');
+			}
 
 			/* IE 4-7 Styles */
 			echo ie($this->embed_css('css/ie/ie.css'));
diff --git a/src/web/_views/header.php b/src/web/_views/header.php
index f6b4740..5eb528a 100644
--- a/src/web/_views/header.php
+++ b/src/web/_views/header.php
@@ -7,7 +7,7 @@
 <?=ie('<center>')?>
 <div class="center">
 	<div id="header" role="banner" aria-label="banner">
-		<?=image('img/headerLogo', 'alt_website_logo', size: '200')?>
+		<?=image('img/headerLogo', 'alt_website_logo', 'title_website_logo', size: '200')?>
 		<div class="content">
 			<h1 class="logo-text">
 				<?=lang('first_name')?>
diff --git a/src/web/_views/home/main.php b/src/web/_views/home/main.php
index 22cc856..fc3799a 100644
--- a/src/web/_views/home/main.php
+++ b/src/web/_views/home/main.php
@@ -57,3 +57,6 @@
 	</div>
 </div>
 
+<?=aria_section('android', lang('android'))?>
+	<p><?=lang('section_android')?></p>
+</div>
diff --git a/src/web/lang/common.php b/src/web/lang/common.php
index aef1ede..fc6401e 100644
--- a/src/web/lang/common.php
+++ b/src/web/lang/common.php
@@ -22,18 +22,25 @@ $lang['action_blog_tip'] = 'View my blog';
 $lang['alt_button_eyes'] = 'Best viewed with eyes';
 $lang['alt_button_vim'] = 'Edited with VIM';
 $lang['alt_button_gnu_linux'] = 'Made with GNU/Linux';
-$lang['alt_button_eff'] = 'Support the Electronic Frontier Foundation!';
+$lang['alt_button_eff'] = 'Electronic Frontier Foundation logo';
 $lang['alt_button_apiopage'] = 'Memetic apiopage';
 $lang['alt_website_logo'] = 'Website Logo';
 
+# common title text
+$lang['title_button_eff'] = 'Support the Electronic Frontier Foundation!';
+$lang['title_button_apiopage'] = 'Click for more memetic apiopage\'s';
+$lang['title_website_logo'] = 'Freya';
+
 # misc
 $lang['john_title'] = 'Johnvertisement';
 $lang['bucket_title'] = 'Bucket Webring';
-$lang['license_pre'] = 'This site is licensed under the';
+$lang['license'] = 'This is licensed under the
+			<a href="https://opensource.org/license/mit/">MIT License</a> (code) and the
+			<a href="https://creativecommons.org/licenses/by-sa/4.0">CC BY-SA 4.0</a> (text).';
 $lang['copyright'] = 'Copyright (c)';
 
 # footer_text
-$lang ['footer_text'] = [
+$lang['footer_text'] = [
 	"Always look on the bright side of life",
 	"🐝 powder",
 	"Submit to john",
@@ -53,3 +60,7 @@ $lang ['footer_text'] = [
 	"Help im stuck inside footer text!",
 	"abort: no x11 display server found",
 ];
+
+$lang['adblock_notice'] = "You aren't using an adblocker! Install
+	<a href='https://chromewebstore.google.com/detail/ublock-origin-lite/ddkjiahejlhfcafbddmgiahcphecmpfh'>uBlock Origin Lite (Chrome)</a> or
+	<a href='<C-2-LeftMouse>'>uBlock Origin (Firefox)</a>.";
diff --git a/src/web/lang/home.php b/src/web/lang/home.php
index c544f7c..70797ef 100644
--- a/src/web/lang/home.php
+++ b/src/web/lang/home.php
@@ -10,6 +10,8 @@ I make cool programming projects, work as a software developer, and lurk on the
 interwebz. You can find me tinerking with systems programming, networking, and
 declarative linux distros.
 ';
+$lang['android'] = 'Save Android';
+$lang['section_android'] = 'Android will become a locked-down platform after September 2026. If you care are about software freedom, care about sideloading, or sick of companies locking down your devices, read the <a href="https://keepandroidopen.org/">open letter to Google about their Developer Verification Program.</a>';
 
 $lang['whats_new'] = 'Whats New?';
 $lang['section_whats_new'] = '
diff --git a/src/web/lib/html.php b/src/web/lib/html.php
new file mode 100644
index 0000000..9649bf4
--- /dev/null
+++ b/src/web/lib/html.php
@@ -0,0 +1,8 @@
+<?php /* Copyright (c) 2024 Freya Murphy */
+
+
+function embed_css_ext(string $file) {
+	$css = Base::embed_css($file);
+	$web_root = Base::get_url('');
+	return str_replace("WEB_ROOT", $web_root, $css);
+}
diff --git a/src/web/lib/image.php b/src/web/lib/image.php
index 7b6ec0e..a36b985 100644
--- a/src/web/lib/image.php
+++ b/src/web/lib/image.php
@@ -41,6 +41,7 @@ function __make_source(
 function image(
 	$name,
 	$alt,
+	$title = NULL,
 	$formats = array('webp', 'png'),
 	$animated = FALSE,
 	$attrs = array(),
@@ -75,7 +76,10 @@ function image(
 	if ($alt) {
 		$alt = lang($alt);
 		$attrs['alt'] = $alt;
-		$attrs['title'] = $alt;
+	}
+	if ($title) {
+		$title = lang($title);
+		$attrs['title'] = $title;
 	}
 	if ($width) {
 		$attrs['width'] = $width;