diff --git a/config/global/scripts/figureview.js b/config/global/scripts/figureview.js
index 840f57f..0544cf7 100644
--- a/config/global/scripts/figureview.js
+++ b/config/global/scripts/figureview.js
@@ -7,6 +7,7 @@ document.addEventListener("DOMContentLoaded", function () {
closeButton = document.getElementById("close");
Array.from(images).forEach((img) => {
+ img.style.cursor = "zoom-in";
img.addEventListener("click", () => openFullscreen(img));
});
@@ -19,7 +20,7 @@ document.addEventListener("DOMContentLoaded", function () {
});
function openFullscreen(imgElement) {
- modal.style.display = "flex";
+ modal.style.display = "block";
modalImg.src = imgElement.currentSrc || imgElement.src;
altText.textContent = imgElement.alt;
diff --git a/config/global/styles/components/figures.css b/config/global/styles/components/figures.css
index 9ebad2a..e54958b 100644
--- a/config/global/styles/components/figures.css
+++ b/config/global/styles/components/figures.css
@@ -21,16 +21,13 @@ figcaption {
/* Fullscreen modal styling */
#fullscreenModal {
- display: none;
- flex-direction: column;
- justify-content: space-around;
- align-items: center;
+ display: none; /* Set to block with JS */
position: fixed;
- left: 0;
top: 0;
+ left: 0;
width: 100%;
height: 100%;
- padding: 5rem;
+ padding: 3rem;
overflow: auto;
background-color: light-dark(rgba(255, 234, 208, 0.9), rgba(0, 0, 0, 0.9));
z-index: 1001;
@@ -38,11 +35,13 @@ figcaption {
#fullscreenImg {
width: 100%;
max-width: 70rem;
+ margin: auto;
}
#caption,
#altText {
text-align: center;
+ margin: 0.8rem;
}
#altText::before {
@@ -51,8 +50,9 @@ figcaption {
#close {
position: absolute;
- top: 1rem;
- right: 1rem;
+ top: 0;
+ right: 0;
+ margin: 0.8rem;
cursor: pointer;
font-size: 2rem;
}
@@ -60,7 +60,7 @@ figcaption {
@media (max-width: 700px) {
#fullscreenModal {
- padding: 0.8rem;
+ padding: 3rem 0.8rem;
}
}
diff --git a/docs/posts/A-Year-With-The-Framework-Laptop-13.html b/docs/posts/A-Year-With-The-Framework-Laptop-13.html
index 45dedf7..714716b 100644
--- a/docs/posts/A-Year-With-The-Framework-Laptop-13.html
+++ b/docs/posts/A-Year-With-The-Framework-Laptop-13.html
@@ -63,7 +63,7 @@
-
close
+ close
A Year With The Framework Laptop 13 | Vale.Rocks
diff --git a/docs/posts/Cybersecurity-Superstition.html b/docs/posts/Cybersecurity-Superstition.html
index 9395100..a80aadc 100644
--- a/docs/posts/Cybersecurity-Superstition.html
+++ b/docs/posts/Cybersecurity-Superstition.html
@@ -63,7 +63,7 @@
- close
+ close
Cybersecurity Superstition | Vale.Rocks
diff --git a/docs/posts/Everything-Is-Chrome.html b/docs/posts/Everything-Is-Chrome.html
index 5541061..45d0037 100644
--- a/docs/posts/Everything-Is-Chrome.html
+++ b/docs/posts/Everything-Is-Chrome.html
@@ -63,7 +63,7 @@
- close
+ close
Everything Is Chrome | Vale.Rocks
diff --git a/docs/posts/Halo-My-Thoughts.html b/docs/posts/Halo-My-Thoughts.html
index e29bcf6..1f9e64c 100644
--- a/docs/posts/Halo-My-Thoughts.html
+++ b/docs/posts/Halo-My-Thoughts.html
@@ -63,7 +63,7 @@
- close
+ close
Halo: My Thoughts | Vale.Rocks
diff --git a/docs/posts/I-Got-A-Flipper-Zero.html b/docs/posts/I-Got-A-Flipper-Zero.html
index b00b617..f681fa7 100644
--- a/docs/posts/I-Got-A-Flipper-Zero.html
+++ b/docs/posts/I-Got-A-Flipper-Zero.html
@@ -63,7 +63,7 @@
- close
+ close
I Got A Flipper Zero | Vale.Rocks
diff --git a/docs/posts/I-Hate-My-Nokia.html b/docs/posts/I-Hate-My-Nokia.html
index e7a8c76..cc889d1 100644
--- a/docs/posts/I-Hate-My-Nokia.html
+++ b/docs/posts/I-Hate-My-Nokia.html
@@ -63,7 +63,7 @@
- close
+ close
I Hate My Nokia | Vale.Rocks
diff --git a/docs/posts/JPEG-XL-And-Googles-War-Against-It.html b/docs/posts/JPEG-XL-And-Googles-War-Against-It.html
index 0c655e6..46fdfa4 100644
--- a/docs/posts/JPEG-XL-And-Googles-War-Against-It.html
+++ b/docs/posts/JPEG-XL-And-Googles-War-Against-It.html
@@ -63,7 +63,7 @@
- close
+ close
JPEG XL And Google's War Against It | Vale.Rocks
diff --git a/docs/posts/LibreOffice-Setup.html b/docs/posts/LibreOffice-Setup.html
index 7511dbb..384162a 100644
--- a/docs/posts/LibreOffice-Setup.html
+++ b/docs/posts/LibreOffice-Setup.html
@@ -63,7 +63,7 @@
- close
+ close
The Ultimate LibreOffice Setup | Vale.Rocks
diff --git a/docs/posts/Making-Windows-Usable.html b/docs/posts/Making-Windows-Usable.html
index 1bffb57..36e9df3 100644
--- a/docs/posts/Making-Windows-Usable.html
+++ b/docs/posts/Making-Windows-Usable.html
@@ -63,7 +63,7 @@
- close
+ close
Making Windows "Usable" | Vale.Rocks
diff --git a/docs/posts/Minecraft-Nostalgia-And-Growing-Up.html b/docs/posts/Minecraft-Nostalgia-And-Growing-Up.html
index f7eb96a..db35b98 100644
--- a/docs/posts/Minecraft-Nostalgia-And-Growing-Up.html
+++ b/docs/posts/Minecraft-Nostalgia-And-Growing-Up.html
@@ -63,7 +63,7 @@
- close
+ close
Minecraft, Nostalgia, and Growing Up | Vale.Rocks
diff --git a/docs/posts/My-Code-Formatting-Guidelines.html b/docs/posts/My-Code-Formatting-Guidelines.html
index 4d28edf..6e76453 100644
--- a/docs/posts/My-Code-Formatting-Guidelines.html
+++ b/docs/posts/My-Code-Formatting-Guidelines.html
@@ -63,7 +63,7 @@
- close
+ close
My Code Formatting Guidelines | Vale.Rocks
diff --git a/docs/posts/Prematurely-Pulling-The-Plug-On-3G.html b/docs/posts/Prematurely-Pulling-The-Plug-On-3G.html
index a9fb022..be5d120 100644
--- a/docs/posts/Prematurely-Pulling-The-Plug-On-3G.html
+++ b/docs/posts/Prematurely-Pulling-The-Plug-On-3G.html
@@ -63,7 +63,7 @@
- close
+ close
Prematurely Pulling The Plug On 3G | Vale.Rocks
diff --git a/docs/posts/School-Internet.html b/docs/posts/School-Internet.html
index c967305..d17bc36 100644
--- a/docs/posts/School-Internet.html
+++ b/docs/posts/School-Internet.html
@@ -63,7 +63,7 @@
- close
+ close
Connecting to Australian Public School Internet | Vale.Rocks
diff --git a/docs/posts/Welcome.html b/docs/posts/Welcome.html
index 4ac0352..fd11ced 100644
--- a/docs/posts/Welcome.html
+++ b/docs/posts/Welcome.html
@@ -63,7 +63,7 @@
- close
+ close
Welcome | Vale.Rocks
diff --git a/docs/scripts/figureview.js b/docs/scripts/figureview.js
index 840f57f..0544cf7 100644
--- a/docs/scripts/figureview.js
+++ b/docs/scripts/figureview.js
@@ -7,6 +7,7 @@ document.addEventListener("DOMContentLoaded", function () {
closeButton = document.getElementById("close");
Array.from(images).forEach((img) => {
+ img.style.cursor = "zoom-in";
img.addEventListener("click", () => openFullscreen(img));
});
@@ -19,7 +20,7 @@ document.addEventListener("DOMContentLoaded", function () {
});
function openFullscreen(imgElement) {
- modal.style.display = "flex";
+ modal.style.display = "block";
modalImg.src = imgElement.currentSrc || imgElement.src;
altText.textContent = imgElement.alt;
diff --git a/docs/styles/components/figures.css b/docs/styles/components/figures.css
index 9ebad2a..e54958b 100644
--- a/docs/styles/components/figures.css
+++ b/docs/styles/components/figures.css
@@ -21,16 +21,13 @@ figcaption {
/* Fullscreen modal styling */
#fullscreenModal {
- display: none;
- flex-direction: column;
- justify-content: space-around;
- align-items: center;
+ display: none; /* Set to block with JS */
position: fixed;
- left: 0;
top: 0;
+ left: 0;
width: 100%;
height: 100%;
- padding: 5rem;
+ padding: 3rem;
overflow: auto;
background-color: light-dark(rgba(255, 234, 208, 0.9), rgba(0, 0, 0, 0.9));
z-index: 1001;
@@ -38,11 +35,13 @@ figcaption {
#fullscreenImg {
width: 100%;
max-width: 70rem;
+ margin: auto;
}
#caption,
#altText {
text-align: center;
+ margin: 0.8rem;
}
#altText::before {
@@ -51,8 +50,9 @@ figcaption {
#close {
position: absolute;
- top: 1rem;
- right: 1rem;
+ top: 0;
+ right: 0;
+ margin: 0.8rem;
cursor: pointer;
font-size: 2rem;
}
@@ -60,7 +60,7 @@ figcaption {
@media (max-width: 700px) {
#fullscreenModal {
- padding: 0.8rem;
+ padding: 3rem 0.8rem;
}
}
diff --git a/posts/feed/conf.toml b/posts/feed/conf.toml
index a847639..f663572 100755
--- a/posts/feed/conf.toml
+++ b/posts/feed/conf.toml
@@ -25,5 +25,5 @@ text = ""
style = "html"
[[main.block]]
-text = "close "
+text = "close
"
style = "html"