summaryrefslogtreecommitdiff
diff refs
from: back
to: back
| flip
diff options
context:
space:
mode:
Diffstat
-rw-r--r--internal/frontmatter/parser.go1
-rw-r--r--internal/lightgallery/html_renderer.go2
-rw-r--r--main.go13
-rw-r--r--static/input.css66
-rw-r--r--static/output.css67
-rw-r--r--views/index.html7
-rw-r--r--views/layouts/blog-page.html78
7 files changed, 24 insertions, 210 deletions
diff --git a/internal/frontmatter/parser.go b/internal/frontmatter/parser.go
index 1a521c0..6cc3ee8 100644
--- a/internal/frontmatter/parser.go
+++ b/internal/frontmatter/parser.go
@@ -15,7 +15,6 @@ type Metadata struct {
PublishedTime time.Time `yaml:"publishedTime"`
Thumbnail string `yaml:"thumbnail"`
Tags []string `yaml:"tags"`
- Geolocation string `yaml:"geolocation"`
}
func ParseFrontmatter(content []byte) (metadata *Metadata, markdown []byte, err error) {
diff --git a/internal/lightgallery/html_renderer.go b/internal/lightgallery/html_renderer.go
index bd73eac..fb65b06 100644
--- a/internal/lightgallery/html_renderer.go
+++ b/internal/lightgallery/html_renderer.go
@@ -87,7 +87,7 @@ function createLightLibrary%s() {
closable: false,
showMaximizeIcon: true,
appendSubHtmlTo: ".lg-sub-html",
- isMobile: () => false,
+ isMobile: () => { return false; },
slideDelay: 0,
plugins: [lgZoom, lgThumbnail],
thumbWidth: 160,
diff --git a/main.go b/main.go
index 447329b..37d6e8d 100644
--- a/main.go
+++ b/main.go
@@ -101,25 +101,12 @@ func main() {
return c.Status(fiber.ErrNotFound.Code).SendString(fmt.Sprintf("failed to find '%s' post", c.Params("title")))
}
- geolocationParts := strings.Split(metadata.Geolocation, " ")
- var x, y, areaError string
- if len(geolocationParts) >= 2 {
- x = geolocationParts[0]
- y = geolocationParts[1]
- }
- if len(geolocationParts) >= 3 {
- areaError = geolocationParts[2]
- }
-
return c.Render("layouts/blog-page", fiber.Map{
"Title": metadata.Title,
"PublishedDate": metadata.PublishedTime.Format("2006-01-02 15:04:05 -07:00"),
"PublishedYear": strconv.Itoa(metadata.PublishedTime.Year()),
"ParsedMarkdownDesktop": template.HTML(parsedMarkdownDesktop),
"ParsedMarkdownMobile": template.HTML(parsedMarkdownMobile),
- "MapLocationX": x,
- "MapLocationY": y,
- "MapLocationAreaMeters": areaError,
})
})
diff --git a/static/input.css b/static/input.css
index 3ab5028..6823898 100644
--- a/static/input.css
+++ b/static/input.css
@@ -27,7 +27,7 @@
--secondary-color: var(--main-light-color);
--interlocked-hexagons-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/interlocked-hexagons.svg');
--interlocked-hexagons-background-repeat: repeat;
- --interlocked-hexagons-background-size: 10vh;
+ --interlocked-hexagons-background-size: 10vw;
--squares-and-triangles-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/squares-and-triangles.svg');
--squares-and-triangles-background-repeat: repeat;
}
@@ -43,7 +43,7 @@
--secondary-color: var(--main-medium-color);
--interlocked-hexagons-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/interlocked-hexagons.svg');
--interlocked-hexagons-background-repeat: repeat;
- --interlocked-hexagons-background-size: 10vh;
+ --interlocked-hexagons-background-size: 10vw;
--squares-and-triangles-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/squares-and-triangles.svg');
--squares-and-triangles-background-repeat: repeat;
}
@@ -124,21 +124,13 @@
background-size: 10vw;
}
-body:has(.lg-container:not([class~="lg-inline"])) .desktop-sidebar-custom {
- display: none !important;
-}
-
.mobile-topbar-custom {
width: 90vw;
- height: 8%;
- background-size: 16vh;
+ height: 10vh;
+ background-size: 20vh;
margin-left: 5vw;
}
-body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
- display: none !important;
-}
-
.logo-custom {
width: 3.5vw;
height: 20vw;
@@ -235,26 +227,14 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
width: 90vw;
}
-.w-p60 {
- width: 60%;
-}
-
.w-p80 {
width: 80%;
}
-.w-p100 {
- width: 100%;
-}
-
.w-vmax4 {
width: 4vmax;
}
-.h-vh40 {
- height: 40vh;
-}
-
.h-vh90 {
height: 90vh;
}
@@ -308,10 +288,6 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
padding-right: 1.2vmin;
}
-.p-vmin0-8 {
- padding: 0.8vmin;
-}
-
.p-vmin2-4 {
padding: 2.4vmin;
}
@@ -322,18 +298,10 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
.lg-backdrop {
background-color: var(--background-light-color);
- opacity: 0.8 !important;
-}
-
-.lg-container:not([class~="lg-inline"]) .lg-outer {
- width: 90%;
- height: 90%;
- margin: 5vh 5vw;
}
.lg-thumb-outer {
background-color: var(--background-light-color) !important;
- opacity: 0.8 !important;
}
.lg-prev {
@@ -354,19 +322,6 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
height: 1vmax;
}
-.lg-container:not([class~="lg-inline"]) .lg-counter {
- font-size: 2vmax;
- height: 2vmax;
-}
-
-.lg-content {
- top: 3vmax !important;
-}
-
-.lg-container:not([class~="lg-inline"]) .lg-content {
- top: 4vmax !important;
-}
-
.lg-toolbar .lg-icon {
padding: 0 0.7vmax;
font-size: 1.5vmax !important;
@@ -375,11 +330,6 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
color: var(--main-dark-color);
}
-.lg-container:not([class~="lg-inline"]) .lg-toolbar .lg-icon {
- font-size: 3vmax !important;
- height: 3vmax;
-}
-
.lg-toolbar .lg-icon:hover {
color: var(--main-medium-color);
}
@@ -465,16 +415,16 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
}
.nav-icon-custom {
- font-size: 5vh !important;
+ font-size: 6vh !important;
-webkit-text-stroke: 0.1vh var(--sidebar-stroke-color);
- width: 8vh;
- height: 8vh;
+ width: 10vh;
+ height: 10vh;
align-content: center;
text-align: center;
}
.nav-icon-custom:hover {
- font-size: 7vh;
+ font-size: 8vh;
}
.bg-pattern-body {
diff --git a/static/output.css b/static/output.css
index 1517e8d..2e6d1bd 100644
--- a/static/output.css
+++ b/static/output.css
@@ -181,9 +181,6 @@
.relative {
position: relative;
}
- .sticky {
- position: sticky;
- }
.z-0 {
z-index: 0;
}
@@ -244,18 +241,12 @@
.flex {
display: flex;
}
- .h-\[92vh\] {
- height: 92vh;
- }
.h-auto {
height: auto;
}
.h-screen {
height: 100vh;
}
- .max-h-\[80\%\] {
- max-height: 80%;
- }
.max-w-full {
max-width: 100%;
}
@@ -268,9 +259,6 @@
.flex-5 {
flex: 5;
}
- .flex-none {
- flex: none;
- }
.flex-grow {
flex-grow: 1;
}
@@ -437,7 +425,7 @@
--secondary-color: var(--main-light-color);
--interlocked-hexagons-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/interlocked-hexagons.svg');
--interlocked-hexagons-background-repeat: repeat;
- --interlocked-hexagons-background-size: 10vh;
+ --interlocked-hexagons-background-size: 10vw;
--squares-and-triangles-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/squares-and-triangles.svg');
--squares-and-triangles-background-repeat: repeat;
}
@@ -452,7 +440,7 @@
--secondary-color: var(--main-medium-color);
--interlocked-hexagons-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/interlocked-hexagons.svg');
--interlocked-hexagons-background-repeat: repeat;
- --interlocked-hexagons-background-size: 10vh;
+ --interlocked-hexagons-background-size: 10vw;
--squares-and-triangles-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/squares-and-triangles.svg');
--squares-and-triangles-background-repeat: repeat;
}
@@ -517,18 +505,12 @@
width: 5vw;
background-size: 10vw;
}
-body:has(.lg-container:not([class~="lg-inline"])) .desktop-sidebar-custom {
- display: none !important;
-}
.mobile-topbar-custom {
width: 90vw;
- height: 8%;
- background-size: 16vh;
+ height: 10vh;
+ background-size: 20vh;
margin-left: 5vw;
}
-body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
- display: none !important;
-}
.logo-custom {
width: 3.5vw;
height: 20vw;
@@ -602,21 +584,12 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
.w-vw90 {
width: 90vw;
}
-.w-p60 {
- width: 60%;
-}
.w-p80 {
width: 80%;
}
-.w-p100 {
- width: 100%;
-}
.w-vmax4 {
width: 4vmax;
}
-.h-vh40 {
- height: 40vh;
-}
.h-vh90 {
height: 90vh;
}
@@ -657,9 +630,6 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
.pr-vmin1-2 {
padding-right: 1.2vmin;
}
-.p-vmin0-8 {
- padding: 0.8vmin;
-}
.p-vmin2-4 {
padding: 2.4vmin;
}
@@ -668,16 +638,9 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
}
.lg-backdrop {
background-color: var(--background-light-color);
- opacity: 0.8 !important;
-}
-.lg-container:not([class~="lg-inline"]) .lg-outer {
- width: 90%;
- height: 90%;
- margin: 5vh 5vw;
}
.lg-thumb-outer {
background-color: var(--background-light-color) !important;
- opacity: 0.8 !important;
}
.lg-prev {
background-color: var(--background-light-color);
@@ -694,16 +657,6 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
padding-top: 0;
height: 1vmax;
}
-.lg-container:not([class~="lg-inline"]) .lg-counter {
- font-size: 2vmax;
- height: 2vmax;
-}
-.lg-content {
- top: 3vmax !important;
-}
-.lg-container:not([class~="lg-inline"]) .lg-content {
- top: 4vmax !important;
-}
.lg-toolbar .lg-icon {
padding: 0 0.7vmax;
font-size: 1.5vmax !important;
@@ -711,10 +664,6 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
width: auto;
color: var(--main-dark-color);
}
-.lg-container:not([class~="lg-inline"]) .lg-toolbar .lg-icon {
- font-size: 3vmax !important;
- height: 3vmax;
-}
.lg-toolbar .lg-icon:hover {
color: var(--main-medium-color);
}
@@ -781,15 +730,15 @@ body:has(.lg-container:not([class~="lg-inline"])) .mobile-topbar-custom {
display: none;
}
.nav-icon-custom {
- font-size: 5vh !important;
+ font-size: 6vh !important;
-webkit-text-stroke: 0.1vh var(--sidebar-stroke-color);
- width: 8vh;
- height: 8vh;
+ width: 10vh;
+ height: 10vh;
align-content: center;
text-align: center;
}
.nav-icon-custom:hover {
- font-size: 7vh;
+ font-size: 8vh;
}
.bg-pattern-body {
background-size: 10vh;
diff --git a/views/index.html b/views/index.html
index ce80db6..6d4bc2f 100644
--- a/views/index.html
+++ b/views/index.html
@@ -21,10 +21,6 @@
}
@media (max-aspect-ratio: 1.2/1) {
- .menu-outer-body {
- border-radius: 5%;
- }
-
.menu-inner-body {
width: 92.5%;
}
@@ -34,7 +30,6 @@
.menu-outer-body {
width: 100vw;
height: 80vh;
- border-radius: 0;
}
.menu-inner-body {
@@ -95,7 +90,7 @@
<div class="menu-inner-body grow bg-background-light flex flex-col mx-auto mb-vmin1-6 overflow-y-auto opacity-100">
{{- range .BlogPages }}
<div class="m-2 flex flex-row justify-center justify-items-center gap-4">
- <img onclick="location.href='/blog/{{ .Link }}';" style="flex-grow: 0;" class="flex-1 cursor-pointer object-cover rounded-4xl select-none w-vmax4 h-vmax4" src="https://f003.backblazeb2.com/file/sayana-photos/thumbnails/{{ .Thumbnail }}.webp">
+ <img style="flex-grow: 0;" class="flex-1 object-cover rounded-4xl select-none w-vmax4 h-vmax4" src="https://f003.backblazeb2.com/file/sayana-photos/thumbnails/{{ .Thumbnail }}.webp">
<div class="flex-5 justify-self-center flex-col border-r-1 border-dashed border-opacity-50 border-main-medium">
<a href="/blog/{{ .Link }}" class="block font-extrabold">{{ .Title }}</a>
<a href="/blog/{{ .Link }}" class="block italic text-vmax1 text-secondary">{{ .ActionDate }}</a>
diff --git a/views/layouts/blog-page.html b/views/layouts/blog-page.html
index 427f33e..6ee7d85 100644
--- a/views/layouts/blog-page.html
+++ b/views/layouts/blog-page.html
@@ -8,23 +8,13 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-zoom.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-thumbnail.min.css">
-{{- if .MapLocationX }}
- <link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.css">
-{{- end }}
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&family=Patua+One&display=swap" rel="stylesheet">
<link href="/output.css" rel="stylesheet">
-
- <style>
- .map-container .leaflet-container {
- width: 100% !important;
- height: 100% !important;
- }
- </style>
</head>
-<body data-theme="night" class="font-spectral text-main-dark overflow-hidden bg-interlocked-hexagons h-screen flex">
+<body data-theme="olive" class="font-spectral text-main-dark overflow-hidden bg-interlocked-hexagons bg-repeat bg-pattern-body h-screen flex">
<script>
function switchTheme(theme) {
@@ -40,11 +30,11 @@
document.body.setAttribute('data-theme', theme);
}
- const savedTheme = localStorage.getItem('theme') || 'night';
+ const savedTheme = localStorage.getItem('theme') || 'olive';
switchTheme(savedTheme);
</script>
- <div class="desktop-sidebar-custom sticky bg-squares-and-triangles bg-repeat flex-col items-center shadow-2xl z-20 h-screen desktop">
+ <div class="desktop-sidebar-custom fixed bg-squares-and-triangles bg-repeat flex-col items-center shadow-2xl z-20 h-screen desktop">
<div class="logo-custom text-sidebar font-patua font-extrabold text-center relative z-20">
saya.today
</div>
@@ -56,7 +46,7 @@
</div>
</div>
- <div class="bg-background-dark z-10 h-screen desktop">
+ <div class="bg-background-dark z-10 h-screen desktop" style="padding-left: 5vw;">
<div class="border-left-custom bg-background-dark"></div>
<div class="content-square flex flex-col bg-background-dark relative mt-vmin1-6 mx-vmin1-6">
@@ -70,11 +60,6 @@
<div class="bg-background-light flex flex-col flex-1 overflow-y-auto inset-shadow p-vmin2-4">
{{ .ParsedMarkdownDesktop }}
- {{- if .MapLocationX }}
- <hr class="border-t-4 border-dotted border-main-dark mt-vmin0-8 mb-vmin0-8 w-p80 ml-auto mr-auto">
- <div id="location-map-desktop" class="relative p-vmin0-8 flex-none ml-auto mr-auto w-p60 h-vh40"></div>
- <hr class="border-t-4 border-dotted border-main-dark mt-vmin0-8 mb-vmin0-8 w-p80 ml-auto mr-auto">
- {{- end }}
</div>
<div class="flex flex-row mt-vmin0-8 mb-vmin0-4">
@@ -104,7 +89,7 @@
</div>
</div>
- <div class="bg-background-dark flex-row z-10 w-vw90 h-[92vh] mobile" style="margin-left: 5vw; margin-top: 8vh;">
+ <div class="bg-background-dark flex-row z-10 w-vw90 h-vh90 mobile" style="margin-left: 5vw; margin-top: 10vh;">
<div class="border-left-custom bg-background-dark"></div>
<div class="content-square flex flex-col bg-background-dark relative mt-vmin1-6 mx-vmin1-6">
@@ -116,13 +101,8 @@
</div>
<hr class="border-t-4 border-dotted border-main-dark mb-vmin0-8">
- <div class="bg-background-light flex flex-col overflow-y-auto inset-shadow p-vmin2-4 max-h-[80%]">
+ <div class="bg-background-light flex flex-col flex-1 overflow-y-auto inset-shadow p-vmin2-4">
{{ .ParsedMarkdownMobile }}
- {{- if .MapLocationX }}
- <hr class="border-t-4 border-dotted border-main-dark mt-vmin0-8 mb-vmin0-8 w-p80 ml-auto mr-auto">
- <div id="location-map-mobile" class="relative p-vmin0-8 flex-none ml-auto mr-auto w-p100 h-vh40"></div>
- <hr class="border-t-4 border-dotted border-main-dark mt-vmin0-8 mb-vmin0-8 w-p80 ml-auto mr-auto">
- {{- end }}
</div>
<div class="flex flex-row mt-vmin0-8 mb-vmin0-4">
@@ -143,52 +123,6 @@
<script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/lightgallery.min.js"></script>
<script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/plugins/lg-zoom.min.js"></script>
<script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/plugins/lg-thumbnail.min.js"></script>
-{{- if .MapLocationX }}
- <script src="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.js"></script>
-
- <script>
- function initLocationMap(id, x, y, relativeErrorMeters = 0) {
- var map = L.map(id).setView([x, y], 13);
-
- L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
- maxZoom: 19,
- attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
- }).addTo(map);
-
- if (relativeErrorMeters != 0) {
- var circle = L.circle([x, y], {
- color: '#8a9d8a',
- fillColor: '#8a9d8a',
- fillOpacity: 0.15,
- radius: relativeErrorMeters
- }).addTo(map);
- }
-
- var marker = L.marker([x, y]).addTo(map);
- }
-
- document.addEventListener('DOMContentLoaded', () => {initLocationMap(
- 'location-map-desktop',
- {{ .MapLocationX }},
- {{ .MapLocationY }},
- {{ .MapLocationAreaMeters }}
- )});
-
- document.addEventListener('DOMContentLoaded', () => {initLocationMap(
- 'location-map-mobile',
- {{ .MapLocationX }},
- {{ .MapLocationY }},
- {{ .MapLocationAreaMeters }}
- )});
-
- window.addEventListener('resize', function() {
- setTimeout(() => {
- if (window.location-map-desktop) window.location-map-desktop.invalidateSize();
- if (window.location-map-mobile) window.location-map-mobile.invalidateSize();
- }, 100);
- });
- </script>
-{{- end }}
</body>
</html>
generated by cgitext v1.3.1+17 (git 2.54.0) at 2026-09-14 19:08:11 +0000