Print pagebreaks, inline width images

astro.config.mjs

@@ -23,6 +23,14 @@ export default defineConfig({
 				src: "./src/assets/fi_16.png"
 			},
 			social: [{ icon: 'github', label: 'GitHub', href: 'https://git.vojtechstruhar.com/Vojta/fi-notes' }],
+			head: [
+				{
+					tag: "script",
+					attrs: {
+						src: "/scripts/load-images-before-print.js"
+					}
+				}
+			],
 			customCss: [
 				"remark-github-alerts/styles/github-colors-light.css",
 				"remark-github-alerts/styles/github-colors-dark-class.css",
@@ -30,8 +38,9 @@ export default defineConfig({
 				"katex/dist/katex.min.css",
 				"./src/styles/theme.css",
 				"./src/styles/footnotes-fix.css",
-				"./src/styles/pixelated-logo.css",
+				"./src/styles/images-adjustment.css",
 				"./src/styles/scroll-fix.css",
+				"./src/styles/print-improvements.css",
 			],
 			sidebar: [
 				{

public/scripts/load-images-before-print.js

@@ -0,0 +1,8 @@
+function loadAllImages() {
+    document.querySelectorAll('img[loading="lazy"]').forEach(img => {
+        img.setAttribute('loading', 'eager');
+    });
+}
+
+// Before printing (manually or via browser)
+window.addEventListener('beforeprint', loadAllImages);

src/content/docs/szmgr/SZP09_zpracovani_obrazu.md

@@ -776,7 +776,7 @@ Inverzní funkce je velice užitečná, ale poměrně složitá, takže doufám,
 [^edge-detection]: [Wikipedia: Edge detection](https://en.wikipedia.org/wiki/Edge_detection)
 [^fourier]: [Wikipedia: Fourier transform](https://en.wikipedia.org/wiki/Fourier_transform)
 [^fft]: [Wikipedia: Fast Fourier transform](https://en.wikipedia.org/wiki/Fast_Fourier_transform)
-[^samping]: [Wikipedia: Sampling (signal processing)](<https://en.wikipedia.org/wiki/Sampling_(signal_processing)>)
+[^sampling]: [Wikipedia: Sampling (signal processing)](<https://en.wikipedia.org/wiki/Sampling_(signal_processing)>)
 [^scaling]: [Wikipedia: Image scaling](https://en.wikipedia.org/wiki/Image_scaling)
 [^n-s]: [Wikipedia: Nyquist–Shannon sampling theorem](https://en.wikipedia.org/wiki/Nyquist%E2%80%93Shannon_sampling_theorem)
 [^geometric-transform]: [Wikipedia: Geometric transformation](https://en.wikipedia.org/wiki/Geometric_transformation)

src/styles/images-adjustment.css

@@ -0,0 +1,43 @@
+.site-title img {
+    image-rendering: pixelated;
+}
+
+img[alt="width=30%"] {
+  width: 30%;
+  display: inline;
+}
+
+img[alt="width=69%"] {
+  width: 69%;
+  display: inline;
+}
+
+img[alt="width=49%"] {
+  width: 49%;
+  display: inline;
+}
+
+img[alt="width=200"] {
+    width: 200px;
+    margin: auto;
+}
+img[alt="width=300"] {
+    width: 300px;
+    margin: auto;
+}
+img[alt="width=400"] {
+    width: 400px;
+    margin: auto;
+}
+img[alt="width=500"] {
+    width: 500px;
+    margin: auto;
+}
+img[alt="width=600"] {
+    width: 600px;
+    margin: auto;
+}
+img[alt="width=700"] {
+    width: 700px;
+    margin: auto;
+}

src/styles/pixelated-logo.css

@@ -1,3 +0,0 @@
-.site-title img {
-    image-rendering: pixelated;
-}

src/styles/print-improvements.css

@@ -0,0 +1,6 @@
+@media print {
+    h2,
+    h3 {
+        break-after: avoid;
+    }
+}