summaryrefslogtreecommitdiff
path: root/views
diff refs
from: back
to: back
| flip
diff options
context:
space:
mode:
Diffstat (limited to 'views')
-rw-r--r--views/index.html141
-rw-r--r--views/layouts/general-page.html135
-rw-r--r--views/pages/global-map.html35
-rw-r--r--views/pages/home-page.html3
-rw-r--r--views/pages/language-pick.html16
5 files changed, 208 insertions, 122 deletions
diff --git a/views/index.html b/views/index.html
new file mode 100644
index 0000000..cbb4c57
--- /dev/null
+++ b/views/index.html
@@ -0,0 +1,141 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Choose Language // SAYA TODAY</title>
+ <link href="/output.css" rel="stylesheet">
+ <style>
+ .menu-outer-body {
+ border-radius: 10%;
+ width: 40dvh;
+ height: 30dvh;
+ }
+
+ .menu-inner-body {
+ width: 85%;
+ }
+
+ .flex-adaptive {
+ flex-direction: row;
+ }
+
+ .language-icon {
+ max-width: calc(80% / {{ .AvailableLanguages | len }});
+ max-height: 80%;
+ }
+
+ @media (max-aspect-ratio: 0.8/1) {
+ .menu-outer-body {
+ border-radius: 5%;
+ }
+
+ .menu-outer-body {
+ width: min(40dvh, 100dvw);
+ height: 40dvh;
+ border-radius: 0;
+ }
+
+ .language-icon {
+ max-width: 40%;
+ max-height: calc(80% / {{ .AvailableLanguages | len }});
+ }
+
+ .menu-inner-body {
+ width: 92.5%;
+ }
+
+ .flex-adaptive {
+ flex-direction: column;
+ }
+ }
+ </style>
+</head>
+
+<body data-theme="night" class="font-andika text-main-hard text-2xl overflow-hidden bg-interlocked-hexagons h-[100dvh] flex flex-col">
+
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+ <div class="absolute star z-0">*</div>
+
+ <script>
+ function switchTheme(theme) {
+ if (theme == "" || typeof theme == "undefined") {
+ const currentTheme = document.body.getAttribute('data-theme');
+ switch (currentTheme) {
+ case "olive": theme = "lettuce"; break;
+ case "lettuce": theme = "night"; break;
+ case "night": theme = "olive"; break;
+ }
+ }
+ // localStorage.setItem('theme', theme);
+ document.body.setAttribute('data-theme', theme);
+ }
+
+ const savedTheme = 'night';
+ switchTheme(savedTheme);
+ </script>
+
+ <div class="menu-outer-body p-2 z-1 bg-background-dark flex flex-col mx-auto my-auto opacity-70">
+ <p class="font-andika mx-auto text-4xl mt-1 mb-2">saya.today</p>
+ <div class="menu-inner-body grow bg-background-light flex flex-adaptive mx-auto opacity-100">
+ {{- range .AvailableLanguages }}
+ <img onclick="location.href='/{{ .Name }}';" class="object-scale-down cursor-pointer flex-1 rounded-[20%] language-icon mx-auto my-auto relative" src="{{ .Flag }}" alt="{{ .Alt }}">
+ {{- end }}
+ </div>
+ <p class="font-andika mx-auto text-2xl text-secondary mt-1 mb-2">Choose your language</p>
+ </div>
+
+ <script>
+ function generateStars() {
+ var clWidth = document.documentElement.clientWidth;
+ var clHeight = document.documentElement.clientHeight;
+
+ stars = document.getElementsByClassName("star");
+ for (let starIndex = 0; starIndex < stars.length; starIndex++) {
+ const star = stars[starIndex];
+ const x = Math.floor(Math.random() * clWidth);
+ const y = Math.floor(Math.random() * clHeight * 0.8);
+ const rot = Math.random() * 90;
+ const animDuration = (Math.random() * 10) + 3;
+ const sz = Math.floor(Math.random() * 8) + 12;
+ star.style.transform = `translateX(${x}px) translateY(${y}px) rotate(${rot}deg)`;
+ star.style.animationDuration = `${animDuration}s`;
+ star.style.fontSize = `${sz}px`;
+ }
+ }
+
+ document.addEventListener('DOMContentLoaded', generateStars);
+
+ let generateStarsTimer;
+ window.addEventListener("resize", () => {
+ clearTimeout(generateStarsTimer);
+ generateStarsTimer = setTimeout(() => {
+ generateStars();
+ }, 1000);
+ });
+ </script>
+</body>
+</html>
diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html
index 5760b88..f4fd9be 100644
--- a/views/layouts/general-page.html
+++ b/views/layouts/general-page.html
@@ -9,7 +9,7 @@
<link href="/output.css" rel="stylesheet">
</head>
-<body data-theme="ram" class="font-andika text-main-hard overflow-hidden bg-interlocked-hexagons h-[100dvh] flex flex-row">
+<body data-theme="ram" class="font-andika text-main-hard overflow-hidden bg-interlocked-hexagons h-[100dvh] flex flex-col [@media(max-height:32rem)]:flex-row">
<script>
let map = null;
@@ -17,11 +17,14 @@
<script>
function changeUrl(path, toAppend = false) {
- const urlParams = new URLSearchParams(window.location.search);
+ const urlParams = new URLSearchParams(window.location.search);
const newPathname = location.pathname.endsWith('/') ? location.pathname.slice(0, -1) : location.pathname;
const newPath = toAppend ? `${newPathname}${path}` : `${path}`;
-
+
history.pushState({}, '', `${newPath}${urlParams.entries.length == 0 ? '' : '?' + urlParams.toString()}`);
+ if (location.pathname == "" || location.pathname == "/") {
+ return true;
+ }
window.dispatchEvent(new Event('popstate'));
return false;
};
@@ -147,8 +150,7 @@
case "olive": theme = "lettuce"; break;
case "lettuce": theme = "night"; break;
case "night": theme = "ram"; break;
- case "ram": theme = "lilac"; break;
- case "lilac": theme = "olive"; break;
+ case "ram": theme = "olive"; break;
}
}
localStorage.setItem('theme', theme);
@@ -156,7 +158,7 @@
switchThemeDecor(theme);
}
- const savedTheme = localStorage.getItem('theme') || 'lilac';
+ const savedTheme = localStorage.getItem('theme') || 'ram';
switchTheme(savedTheme);
</script>
@@ -169,92 +171,59 @@
const clientTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
</script>
- <div class="grow bg-split-left"></div>
-
- <div class="flex flex-col [@media(max-height:32rem)]:flex-row">
- <div id="sidebar" class="bg-sidebar flex sticky flex-col z-20 w-[100dvw] xs:w-[90dvw] sm:w-[80dvw] md:w-[75dvw] lg:w-[70dvw] xl:w-[65dvw] 2xl:w-[60dvw] [@media(max-height:32rem)]:w-[5rem] h-[5rem] [@media(max-height:32rem)]:h-[100dvh] shadow-[0_0_1rem_black]">
- <div class="text-[3rem] text-stroke-(--sidebar-stroke-color) text-stroke-[0.1dvw] flex flex-row [@media(max-height:32rem)]:flex-col gap-0 relative z-20">
- <a href="/{{ .Lang }}" id="sidebar-home-button" class="w-[5rem] h-[5rem]">
- <i onclick="return changeUrl('/{{ .Lang }}');" class="fas fa-home flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
- </a>
- <a href="/{{ .Lang }}/blog" id="sidebar-blog-button" class="w-[5rem] h-[5rem]">
- <i onclick="return changeUrl('/{{ .Lang }}/blog');" class="fas fa-search flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
- </a>
- <a href="/{{ .Lang }}/map" id="sidebar-map-button" class="w-[5rem] h-[5rem]">
- <i class="fas fa-map flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
- </a>
- <i onclick="toggleThemeWheel();" id="sidebar-theme-button" class="fas fa-swatchbook flex w-[5rem] h-[5rem] content-center text-center text-sidebar hover:bg-background-dark cursor-pointer transition-colors duration-300 rounded-lg"></i>
- <a href="./" id="sidebar-back-button" class="w-[5rem] h-[5rem]">
- <i onclick="return changeUrl('/../', true);" class="fas fa-circle-left flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
- </a>
- </div>
- <div class="theme-wheel" id="theme-wheel">
- <div class="theme-icon" data-theme="olive"></div>
- <div class="theme-icon" data-theme="lettuce"></div>
- <div class="theme-icon" data-theme="night"></div>
- <div class="theme-icon" data-theme="ram"></div>
- <div class="theme-icon" data-theme="lilac"></div>
- <div class="theme-pin"></div>
- </div>
- <script>
- sidebarHomeButton = document.getElementById("sidebar-home-button");
- sidebarMapButton = document.getElementById("sidebar-map-button");
- sidebarBlogButton = document.getElementById("sidebar-blog-button");
- sidebarBackButton = document.getElementById("sidebar-back-button");
-
- function updateSidebar() {
- if (location.pathname == "" || location.pathname == "/") {
- sidebarHomeButton.classList.add('hidden');
- sidebarMapButton.classList.add('hidden');
- sidebarBlogButton.classList.add('hidden');
- sidebarBackButton.classList.add('hidden');
- } else {
- sidebarHomeButton.classList.remove('hidden');
- sidebarMapButton.classList.remove('hidden');
- sidebarBlogButton.classList.remove('hidden');
- sidebarBackButton.classList.remove('hidden');
- lang = location.pathname.split("/")[1];
- sidebarHomeButton.setAttribute('href', `/${lang}`);
- sidebarHomeButton.firstElementChild.setAttribute('onclick', `return changeUrl('/${lang}', false);`);
- sidebarMapButton.setAttribute('href', `/${lang}/map`);
- sidebarBlogButton.setAttribute('href', `/${lang}/blog`);
- sidebarBlogButton.firstElementChild.setAttribute('onclick', `return changeUrl('/${lang}/blog', false);`);
- }
- }
- window.addEventListener("popstate", updateSidebar);
- window.addEventListener("load", updateSidebar, {once: true});
- </script>
+ <div id="sidebar" class="bg-sidebar flex sticky flex-col z-20 w-[100dvw] xs:w-[90dvw] sm:w-[80dvw] md:w-[75dvw] lg:w-[70dvw] xl:w-[65dvw] 2xl:w-[60dvw] [@media(max-height:32rem)]:w-[5rem] h-[5rem] [@media(max-height:32rem)]:h-[100dvh] mx-auto [@media(max-height:32rem)]:mx-0
+ shadow-[0_0_1rem_black]">
+ <div class="text-[3rem] text-stroke-(--sidebar-stroke-color) text-stroke-[0.1dvw] flex flex-row [@media(max-height:32rem)]:flex-col gap-0 relative z-20">
+ <a href="/{{ .Lang }}" class="w-[5rem] h-[5rem]">
+ <i onclick="return changeUrl('/{{ .Lang }}');" class="fas fa-home flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
+ </a>
+ <a href="/{{ .Lang }}/blog" class="w-[5rem] h-[5rem]">
+ <i onclick="return changeUrl('/{{ .Lang }}/blog');" class="fas fa-search flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
+ </a>
+ <a href="/{{ .Lang }}/map" class="w-[5rem] h-[5rem]">
+ <i class="fas fa-map flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
+ </a>
+ <i onclick="toggleThemeWheel();" id="theme-button" class="fas fa-swatchbook flex w-[5rem] h-[5rem] content-center text-center text-sidebar hover:bg-background-dark cursor-pointer transition-colors duration-300 rounded-lg"></i>
+ <a href="./" class="w-[5rem] h-[5rem]">
+ <i onclick="return changeUrl('/../', true);" class="fas fa-circle-left flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
+ </a>
</div>
+ <div class="theme-wheel" id="theme-wheel">
+ <div class="theme-icon" data-theme="olive"></div>
+ <div class="theme-icon" data-theme="lettuce"></div>
+ <div class="theme-icon" data-theme="night"></div>
+ <div class="theme-icon" data-theme="ram"></div>
+ <div class="theme-pin"></div>
+ </div>
+ </div>
- <div class="bg-background-dark @container/main flex z-10 w-[100dvw] xs:w-[90dvw] sm:w-[80dvw] md:w-[75dvw] lg:w-[70dvw] xl:w-[65dvw] 2xl:w-[60dvw] grow-0 h-[calc(100dvh-5rem)] [@media(max-height:32rem)]:h-[100dvh] shadow-[0_0_1rem_black]">
- <div class="bg-background-dark border-r-2 border-dashed border-main-hard"></div>
-
- <div class="max-h-100% flex flex-col grow bg-background-dark relative pt-4 ml-8 pr-4">
- <div id="general-page-header" class="max-xs:hidden [@media(max-height:32rem)]:hidden flex flex-col basis-8"
- hx-get="/api/v1/general-page/header{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="load" hx-target="this" hx-swap="innerHTML">
- </div>
- <div id="general-page-header-trigger" hx-get="/api/v1/general-page/header{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="popstate from:window" hx-target="#general-page-header" hx-swap="innerHTML"></div>
+ <div class="bg-background-dark @container/main flex z-10 w-[100dvw] xs:w-[90dvw] sm:w-[80dvw] md:w-[75dvw] lg:w-[70dvw] xl:w-[65dvw] 2xl:w-[60dvw] grow-0 h-[calc(100dvh-5rem)] [@media(max-height:32rem)]:h-[100dvh] mx-auto [@media(max-height:32rem)]:mx-0
+ shadow-[0_0_1rem_black]">
+ <div class="bg-background-dark border-r-2 border-dashed border-main-hard"></div>
- <hr class="max-xs:hidden [@media(max-height:32rem)]:hidden border-t-4 border-dotted border-main-hard mb-2">
+ <div class="max-h-100% flex flex-col grow bg-background-dark relative pt-4 ml-8 pr-4">
+ <div id="general-page-header" class="max-xs:hidden [@media(max-height:32rem)]:hidden flex flex-col basis-8"
+ hx-get="/api/v1/general-page/header{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="load" hx-target="this" hx-swap="innerHTML">
+ </div>
+ <div id="general-page-header-trigger" hx-get="/api/v1/general-page/header{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="popstate from:window" hx-target="#general-page-header" hx-swap="innerHTML"></div>
- <div id="general-page-body" class="flex flex-col grow overflow-y-auto"
- hx-get="/api/v1/general-page/body{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="load" hx-target="this" hx-swap="innerHTML">
- </div>
- <div id="general-page-body-trigger" hx-get="/api/v1/general-page/body{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="popstate from:window" hx-target="#general-page-body" hx-swap="innerHTML"></div>
+ <hr class="max-xs:hidden [@media(max-height:32rem)]:hidden border-t-4 border-dotted border-main-hard mb-2">
- <div id="general-page-footer" class="flex flex-row basis-4 my-1"
- hx-get="/api/v1/general-page/footer{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="load" hx-target="this" hx-swap="innerHTML">
- </div>
- <div id="general-page-footer-trigger" hx-get="/api/v1/general-page/footer{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="popstate from:window" hx-target="#general-page-footer" hx-swap="innerHTML"></div>
+ <div id="general-page-body" class="flex flex-col grow overflow-y-auto"
+ hx-get="/api/v1/general-page/body{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="load" hx-target="this" hx-swap="innerHTML">
+ </div>
+ <div id="general-page-body-trigger" hx-get="/api/v1/general-page/body{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="popstate from:window" hx-target="#general-page-body" hx-swap="innerHTML"></div>
- <hr class="border-t-4 border-dotted border-main-hard mb-2">
+ <div id="general-page-footer" class="flex flex-row basis-4 my-1"
+ hx-get="/api/v1/general-page/footer{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="load" hx-target="this" hx-swap="innerHTML">
</div>
+ <div id="general-page-footer-trigger" hx-get="/api/v1/general-page/footer{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="popstate from:window" hx-target="#general-page-footer" hx-swap="innerHTML"></div>
- <div class="pr-[0.5dvw] bg-background-dark shadow-2xl border-l-2 border-dotted border-main-hard"></div>
+ <hr class="border-t-4 border-dotted border-main-hard mb-2">
</div>
- </div>
- <div class="grow bg-split-right"></div>
+ <div class="pr-[0.5dvw] bg-background-dark shadow-2xl border-l-2 border-dotted border-main-hard"></div>
+ </div>
<script src="https://f003.backblazeb2.com/file/sayana-static/libs/htmx/2.0.6/htmx.min.js"></script>
<script src="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.js"></script>
@@ -268,7 +237,7 @@
<script>
const themeWheel = document.getElementById('theme-wheel');
- const themeButton = document.getElementById('sidebar-theme-button');
+ const themeButton = document.getElementById('theme-button');
const themeIcons = document.querySelectorAll('.theme-icon');
const themeWheelRadius = convertRemToPixels(6);
diff --git a/views/pages/global-map.html b/views/pages/global-map.html
index d0433e9..4b17d16 100644
--- a/views/pages/global-map.html
+++ b/views/pages/global-map.html
@@ -12,7 +12,7 @@
<link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet.markercluster/1.4.1/MarkerCluster.Default.css">
</head>
-<body data-theme="ram" class="font-andika text-main-hard overflow-hidden bg-interlocked-hexagons h-[100dvh]">
+<body data-theme="ram" class="font-andika text-main-hard overflow-hidden bg-interlocked-hexagons h-[100dvh] flex flex-row ar-lt-0.8:flex-col">
<script>
function switchTheme(theme) {
@@ -22,15 +22,14 @@
case "olive": theme = "lettuce"; break;
case "lettuce": theme = "night"; break;
case "night": theme = "ram"; break;
- case "ram": theme = "lilac"; break;
- case "lilac": theme = "olive"; break;
+ case "ram": theme = "olive"; break;
}
}
localStorage.setItem('theme', theme);
document.body.setAttribute('data-theme', theme);
}
- const savedTheme = localStorage.getItem('theme') || 'lilac';
+ const savedTheme = localStorage.getItem('theme') || 'ram';
switchTheme(savedTheme);
</script>
@@ -42,33 +41,32 @@
}
</script>
- <div id="sidebar" class="bg-sidebar block fixed shadow-[0_0_0.4rem_black] z-1001 w-[5rem] h-auto">
- <div class="text-[3rem] text-stroke-(--sidebar-stroke-color) text-stroke-[0.1dvw] flex flex-col gap-0 relative z-1001">
- <a href="/{{ .Lang }}" class="w-[5rem] h-[5rem]">
+ <div id="sidebar" class="bg-sidebar flex sticky flex-col ar-gt-0.8:items-center shadow-2xl z-20 w-[5rem] ar-lt-0.8:w-[100dvw] h-[100dvh] ar-lt-0.8:h-[8dvh]">
+ <div class="logo-custom ar-lt-0.8:hidden text-sidebar font-andika font-extrabold text-center relative z-20">
+ saya.today
+ </div>
+ <div class="text-[3rem] ar-lt-0.8:text-[5dvh] text-stroke-(--sidebar-stroke-color) text-stroke-[0.1dvw] flex flex-col ar-lt-0.8:flex-row gap-0 relative z-20">
+ <a href="/{{ .Lang }}" class="w-[5rem] ar-lt-0.8:w-[8dvh] h-[5rem] ar-lt-0.8:h-[8dvh]">
<i class="fas fa-home flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
</a>
- <a href="/{{ .Lang }}/blog" class="w-[5rem] h-[5rem]">
+ <a href="/{{ .Lang }}/blog" class="w-[5rem] ar-lt-0.8:w-[8dvh] h-[5rem] ar-lt-0.8:h-[8dvh]">
<i class="fas fa-search flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
</a>
- <a href="/{{ .Lang }}/map" class="w-[5rem] h-[5rem]">
+ <a href="/{{ .Lang }}/map" class="w-[5rem] ar-lt-0.8:w-[8dvh] h-[5rem] ar-lt-0.8:h-[8dvh]">
<i class="fas fa-map flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
</a>
- <i onclick="toggleThemeWheel();" id="theme-button" class="fas fa-swatchbook flex w-[5rem] h-[5rem] content-center text-center text-sidebar hover:bg-background-dark cursor-pointer transition-colors duration-300 rounded-lg"></i>
- <a href="./" class="w-[5rem] h-[5rem]">
- <i class="fas fa-circle-left flex w-full h-full content-center text-center text-sidebar hover:bg-background-dark transition-colors duration-300 rounded-lg"></i>
- </a>
+ <i onclick="toggleThemeWheel();" id="theme-button" class="fas fa-swatchbook flex w-[5rem] ar-lt-0.8:w-[8dvh] h-[5rem] ar-lt-0.8:h-[8dvh] content-center text-center text-sidebar hover:bg-background-dark cursor-pointer transition-colors duration-300 rounded-lg"></i>
</div>
<div class="theme-wheel" id="theme-wheel">
<div class="theme-icon" data-theme="olive"></div>
<div class="theme-icon" data-theme="lettuce"></div>
<div class="theme-icon" data-theme="night"></div>
<div class="theme-icon" data-theme="ram"></div>
- <div class="theme-icon" data-theme="lilac"></div>
<div class="theme-pin"></div>
</div>
</div>
- <div id="map-container" class="bg-background-dark flex z-10 w-full h-full"></div>
+ <div id="map-container" class="bg-background-dark flex z-10 w-[calc(100dvw-5rem)] ar-lt-0.8:w-[100dvw] h-[100dvh] ar-lt-0.8:h-[92dvh]"></div>
<script src="https://f003.backblazeb2.com/file/sayana-static/libs/htmx/2.0.6/htmx.min.js"></script>
<script src="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.js"></script>
@@ -227,12 +225,7 @@
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
- attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
- zoomControl: false
- }).addTo(map);
-
- L.control.zoom({
- position: 'topright'
+ attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(map);
map.addLayer(markers);
diff --git a/views/pages/home-page.html b/views/pages/home-page.html
index 11d0f7b..33c776c 100644
--- a/views/pages/home-page.html
+++ b/views/pages/home-page.html
@@ -29,7 +29,6 @@
<p class="text-xl sm:text-2xl lg:text-3xl p-1 w-full font-andika italic text-left
border-l-1.5 border-solid border-(--background-dark-color)
bg-gradient-to-r from-(--background-dark-color) to-(--background-light-color)">{{ .L.HomePage.Contacts }}</p>
- <hr class="w-full border-t-2 border-dotted border-main-hard mb-1">
<a href="https://t.me/EarlInisMona">
<i class="fa-brands fa-telegram w-4 h-4 mr-1"></i>
<span class="font-bold">Telegram:</span>
@@ -106,7 +105,7 @@
bg-gradient-to-r from-(--background-dark-color) to-(--background-light-color)">{{ .L.HomePage.SidebarDescription }}</p>
<hr class="w-full border-t-2 border-dotted border-main-hard mb-1">
<div class="w-full grid grid-cols-[1fr_4fr] content-center items-center
- [&>*:nth-child(4n+2)]:bg-(--background-medium-color)/50 [&>*:nth-child(4n+3)]:bg-(--background-medium-color)/50" style="container-type: inline-size;">
+ [&>*:nth-child(4n+2)]:bg-(--background-medium-color) [&>*:nth-child(4n+3)]:bg-(--background-medium-color)" style="container-type: inline-size;">
<i class="fas fa-home w-full h-full text-[10cqi] content-center text-center text-main-hard"></i>
<p class="p-1">{{ .L.HomePage.HomePageDescription }}</p>
<i class="fas fa-search w-full h-full text-[10cqi] content-center text-center text-main-hard"></i>
diff --git a/views/pages/language-pick.html b/views/pages/language-pick.html
deleted file mode 100644
index 5a9d229..0000000
--- a/views/pages/language-pick.html
+++ /dev/null
@@ -1,16 +0,0 @@
-{{ define "body" }}
-<div class="flex flex-col justify-center text-3xl h-[100%]">
- {{- range .AvailableLanguages }}
- <hr class="border-t-2 border-dotted border-main-hard">
- <div class="nth-[2n+1_of_div]:bg-(--background-medium-color)/50 nth-[2n_of_div]:bg-(--background-light-color)/50 p-2.5 flex flex-row justify-center justify-items-center">
- <a href="/{{ .Name }}" class="w-12 h-12 basis-12 shrink-0 mr-4">
- <img onclick="return changeUrl('{{ .Name }}');" class="w-full h-full aspect-square cursor-pointer object-cover rounded-md select-none" src="{{ .Flag }}">
- </a>
- <a href="/{{ .Name }}" onclick="return changeUrl('{{ .Name }}');" class="cursor-pointer">
- {{ .Alt }}
- </a>
- </div>
- {{- end }}
- <hr class="border-t-2 border-dotted border-main-hard">
-</div>
-{{ end }}