diff options
| author |  Saya Andy <145215889+SayaAndy@users.noreply.github.com>
| 2026-05-03 16:59:36 +0700 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2026-05-03 16:59:36 +0700 |
| commit | ab7035c2c77d2728720ff45f24f45f2cce21ad8d (patch) | |
| tree | d143a7e0234bc7835a75e2b997d043190056adb0 | |
| parent | 658c9860336fedeef5d25e48fb1fc25151b45768 (diff) | |
| parent | f5b3e8cc3cd4e26c327b00970173f5449e790282 (diff) | |
| download | web-0.15.0.tar.gz web-0.15.0.zip | |
v0.15.0 (#30)v0.15.0
- [feat: overhaul
sidebar](https://github.com/SayaAndy/saya-today-web/commit/9c49207891dcd8b9b4249a5377750b4a0ec2fcc1)
- feat: attach desktop content to sidebar, leaving only right space open
- [feat: simplify favicons and make dark theme favicon
lighter](https://github.com/SayaAndy/saya-today-web/commit/18cae75392970179701f00b3356a82f40fc0989f)
- [feat: overhaul like
button](https://github.com/SayaAndy/saya-today-web/commit/bcf964f0851cc2d7582085efda200b58e8c5704d)
- [feat: replace fa icons on homepage with
freehand](https://github.com/SayaAndy/saya-today-web/commit/d409b1938973e31a1bdfe903fed973f396709ca2)
- [fix: always recalculate theme wheel size on
opening](https://github.com/SayaAndy/saya-today-web/commit/f5b3e8cc3cd4e26c327b00970173f5449e790282)
- feat: update sidebar info on home page
- feat: remove font-awesome embeds
- [feat: rm unused classes from
input.css](https://github.com/SayaAndy/saya-today-web/commit/8243ad9ec7b50b0aaf402c91decf3c8093ecb77a)
| -rw-r--r-- | locale/localization.en.yaml | 4 | ||||
| -rw-r--r-- | locale/localization.go | 2 | ||||
| -rw-r--r-- | locale/localization.ru.yaml | 4 | ||||
| -rw-r--r-- | static/favicon-dark.svg | 9 | ||||
| -rw-r--r-- | static/favicon-light.svg | 7 | ||||
| -rw-r--r-- | static/input.css | 120 | ||||
| -rw-r--r-- | views/layouts/general-page.html | 230 | ||||
| -rw-r--r-- | views/pages/global-map.html | 179 | ||||
| -rw-r--r-- | views/pages/home-page.html | 44 | ||||
| -rw-r--r-- | views/partials/blog-page-like-button.html | 31 |
10 files changed, 363 insertions, 267 deletions
diff --git a/locale/localization.en.yaml b/locale/localization.en.yaml index 10bcb94..9571aca 100644 --- a/locale/localization.en.yaml +++ b/locale/localization.en.yaml @@ -16,10 +16,12 @@ HomePage: Contacts: "Contacts" DidYouKnowThat: "Did you know, that..." SidebarDescription: "Describing the Sidebar" + BackDescription: "This button will lead back to higher page (like Home => Language Pick, Blog Search => Home)" HomePageDescription: "Home Page -- where we are right now!" BlogSearchDescription: "Blog Search. You can find my travel notes there and, maybe, something else!" MarkerMapDescription: "Map with markers of my travel notes -- a convinient way to find an interesting region and find related posts!" - ThemeSwitchDescription: "Theme Palette lets you change the theme of the site -- there are 2 dark and 2 bright themes currently!" + ThemeSwitchDescription: "Theme Palette lets you change the theme of the site -- there are 2 dark and 3 bright themes currently!" + AccountDescription: "This is where you can subscribe to any blog update via E-mail!" Hymn1: "We welcome you to Sayasite!" Hymn2: "We've been expecting you!" Hymn3: "You bring such joy in Sayasite!" diff --git a/locale/localization.go b/locale/localization.go index 7080355..87b8ea1 100644 --- a/locale/localization.go +++ b/locale/localization.go @@ -39,10 +39,12 @@ type HomePageConfig struct { Contacts string `yaml:"Contacts" json:"Contacts"` DidYouKnowThat string `yaml:"DidYouKnowThat" json:"DidYouKnowThat"` SidebarDescription string `yaml:"SidebarDescription" json:"SidebarDescription"` + BackDescription string `yaml:"BackDescription" json:"BackDescription"` HomePageDescription string `yaml:"HomePageDescription" json:"HomePageDescription"` BlogSearchDescription string `yaml:"BlogSearchDescription" json:"BlogSearchDescription"` MarkerMapDescription string `yaml:"MarkerMapDescription" json:"MarkerMapDescription"` ThemeSwitchDescription string `yaml:"ThemeSwitchDescription" json:"ThemeSwitchDescription"` + AccountDescription string `yaml:"AccountDescription" json:"AccountDescription"` Hymn1 string `yaml:"Hymn1" json:"Hymn1"` Hymn2 string `yaml:"Hymn2" json:"Hymn2"` Hymn3 string `yaml:"Hymn3" json:"Hymn3"` diff --git a/locale/localization.ru.yaml b/locale/localization.ru.yaml index 17e1e41..1818998 100644 --- a/locale/localization.ru.yaml +++ b/locale/localization.ru.yaml @@ -16,10 +16,12 @@ HomePage: Contacts: "Контакты" DidYouKnowThat: "А вы знали, что..." SidebarDescription: "Поясняем за сайдбар" + BackDescription: "Эта кнопка позволяет идти на страницу вверх (т.е. Домашняя страница => Выбор языка, Поиск по блогу => Домашняя страница)" HomePageDescription: "Домашняя страница -- где мы сейчас и находимся!" BlogSearchDescription: "Поиск по блогу. Там размещены мои путевые заметки и, может, что-то ещё!" MarkerMapDescription: "Карта с маркерами моих путевых заметок, -- удобный способ найти интересный регион и перейти на заинтересовавшие посты!" - ThemeSwitchDescription: "Позволяет поменять тему сайта -- есть 2 светлые и 2 тёмные темы!" + ThemeSwitchDescription: "Позволяет поменять тему сайта -- есть 3 светлые и 2 тёмные темы!" + AccountDescription: "Здесь можно подписаться на обновления в блоге, используя электронную почту!" Hymn1: "Приветствуем Вас на Саясайте!" Hymn2: "Мы Вас столько ждали!" Hymn3: "Столько радости от Вас на Саясайте!" diff --git a/static/favicon-dark.svg b/static/favicon-dark.svg index f09a1bf..65e31d5 100644 --- a/static/favicon-dark.svg +++ b/static/favicon-dark.svg @@ -4,13 +4,8 @@ </desc> <defs> <linearGradient gradientTransform="rotate(150, 0.5, 0.5)" x1="50%" y1="0%" x2="50%" y2="100%" id="gradient"> - <stop stop-color="hsl(31.4, 100%, 70.8%)" stop-opacity="1" offset="0%"></stop><stop stop-color="hsl(17, 100%, 31%)" stop-opacity="1" offset="100%"></stop> + <stop stop-color="oklch(83.7% 0.128 66.29)" stop-opacity="1" offset="0%"></stop><stop stop-color="#fefad8" stop-opacity="1" offset="100%"></stop> </linearGradient> - <filter id="filter" x="-20%" y="-20%" width="140%" height="140%" filterUnits="objectBoundingBox" primitiveUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> - <feTurbulence type="fractalNoise" baseFrequency="0.005 0.003" numOctaves="1" seed="2" stitchTiles="stitch" x="0%" y="0%" width="100%" height="100%" result="turbulence"></feTurbulence> - <feGaussianBlur stdDeviation="20 0" x="0%" y="0%" width="100%" height="100%" in="turbulence" edgeMode="duplicate" result="blur"></feGaussianBlur> - <feBlend mode="color-dodge" x="0%" y="0%" width="100%" height="100%" in="SourceGraphic" in2="blur" result="blend"></feBlend> - </filter> </defs> - <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" filter="url(#filter)" stroke-width="5"></path> + <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" stroke-width="5"></path> </svg> diff --git a/static/favicon-light.svg b/static/favicon-light.svg index e7ed6eb..078f874 100644 --- a/static/favicon-light.svg +++ b/static/favicon-light.svg @@ -6,11 +6,6 @@ <linearGradient gradientTransform="rotate(150, 0.5, 0.5)" x1="50%" y1="0%" x2="50%" y2="100%" id="gradient"> <stop stop-color="hsl(30.1, 100%, 44.1%)" stop-opacity="1" offset="0%"></stop><stop stop-color="hsl(23.1, 90.7%, 25.3%)" stop-opacity="1" offset="100%"></stop> </linearGradient> - <filter id="filter" x="-20%" y="-20%" width="140%" height="140%" filterUnits="objectBoundingBox" primitiveUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> - <feTurbulence type="fractalNoise" baseFrequency="0.005 0.003" numOctaves="1" seed="2" stitchTiles="stitch" x="0%" y="0%" width="100%" height="100%" result="turbulence"></feTurbulence> - <feGaussianBlur stdDeviation="20 0" x="0%" y="0%" width="100%" height="100%" in="turbulence" edgeMode="duplicate" result="blur"></feGaussianBlur> - <feBlend mode="color-dodge" x="0%" y="0%" width="100%" height="100%" in="SourceGraphic" in2="blur" result="blend"></feBlend> - </filter> </defs> - <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" filter="url(#filter)" stroke-width="5"></path> + <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" stroke-width="5"></path> </svg> diff --git a/static/input.css b/static/input.css index 5d8de42..9114514 100644 --- a/static/input.css +++ b/static/input.css @@ -5,9 +5,11 @@ --font-m-plus: "M PLUS Rounded 1c", sans-serif; --font-gentium: "Gentium Plus", serif; --breakpoint-xs: 32rem; + --color-main: var(--color-main); --color-main-hard: var(--color-main-hard); --color-main-medium: var(--color-main-medium); --color-main-soft: var(--color-main-soft); + --color-background: var(--color-background); --color-background-dark: var(--color-background-dark); --color-background-medium: var(--color-background-medium); --color-background-light: var(--color-background-light); @@ -20,6 +22,20 @@ --color-main-dark-hard: var(--color-main-dark-hard); --color-main-dark-medium: var(--color-main-dark-medium); --color-main-dark-soft: var(--color-main-dark-soft); + --shadow-elevation-flat: 0px 1px 1px 0px rgba(0, 0, 0, 0.2); + --shadow-elevation-0: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); + --shadow-elevation-1: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); + --shadow-elevation-2: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); + --shadow-elevation-3: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12); + --shadow-elevation-4: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); + --shadow-elevation-5: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12); + --shadow-elevation-6: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12); + --shadow-elevation-7: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12); + --shadow-elevation-8: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); + --shadow-elevation-9: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12); + --shadow-elevation-10: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12); + --shadow-elevation-11: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12); + --shadow-elevation-12: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12); } html { @@ -56,14 +72,6 @@ html { background-size: --value([bg-size]), 128px; } -@utility faw-full { - --fa-width: 100%; -} - -@utility faw-* { - --fa-width: calc(--value(integer) * var(--spacing)); -} - body { scrollbar-width: thin; scrollbar-color: var(--color-background-light) var(--color-main-soft); @@ -102,9 +110,11 @@ body { --color-main-light-soft: #ffffdd; --color-main-light-medium: var(--color-main-light-soft); --color-main-light-hard: #fffff0; + --color-main: var(--color-main-dark-hard); --color-main-hard: var(--color-main-dark-hard); --color-main-medium: var(--color-main-dark-medium); --color-main-soft: var(--color-main-dark-soft); + --color-background: var(--color-main-light-hard); --color-background-dark: var(--color-main-light-soft); --color-background-medium: var(--color-main-light-medium); --color-background-light: var(--color-main-light-hard); @@ -132,9 +142,11 @@ body { --color-main-light-soft: #f5eee2; --color-main-light-medium: var(--color-main-light-soft); --color-main-light-hard: #fff9ef; + --color-main: var(--color-main-dark-hard); --color-main-hard: var(--color-main-dark-hard); --color-main-medium: var(--color-main-dark-medium); --color-main-soft: var(--color-main-dark-soft); + --color-background: var(--color-main-light-hard); --color-background-dark: var(--color-main-light-soft); --color-background-medium: var(--color-main-light-medium); --color-background-light: var(--color-main-light-hard); @@ -164,9 +176,11 @@ body { --color-main-dark-hard: #13131b; --color-main-dark-medium: var(--color-main-dark-hard); --color-main-dark-soft: #222230; + --color-main: var(--color-main-light-hard); --color-main-hard: var(--color-main-light-hard); --color-main-medium: var(--color-main-light-medium); --color-main-soft: var(--color-main-light-soft); + --color-background: var(--color-main-dark-soft); --color-background-dark: var(--color-main-dark-hard); --color-background-medium: var(--color-main-dark-medium); --color-background-light: var(--color-main-dark-soft); @@ -231,9 +245,11 @@ body { --color-main-dark-hard: #413b34; --color-main-dark-medium: #62584f; --color-main-dark-soft: #6d6258; + --color-main: var(--color-main-light-hard); --color-main-hard: var(--color-main-light-hard); --color-main-medium: var(--color-main-light-medium); --color-main-soft: var(--color-main-light-soft); + --color-background: var(--color-main-dark-soft); --color-background-dark: var(--color-main-dark-hard); --color-background-medium: var(--color-main-dark-medium); --color-background-light: var(--color-main-dark-soft); @@ -261,9 +277,11 @@ body { --color-main-light-hard: #e3e6ff; --color-main-light-medium: #d1d6ff; --color-main-light-soft: #c3caff; + --color-main: var(--color-main-dark-hard); --color-main-hard: var(--color-main-dark-hard); --color-main-medium: var(--color-main-dark-medium); --color-main-soft: var(--color-main-dark-soft); + --color-background: var(--color-main-light-hard); --color-background-dark: var(--color-main-light-soft); --color-background-medium: var(--color-main-light-medium); --color-background-light: var(--color-main-light-hard); @@ -379,10 +397,6 @@ form.crossable.htmx-request input { border-style: inset; } -.border-outset { - border-style: outset; -} - .bg-sidebar { background-image: var(--squares-and-triangles-background); background-repeat: var(--squares-and-triangles-background-repeat); @@ -482,64 +496,42 @@ form.crossable.htmx-request input { border-radius: 50%; } -.themed-button::before { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: linear-gradient( - 135deg, - var(--color-main-light-hard), - var(--color-main-dark-hard) - ); - opacity: 0.2; - z-index: 10; - content: ""; -} - -.themed-button:active::before { - opacity: 0.4; -} - -.themed-button:hover:not(:active)::before { - opacity: 0; -} - -.themed-button { - border-top: var(--border-size) solid var(--color-main-light-hard); - border-left: var(--border-size) solid var(--color-main-light-hard); - border-bottom: var(--border-size) solid var(--color-main-dark-hard); - border-right: var(--border-size) solid var(--color-main-dark-hard); - position: relative; - --border-size: 0.5rem; +.accent-button, +.accent-button.active:active { + --tw-duration: 1500ms; + --tw-ease: var(--ease-in-out); + --tw-gradient-from: color-mix(in oklab, var(--color-accent-light) 10%, transparent); + --tw-gradient-position: from 225deg in oklab; + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + --tw-gradient-to: color-mix(in oklab, var(--color-accent-light) 10%, transparent); + --tw-gradient-via: transparent; + --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); + background-image: conic-gradient(var(--tw-gradient-stops)); + transition-duration: 1500ms; + transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; + transition-timing-function: var(--ease-in-out); } -.themed-button:active, -.themed-button.active { - border-top: var(--border-size) solid var(--color-main-dark-hard); - border-left: var(--border-size) solid var(--color-main-dark-hard); - border-bottom: var(--border-size) solid var(--color-main-light-hard); - border-right: var(--border-size) solid var(--color-main-light-hard); -} - -.themed-button:active > *, -.themed-button.active > * { - transform: translateY(calc(var(--border-size) / 2)); +.accent-button:hover, +.accent-button.active:active:hover { + cursor: pointer; + --tw-gradient-from: color-mix(in oklab, var(--color-accent-light) 50%, transparent); + --tw-gradient-to: color-mix(in oklab, var(--color-accent-light) 50%, transparent); } -.themed-button.themed-button-sidebar { - --border-size: 0.25rem; - background-image: var(--squares-and-triangles-background); - background-repeat: var(--squares-and-triangles-background-repeat); - background-size: calc( - var(--squares-and-triangles-background-width-coef) * 0.9rem - ) - calc(var(--squares-and-triangles-background-height-coef) * 0.9rem); +.accent-button.active, +.accent-button:active { + --tw-gradient-from: color-mix(in oklab, var(--color-accent-dark) 30%, transparent); + --tw-gradient-position: from 45deg in oklab; + --tw-gradient-to: color-mix(in oklab, var(--color-accent-dark) 30%, transparent); + --tw-gradient-via: color-mix(in oklab, var(--color-accent-light) 50%, transparent); } -.themed-button.themed-button-like { - --border-size: 0.2rem; +.accent-button.active:hover, +.accent-button:active:hover { + --tw-gradient-from: color-mix(in oklab, var(--color-accent-light) 70%, transparent); + --tw-gradient-to: color-mix(in oklab, var(--color-accent-light) 70%, transparent); + --tw-gradient-via: color-mix(in oklab, var(--color-accent-dark) 50%, transparent); } .custom-svg-marker { diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html index 0bd3454..fb018e3 100644 --- a/views/layouts/general-page.html +++ b/views/layouts/general-page.html @@ -24,18 +24,6 @@ /> <link rel="stylesheet" - href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/fontawesome.min.css" - /> - <link - rel="stylesheet" - href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/brands.min.css" - /> - <link - rel="stylesheet" - href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/solid.min.css" - /> - <link - rel="stylesheet" href="{{ .StaticStorageBaseUrl }}/libs/leaflet/1.9.4/leaflet.css" /> <link @@ -64,8 +52,58 @@ <body data-theme="ram" - class="font-m-plus text-main-hard overflow-hidden bg-interlocked-hexagons h-dvh flex flex-row" + class="font-m-plus text-main-hard overflow-hidden bg-interlocked-hexagons h-dvh @container flex" > + <!-- Streamline Icons: https://streamlinehq.com --> + <svg xmlns="http://www.w3.org/2000/svg" style="display:none" aria-hidden="true"> + <symbol id="icon-back" viewBox="-4 -4 32 32"><g> + <path d="M23.9 10.45a12.31 12.31 0 0 0 -1.15 -3.61 9.12 9.12 0 0 0 -2.29 -3A13 13 0 0 0 19 2.88c-0.81 -0.48 -1.73 -1 -2.2 -1.18a0.34 0.34 0 0 0 -0.29 0.62c0.39 0.18 1.09 0.56 1.77 1A14.8 14.8 0 0 1 20 4.38a8.27 8.27 0 0 1 2 2.81 11.57 11.57 0 0 1 1 3.37 9.88 9.88 0 0 1 -4.18 9 11.15 11.15 0 0 1 -9.82 2 20.19 20.19 0 0 1 -2 -0.68A13.23 13.23 0 0 1 5.2 20a8.59 8.59 0 0 1 -3.7 -4.66 8.84 8.84 0 0 1 0.08 -6A12.88 12.88 0 0 1 6 3.31a10.45 10.45 0 0 1 7.24 -1.72 0.3 0.3 0 0 0 0.06 -0.6 11.16 11.16 0 0 0 -7.69 1.69A13.82 13.82 0 0 0 0.71 9a9.81 9.81 0 0 0 -0.23 6.69A9.63 9.63 0 0 0 4.62 21a14.35 14.35 0 0 0 2 1 21.55 21.55 0 0 0 2.09 0.72 12.23 12.23 0 0 0 10.78 -2.27 10.81 10.81 0 0 0 4.41 -10Z" fill="var(--color-accent-deep)" stroke-width="1"></path> + <path d="M18.68 13.8a0.29 0.29 0 0 0 0.36 -0.22 7.5 7.5 0 0 0 -0.4 -4.82 0.6 0.6 0 0 0 -0.44 -0.3 4.51 4.51 0 0 0 -0.95 0c-0.46 0 -3.32 0.39 -5.08 0.58l-0.68 0.07 0 -0.67a18.15 18.15 0 0 0 -0.16 -2.34 1.16 1.16 0 0 0 -0.15 -0.42 0.57 0.57 0 0 0 -0.46 -0.25 2.88 2.88 0 0 0 -1.27 0.41A17.24 17.24 0 0 0 6 8.49a10.89 10.89 0 0 0 -1.68 2 2.28 2.28 0 0 0 -0.41 1.33A5.09 5.09 0 0 0 5.28 14a32.9 32.9 0 0 0 4 3.68 10.06 10.06 0 0 0 1.07 0.5 0.63 0.63 0 0 0 0.55 -0.06 2 2 0 0 0 0.42 -1c0.14 -0.82 0.23 -2.12 0.28 -2.72l0.31 0c1.43 0.11 4.57 0.35 5.94 0.4a5.59 5.59 0 0 0 0.64 0 0.48 0.48 0 0 0 0.29 -0.13 0.34 0.34 0 0 0 -0.36 -0.55c0 -0.08 -0.29 0 -0.54 0 -1.36 -0.08 -4.48 -0.4 -5.9 -0.55l-0.65 -0.07a0.51 0.51 0 0 0 -0.52 0.27 34 34 0 0 1 -0.49 3.45c-0.22 -0.13 -0.49 -0.35 -0.56 -0.4a34.25 34.25 0 0 1 -3.12 -3 13.83 13.83 0 0 1 -1.29 -1.54 1.39 1.39 0 0 1 -0.35 -0.55 1.61 1.61 0 0 1 0.39 -0.84 13 13 0 0 1 2 -2.17A16.1 16.1 0 0 1 9.8 6.91l0.54 -0.3a16.11 16.11 0 0 1 0.15 1.8l0 1.19a0.5 0.5 0 0 0 0.5 0.5c0.23 0 0.71 -0.06 1.32 -0.15 1.72 -0.25 4.5 -0.74 5 -0.74 0.15 0 0.65 0.14 0.79 0a6.76 6.76 0 0 1 0.54 2 6.61 6.61 0 0 1 -0.12 2.23 0.3 0.3 0 0 0 0.16 0.36Zm-8.07 3.46c0 0.07 -0.1 0.06 -0.2 0 0.1 -0.04 0.24 -0.11 0.2 0ZM10.26 6.2l0 0.08v0.08c-0.07 -0.06 -0.13 -0.12 0 -0.16Z" fill="var(--color-main)" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-logo" role="img" viewBox="-20 -20 160 160"> + <defs> + <linearGradient gradientTransform="rotate(150, 0.5, 0.5)" x1="50%" y1="0%" x2="50%" y2="100%" id="gradient"> + <stop stop-color="var(--color-accent-deep)" stop-opacity="1" offset="0%"></stop><stop stop-color="var(--color-main)" stop-opacity="1" offset="100%"></stop> + </linearGradient> + </defs> + <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" stroke-width="5"></path> + </symbol> + <symbol id="icon-newspaper" viewBox="-4 -4 32 32"><g> + <path d="M13.3 5.15c-1.68 -0.31 -9.3 -1.08 -9.61 0.47 -0.58 2.8 -0.8 3.4 -0.8 3.76 0 0.87 1.94 1 2.81 1.14s1.94 0.29 2.92 0.4a11.4 11.4 0 0 0 3.85 -0.28c0.29 0 0.68 0 0.9 -0.34a2.66 2.66 0 0 0 0.15 -1.3c0.34 -2.77 0.4 -3 0.3 -3.34a0.67 0.67 0 0 0 -0.52 -0.51Zm-1 4.36 -1.7 0.28a30.3 30.3 0 0 1 -4.81 -0.23 6.67 6.67 0 0 1 -2 -0.28c0 -0.19 -0.09 0.74 0.29 -2.08 0 0 0.36 -1.37 0.36 -1.45 0.15 0.37 5 -0.24 7.2 0.14q0.55 0.09 1.08 0.21l0 0.46c-0.52 3.63 -0.44 2.72 -0.45 2.95Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M17.54 7a0.34 0.34 0 0 0 0.46 -0.17c0.58 -0.9 -1.81 -1.11 -3.24 -0.87a0.35 0.35 0 0 0 -0.37 0.32c-0.04 0.72 2.45 0.41 3.15 0.72Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M14.44 9.13a5 5 0 0 0 3.08 0.48c0.43 0.14 1.06 -0.56 0.19 -0.86a3.36 3.36 0 0 0 -0.6 -0.09c-0.96 -0.15 -3.11 -0.4 -2.67 0.47Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M7.78 12.72c-4.92 -0.13 -4.67 -0.09 -4.8 0.13a0.28 0.28 0 0 0 0.15 0.42c0.16 0.09 0.06 0.05 4.61 0.52a73.45 73.45 0 0 0 9.5 0 0.34 0.34 0 0 0 0 -0.68c-2.38 0 -3 -0.23 -9.46 -0.39Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M16.68 16.61c-5.44 -0.27 -3.68 -0.55 -8.64 -0.47 -0.89 0 -1.78 0.05 -2.67 0 -0.35 0 -2.17 -0.26 -2.3 -0.23a0.32 0.32 0 0 0 0 0.61c0.1 0 -0.16 0 2.25 0.44a77.28 77.28 0 0 0 7.73 0.39l1.13 0c4.08 0.01 3.37 -0.77 2.5 -0.74Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M24 10.27c-0.13 -3.52 -0.05 -2.5 -0.14 -4.86a0.44 0.44 0 0 0 -0.76 -0.28 2.72 2.72 0 0 1 -2.33 1.25 21.46 21.46 0 0 0 0.56 -2.94 0.88 0.88 0 0 0 -0.22 -0.6c-0.31 -0.3 -3 -0.21 -3.48 -0.2 -3.05 0.09 -5.71 -0.27 -9.06 -0.2 -4.62 0.1 -5.83 -0.73 -5.47 0.2a0.45 0.45 0 0 0 0.3 0.24 33.56 33.56 0 0 0 5.17 0.37c4.41 0.09 4.28 0.53 11.32 0.53l0.17 0c0 1.27 -1 3.8 -1 8.45 0 1.64 0.13 6.24 0.85 7.56a2.26 2.26 0 0 0 0.4 0.51c-3.31 1.08 -15.91 0.5 -17.78 -0.21 -0.32 -0.12 -0.77 -0.16 -0.9 -0.36 -1.17 -1.73 0.06 -9.79 0.28 -11.81a27.82 27.82 0 0 1 0.67 -3.53A7.91 7.91 0 0 0 3 2.69a0.31 0.31 0 0 0 -0.58 0c0.09 -0.1 -0.89 2.79 -1.25 5.18C0.72 10.49 -0.86 18.1 0.61 20.33c0.4 0.61 1 0.63 1.45 0.81a11.09 11.09 0 0 0 3.14 0.51c2.08 0.13 15.3 0.61 16.69 -1.21 2.16 -2.82 2.2 -6.66 2.11 -10.17ZM21.3 20a1 1 0 0 1 -0.8 -0.58c-0.61 -1.2 -0.59 -5.82 -0.53 -7.19A33.39 33.39 0 0 1 20.61 7a3.11 3.11 0 0 0 1.24 -0.07 3.52 3.52 0 0 0 1.09 -0.52C22.61 13 23.52 16.56 21.3 20Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M21.43 8.91c-0.57 -0.41 -0.55 1 -0.68 2.15a19.8 19.8 0 0 0 0.06 4.15 0.34 0.34 0 0 0 0.68 0 20.13 20.13 0 0 0 0.31 -4.15c-0.28 -2.29 -0.19 -2.06 -0.37 -2.15Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-map" viewBox="-4 -4 32 32"><g> + <path d="M18.47 13.42a0.31 0.31 0 0 0 0.41 0.11 0.29 0.29 0 0 0 0.11 -0.41C18 11.2 16.38 9.18 15.71 7A5.35 5.35 0 0 1 16 2.86a3.54 3.54 0 0 1 2.4 -1.53 4.18 4.18 0 0 1 2.93 0.18 3.19 3.19 0 0 1 1.16 1.2A3.59 3.59 0 0 1 23 4.34a6.78 6.78 0 0 1 -0.53 2.76 34 34 0 0 1 -2.1 4l-1.11 1.62a0.35 0.35 0 0 0 0.1 0.48 0.34 0.34 0 0 0 0.47 -0.09L21 11.45a33.28 33.28 0 0 0 2.3 -4 7.51 7.51 0 0 0 0.7 -3.14 4.62 4.62 0 0 0 -0.6 -2.14A4.23 4.23 0 0 0 21.86 0.52 5.38 5.38 0 0 0 18.08 0.2 4.66 4.66 0 0 0 15 2.38a6.25 6.25 0 0 0 -0.12 4.94c0.74 2.18 2.44 4.18 3.59 6.1Z" fill="var(--color-main)" stroke-width="1"></path> + <path d="M18.36 6.15C21 7 21 4.49 20 3.73c-1.39 -1.32 -3.48 1.84 -1.64 2.42Z" fill="var(--color-main)" stroke-width="1"></path> + <path d="M8.79 9a1.43 1.43 0 0 1 -0.37 0.77c-0.31 0.31 -0.89 0.45 -1.26 0.74a1.36 1.36 0 0 0 -0.49 0.85 3.43 3.43 0 0 0 0.21 1.58 8 8 0 0 1 0.55 1.79 1 1 0 0 1 -0.3 0.86 1.51 1.51 0 0 1 -0.65 0.35 1.9 1.9 0 0 1 -0.81 0.08 8.41 8.41 0 0 0 -1.15 -0.14 1.73 1.73 0 0 0 -0.94 0.23 1.93 1.93 0 0 0 -0.67 0.8c-0.15 0.31 -0.28 0.67 -0.44 1s0 1.08 0.51 0.57a2.55 2.55 0 0 0 0.51 -0.86 1.53 1.53 0 0 1 0.51 -0.76 0.87 0.87 0 0 1 0.48 -0.06 6.7 6.7 0 0 1 1 0.21 3.13 3.13 0 0 0 1.25 0 2.54 2.54 0 0 0 1.18 -0.59 2.11 2.11 0 0 0 0.66 -1.77 6.48 6.48 0 0 0 -0.53 -1.77 3.24 3.24 0 0 1 -0.37 -1.37 0.52 0.52 0 0 1 0.24 -0.34A6.52 6.52 0 0 0 9 10.31a2.07 2.07 0 0 0 0.48 -1.25 4.3 4.3 0 0 0 -0.07 -1c-0.26 -0.34 -0.71 -0.22 -0.63 0.07a2.49 2.49 0 0 1 0.01 0.87Z" fill="var(--color-accent-deep)" stroke-width="1"></path> + <path d="m23.83 20.17 -0.44 -2.79 -0.67 -5.76a0.3 0.3 0 0 0 -0.6 0.08l0.54 5.77 0.34 2.77c0 0.17 0.06 0.38 0.08 0.58a0.5 0.5 0 0 1 0 0.18 0.63 0.63 0 0 1 -0.26 0.22c-0.16 0.09 -0.34 0.15 -0.49 0.22 -0.33 0.13 -0.67 0.25 -1 0.36 -0.52 0.16 -1 0.28 -1.58 0.41 -0.84 0.2 -1.7 0.45 -2.57 0.61a7.67 7.67 0 0 1 -1.65 0.14 4.8 4.8 0 0 1 -1.13 -0.21c-0.39 -0.11 -4.47 -1.38 -6 -1.81a8.17 8.17 0 0 0 -2.35 -0.33 10.19 10.19 0 0 0 -2.33 0.32 5.3 5.3 0 0 0 -1.21 0.27l0 -0.21c0 -0.22 0 -0.45 -0.06 -0.67 0 -0.47 -0.28 -2.86 -0.33 -3.26 -0.3 -2.29 -0.7 -4.78 -0.88 -7.09l-0.08 -1.36A9.09 9.09 0 0 1 1 7.34 0.4 0.4 0 0 1 1.14 7a2.44 2.44 0 0 1 1.07 -0.33 12.47 12.47 0 0 1 1.94 0A12.63 12.63 0 0 1 6 6.88a14.23 14.23 0 0 1 1.81 0.49c0.24 0.08 2.74 0.92 3.32 1.09a22.06 22.06 0 0 0 2.3 0.6 0.35 0.35 0 1 0 0.12 -0.68 20.56 20.56 0 0 1 -2.2 -0.61c-1.28 -0.42 -2.6 -0.91 -3.28 -1.15a15.84 15.84 0 0 0 -1.9 -0.55 13.16 13.16 0 0 0 -2 -0.28 12.94 12.94 0 0 0 -2.08 0 3.2 3.2 0 0 0 -1.47 0.44A1.27 1.27 0 0 0 0 7a5.65 5.65 0 0 0 0.19 1.71L0.22 10c0.15 2.33 0.63 4.62 0.9 6.93 0.07 0.57 0.13 1.13 0.16 1.7s0 1.12 0 1.69a7 7 0 0 0 0.07 0.79 3.24 3.24 0 0 0 0.16 0.8 1.51 1.51 0 0 0 0.27 0.42 0.76 0.76 0 0 0 0.63 0.22A11.69 11.69 0 0 0 4 22.06a8.45 8.45 0 0 1 2.06 -0.29 7 7 0 0 1 2 0.28l4.16 1.13c0.62 0.2 1.22 0.43 1.84 0.6a5.67 5.67 0 0 0 1.37 0.21 8 8 0 0 0 1.88 -0.19c0.89 -0.18 1.76 -0.47 2.6 -0.69 0.56 -0.14 1.1 -0.29 1.63 -0.47 0.37 -0.12 0.73 -0.26 1.08 -0.41a4.65 4.65 0 0 0 0.7 -0.36 1.35 1.35 0 0 0 0.45 -0.5 1 1 0 0 0 0.1 -0.47 6.79 6.79 0 0 0 -0.04 -0.73Z" fill="var(--color-main)" stroke-width="1"></path> + <path d="M13.27 21.36a3 3 0 0 0 -0.93 -2 8.73 8.73 0 0 1 -0.87 -0.85 0.56 0.56 0 0 1 -0.11 -0.62 1.94 1.94 0 0 1 0.76 -0.83 3 3 0 0 1 1.12 -0.51 8.59 8.59 0 0 0 2.07 -0.43 1.88 1.88 0 0 0 1 -1.23l0.12 -0.7a0.3 0.3 0 0 0 -0.29 -0.32 0.29 0.29 0 0 0 -0.31 0.29l-0.15 0.5a1.21 1.21 0 0 1 -0.71 0.71 7.5 7.5 0 0 1 -1.89 0.14 4 4 0 0 0 -1.62 0.59 3 3 0 0 0 -1.19 1.35 1.56 1.56 0 0 0 0.12 1.5 6.3 6.3 0 0 0 1.26 1.15 2.41 2.41 0 0 1 0.8 1.19 0.92 0.92 0 0 1 0 0.52c0 0.33 0.6 0.64 0.75 0.14a1.84 1.84 0 0 0 0.07 -0.59Z" fill="var(--color-accent-deep)" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-palette" viewBox="-4 -4 32 32"><g> + <path d="M10 19.26a0.32 0.32 0 0 0 0 0.59 5.85 5.85 0 0 0 1.62 0.42 1 1 0 0 0 0.93 -0.34 5.08 5.08 0 0 0 0.63 -1.35c0.33 -1 0.46 -2.23 0.71 -3.15 0.09 -0.34 0.2 -0.67 0.32 -1 0.28 -0.79 0.61 -1.56 0.88 -2.36 0.14 -0.4 0.27 -0.81 0.39 -1.22 0.27 -0.94 0.5 -1.9 0.78 -2.84 0.2 -0.69 0.43 -1.39 0.62 -2.1a12.59 12.59 0 0 0 0.32 -1.48 8.09 8.09 0 0 0 0.16 -1 0.83 0.83 0 0 0 -0.19 -0.58 1.68 1.68 0 0 0 -0.64 -0.41 7.51 7.51 0 0 0 -1.33 -0.37l-4.3 -0.78c-0.4 -0.1 -0.73 0.1 -0.95 0.57 -0.33 0.7 -0.42 2.14 -0.77 2.79a0.3 0.3 0 0 0 0.11 0.39 0.28 0.28 0 0 0 0.42 -0.04 18.6 18.6 0 0 0 0.77 -2.47 1.87 1.87 0 0 1 0.19 -0.4s0 -0.07 0.08 -0.06L15 3a4.45 4.45 0 0 1 1.41 0.53 5.74 5.74 0 0 1 -0.24 0.71 12.78 12.78 0 0 1 -0.32 1.36c-0.2 0.7 -0.43 1.4 -0.63 2.09l-1.1 4c-0.24 0.81 -0.54 1.58 -0.79 2.38 -0.11 0.35 -0.21 0.7 -0.3 1.07 -0.21 0.92 -0.3 2.11 -0.58 3.15a4.64 4.64 0 0 1 -0.45 1.23s-0.08 0 -0.13 0a1.89 1.89 0 0 1 -0.57 0 6.94 6.94 0 0 1 -1 -0.28 0.33 0.33 0 0 0 -0.24 0 4 4 0 0 0 0.83 -0.27 1.74 1.74 0 0 0 0.68 -0.57 0.83 0.83 0 0 0 0.14 -0.54 5.77 5.77 0 0 0 -0.17 -0.79l-0.59 -2.83c-0.22 -1.19 -0.48 -2.38 -0.76 -3.56 -0.43 -1.77 -0.91 -3.53 -1.37 -5.27A24.28 24.28 0 0 0 8 2.73 5.29 5.29 0 0 0 6.85 1a0.74 0.74 0 0 0 -0.54 -0.17 3.48 3.48 0 0 0 -0.67 0.17l-2.21 0.66A10.36 10.36 0 0 0 0.91 2.77 1.91 1.91 0 0 0 0 4a2.51 2.51 0 0 0 0.08 1c0.14 0.61 0.44 1.28 0.58 1.73L2.17 12l2.27 8a0.27 0.27 0 0 0 0.35 0.2 0.29 0.29 0 0 0 0.2 -0.35l-2 -8.1 -1.37 -5.36c-0.1 -0.38 -0.32 -0.94 -0.46 -1.47a1.93 1.93 0 0 1 -0.1 -0.79c0 -0.27 0.38 -0.45 0.74 -0.65a9.89 9.89 0 0 1 2 -0.78L6 2l0.24 0a4.41 4.41 0 0 1 0.7 1.2 21 21 0 0 1 0.8 2.55c0.49 1.72 1 3.46 1.46 5.21 0.31 1.16 0.6 2.33 0.84 3.49l0.66 2.86 0.18 0.71a1 1 0 0 1 -0.39 0.32 3.81 3.81 0 0 1 -0.91 0.32l-3.64 0.93a0.33 0.33 0 0 0 -0.24 0.39 0.32 0.32 0 0 0 0.39 0.25l3.67 -0.86a2 2 0 0 0 0.24 -0.11Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M23.73 9.93a7.66 7.66 0 0 0 -0.8 -0.88 13.75 13.75 0 0 0 -1.45 -1.31c-0.77 -0.63 -1.61 -1.25 -2.23 -1.75a0.58 0.58 0 0 0 -0.68 0.11c-0.37 0.29 -1.05 1 -1.5 1.41l-0.18 0.19 -0.08 0 -0.07 0a0.25 0.25 0 0 0 -0.17 0.1 0.27 0.27 0 0 0 0 0.4c0.07 0.07 0.32 0.12 0.62 -0.1s1.09 -1 1.55 -1.34l0.26 -0.1c0.57 0.5 1.3 1.11 2 1.71a15.9 15.9 0 0 1 1.3 1.3c0.15 0.17 1.1 0.88 0.77 1a1.06 1.06 0 0 1 -0.23 0.41c-0.15 0.2 -0.34 0.39 -0.47 0.54s-0.49 0.51 -0.74 0.76c-0.61 0.6 -1.25 1.17 -1.86 1.77 -1.47 1.51 -2.86 3.12 -4.32 4.65 -0.62 0.65 -1.24 1.29 -1.9 1.9 -0.33 0.3 -0.65 0.6 -1 0.88s-0.45 0.37 -0.68 0.54 -0.46 0.2 -0.42 0.33a1.38 1.38 0 0 1 -0.74 -0.32 7.64 7.64 0 0 1 -1.13 -1.17 0.33 0.33 0 0 0 -0.51 0.41 8.44 8.44 0 0 0 1.21 1.32 2 2 0 0 0 1.27 0.51 0.62 0.62 0 0 0 0.31 -0.1c0.15 -0.09 0.36 -0.28 0.45 -0.34 0.26 -0.18 0.51 -0.36 0.75 -0.55s0.7 -0.57 1.05 -0.86c0.7 -0.6 1.37 -1.22 2 -1.87 1.46 -1.48 2.89 -3.1 4.37 -4.58 0.6 -0.61 1.24 -1.17 1.84 -1.78 0.27 -0.27 0.53 -0.54 0.78 -0.83a5.83 5.83 0 0 0 0.71 -1 1.66 1.66 0 0 0 0.19 -0.65 1.3 1.3 0 0 0 -0.27 -0.71Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="m16.85 7.71 -0.09 0h0.05Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M14.33 8.68a5.87 5.87 0 0 0 0.29 -0.75 11.92 11.92 0 0 0 0.62 -1.7 3.66 3.66 0 0 0 0.08 -1.38 0.61 0.61 0 0 0 -0.38 -0.43 4.9 4.9 0 0 0 -0.51 -0.12L12.84 4l-1.31 -0.29 -0.36 0a0.45 0.45 0 0 0 -0.47 0.28l-0.33 1.81a0.28 0.28 0 0 0 0.22 0.34 0.29 0.29 0 0 0 0.34 -0.22l0.41 -1.42 1.22 0.42 1.58 0.43h0.1a3.68 3.68 0 0 1 -0.09 0.63 12.53 12.53 0 0 1 -0.49 1.59s0 0.17 0 0.32c-0.18 -0.07 -0.43 -0.09 -0.51 -0.12 -0.37 -0.13 -0.74 -0.25 -1.12 -0.36l-1.13 -0.29a0.32 0.32 0 0 0 -0.4 0.22 0.32 0.32 0 0 0 0.22 0.4c0.36 0.12 0.72 0.24 1.07 0.38l1 0.43c0.13 0.06 0.47 0.29 0.71 0.38A0.86 0.86 0 0 0 14 9a0.57 0.57 0 0 0 0.33 -0.32Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M12.42 12.21s-0.07 0.14 -0.12 0.27l-0.71 -0.21a0.33 0.33 0 0 0 -0.4 0.24 0.32 0.32 0 0 0 0.24 0.39c0.27 0.1 0.57 0.31 0.86 0.44l0.31 0.1a0.55 0.55 0 0 0 0.49 -0.34c0.07 -0.15 0.23 -0.55 0.25 -0.59a11.17 11.17 0 0 0 0.49 -1.3 2.71 2.71 0 0 0 0.09 -1.11 0.59 0.59 0 0 0 -0.34 -0.44 4.71 4.71 0 0 0 -0.66 -0.13l-2 -0.19a0.28 0.28 0 0 0 -0.32 0.25 0.29 0.29 0 0 0 0.24 0.32l1.89 0.57 0.15 0c0 0.14 -0.06 0.29 -0.09 0.44 -0.12 0.47 -0.27 0.93 -0.37 1.29Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="m18.71 12.05 -0.09 0.15a2.08 2.08 0 0 0 -0.19 -0.23l-1.57 -1.45a0.33 0.33 0 0 0 -0.46 0.46l1.41 1.67a5.31 5.31 0 0 0 0.38 0.46 0.67 0.67 0 0 0 0.35 0.2 0.6 0.6 0 0 0 0.43 -0.09 5.42 5.42 0 0 0 0.43 -0.34c0.22 -0.18 0.43 -0.36 0.64 -0.56s0.38 -0.4 0.57 -0.61c0 0 0.31 -0.37 0.39 -0.51a0.57 0.57 0 0 0 -0.05 -0.72c-0.44 -0.36 -0.86 -0.72 -1.27 -1.1s-0.54 -0.51 -0.81 -0.78a0.29 0.29 0 0 0 -0.4 0 0.3 0.3 0 0 0 0 0.41c0.28 0.4 0.57 0.77 0.88 1.15s0.42 0.51 0.64 0.76l-0.15 0.1Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M15.08 15.8a0.33 0.33 0 0 0 0.41 0.52c2.89 -1.7 2.2 -1.19 2.45 -1.42a0.59 0.59 0 0 0 0.19 -0.34 0.57 0.57 0 0 0 -0.13 -0.46 6.23 6.23 0 0 0 -0.56 -0.6A16.32 16.32 0 0 0 16 12.36a0.3 0.3 0 0 0 -0.41 0 0.29 0.29 0 0 0 0 0.41l1.21 1.54 -0.27 0.21Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M4.42 15.19a0.43 0.43 0 0 0 0.34 0.32 1.3 1.3 0 0 0 0.44 0c0.26 0 0.54 -0.14 0.75 -0.18 0.43 -0.11 0.88 -0.17 1.32 -0.27a5.69 5.69 0 0 0 0.59 -0.16 7.54 7.54 0 0 0 0.81 -0.27 0.66 0.66 0 0 0 0.33 -0.52 2.87 2.87 0 0 0 0 -0.76c-0.1 -0.49 -0.54 -1.9 -0.67 -2.31a4.6 4.6 0 0 0 -0.23 -0.63 0.57 0.57 0 0 0 -0.26 -0.26 1 1 0 0 0 -0.56 0 6.66 6.66 0 0 0 -0.8 0.28c-2.84 1.09 -2.89 0.66 -2.81 1.08l0.65 3.09s0.05 0.4 0.1 0.59Zm2.26 -3.95c0.13 0 0.33 -0.11 0.53 -0.16l0.07 0a3 3 0 0 0 0.12 0.3c0.09 0.33 0.46 1.65 0.55 2.05a2.79 2.79 0 0 1 0.07 0.38 3.67 3.67 0 0 1 -0.45 0.06l-1.85 0.54 -0.61 0.2c-0.05 -0.11 -0.12 -0.22 -0.12 -0.24l-0.67 -2.43Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M2.88 8.84a0.44 0.44 0 0 0 0.34 0.33 1.15 1.15 0 0 0 0.45 0A6.18 6.18 0 0 0 4.41 9c0.44 -0.1 0.88 -0.16 1.32 -0.26 0.2 -0.05 0.4 -0.1 0.6 -0.17 0 0 0.6 -0.17 0.81 -0.27a0.62 0.62 0 0 0 0.36 -0.52A2.88 2.88 0 0 0 7.44 7c-0.11 -0.48 -0.55 -1.9 -0.68 -2.3a6.1 6.1 0 0 0 -0.22 -0.63 0.57 0.57 0 0 0 -0.27 -0.27 1 1 0 0 0 -0.56 0 5.82 5.82 0 0 0 -0.79 0.29C2.08 5.14 2 4.71 2.1 5.14l0.65 3.09s0.08 0.46 0.13 0.61Zm2.26 -3.95 0.53 -0.15 0.07 0c0 0.12 0.11 0.25 0.12 0.29 0.09 0.33 0.46 1.65 0.55 2.05a2.66 2.66 0 0 1 0.07 0.39c-0.19 0 -0.42 0 -0.45 0.06L4.19 8l-0.62 0.2c0 -0.11 -0.12 -0.22 -0.12 -0.23l-0.67 -2.39Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-account" viewBox="-4 -4 32 32"><g> + <path d="M18.33 20a0.35 0.35 0 0 0 0.35 -0.34 10.26 10.26 0 0 0 -0.22 -2.9 8.42 8.42 0 0 0 -0.36 -1.21 7.92 7.92 0 0 0 -0.54 -1.14 6 6 0 0 0 -1.92 -2 4.54 4.54 0 0 0 1.53 -3.5 7.58 7.58 0 0 0 -0.23 -2.56 4.49 4.49 0 0 0 -0.88 -1.53 0.34 0.34 0 0 0 -0.49 0 0.35 0.35 0 0 0 -0.05 0.49 3.53 3.53 0 0 1 0.77 1.67 7.89 7.89 0 0 1 0 1.95 3.63 3.63 0 0 1 -2.71 3.47A5.37 5.37 0 0 1 9 11.54a2.77 2.77 0 0 1 -0.92 -1.41 4.19 4.19 0 0 1 -0.19 -1.8 5.55 5.55 0 0 1 0.86 -2.46 3.65 3.65 0 0 1 2 -1.5 7.27 7.27 0 0 1 1.94 -0.31 4.75 4.75 0 0 1 1.89 0.35 0.3 0.3 0 0 0 0.25 -0.55 5.19 5.19 0 0 0 -2.13 -0.51 8.53 8.53 0 0 0 -2.16 0.23A4.58 4.58 0 0 0 8 5.3a6.6 6.6 0 0 0 -1.18 2.86A5.17 5.17 0 0 0 7 10.48a3.85 3.85 0 0 0 1.34 2l0.22 0.14a6.23 6.23 0 0 0 -2.34 1.88 6 6 0 0 0 -0.94 1.8 7.45 7.45 0 0 0 -0.33 2 12.07 12.07 0 0 0 -0.08 1.48 1.82 1.82 0 0 0 0.17 0.76 0.32 0.32 0 0 0 0.42 0.13 0.31 0.31 0 0 0 0.13 -0.42 1.25 1.25 0 0 1 0 -0.64c0.07 -0.45 0.22 -0.93 0.28 -1.2a8.28 8.28 0 0 1 0.5 -1.69 7.87 7.87 0 0 1 0.78 -1.53A6.48 6.48 0 0 1 9.4 13.1a6.41 6.41 0 0 0 4.53 0.29 5.19 5.19 0 0 0 1.21 -0.58 6.56 6.56 0 0 1 1.59 2.5c0.24 0.55 0.46 1.12 0.65 1.69a11.51 11.51 0 0 1 0.62 2.67 0.35 0.35 0 0 0 0.33 0.33Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M0.24 6.28a0.5 0.5 0 0 0 0 0.14 0.29 0.29 0 0 0 0.31 0.18c0.38 -0.06 0.26 -0.41 0.27 -0.82a29.28 29.28 0 0 1 0.3 -3.08 4.73 4.73 0 0 1 0.24 -1.14 0.48 0.48 0 0 1 0.3 -0.28 8.85 8.85 0 0 1 1.25 -0.16A7.63 7.63 0 0 1 3.86 1l2.36 0a0.35 0.35 0 0 0 0.35 -0.33 0.35 0.35 0 0 0 -0.35 -0.35C5.43 0.28 4.66 0.13 3.87 0.08A6.36 6.36 0 0 0 2.8 0.07a7.65 7.65 0 0 0 -1.49 0.1 1.53 1.53 0 0 0 -1 0.92A4.77 4.77 0 0 0 0 2.6a22.83 22.83 0 0 0 0.18 3.21 3.73 3.73 0 0 0 0.06 0.47Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="m6.29 23 -2.37 0a7.47 7.47 0 0 1 -0.92 -0.12 9 9 0 0 1 -1.26 -0.16 0.46 0.46 0 0 1 -0.29 -0.29 4.46 4.46 0 0 1 -0.25 -1.13 28.94 28.94 0 0 1 -0.26 -3.08 2.37 2.37 0 0 0 0 -0.64c0 -0.09 -0.51 -0.33 -0.6 0.14l-0.06 0.47a21.56 21.56 0 0 0 -0.2 3.21 4.77 4.77 0 0 0 0.28 1.51 1.52 1.52 0 0 0 1 0.92 7.66 7.66 0 0 0 1.49 0.11 7.79 7.79 0 0 0 1.08 0c0.79 -0.06 1.56 -0.2 2.35 -0.24a0.35 0.35 0 0 0 0 -0.7Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M17.71 1c0.79 0.05 1.58 0 2.37 0a7.47 7.47 0 0 1 0.94 0.09 9 9 0 0 1 1.26 0.16 0.47 0.47 0 0 1 0.29 0.28 4.56 4.56 0 0 1 0.25 1.14 32.83 32.83 0 0 1 0.28 3.72c0 0.09 0.51 0.32 0.6 -0.14l0.06 -0.47a21.7 21.7 0 0 0 0.16 -3.22 4.7 4.7 0 0 0 -0.28 -1.5 1.53 1.53 0 0 0 -1 -0.93 8.59 8.59 0 0 0 -1.49 -0.1 9.73 9.73 0 0 0 -1.08 0c-0.79 0.06 -1.56 0.2 -2.35 0.25a0.34 0.34 0 0 0 -0.34 0.34 0.34 0.34 0 0 0 0.33 0.38Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M23.82 18.17c0 -0.42 -0.05 -0.84 -0.4 -0.78s-0.26 0.35 -0.27 0.81a28.84 28.84 0 0 1 -0.27 3.08 4.63 4.63 0 0 1 -0.24 1.14 0.46 0.46 0 0 1 -0.3 0.28 7.6 7.6 0 0 1 -1.25 0.16 7.63 7.63 0 0 1 -0.95 0.09l-2.36 0a0.35 0.35 0 1 0 0 0.69c0.79 0.05 1.56 0.19 2.35 0.25a9.53 9.53 0 0 0 1.07 0 8.52 8.52 0 0 0 1.49 -0.1 1.55 1.55 0 0 0 1 -0.93 4.7 4.7 0 0 0 0.28 -1.5 23 23 0 0 0 -0.15 -3.19Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + </g></symbol> + </svg> + <script> let map = null; </script> @@ -80,7 +118,10 @@ newPathname = newPathname.replace(/\/[^\/]+$/, ""); path = path.slice(0, -3); } - const newPath = toAppend ? `${newPathname}${path}` : `${path}`; + newPath = toAppend ? `${newPathname}${path}` : `${path}`; + if (newPath.length == 0) { + newPath = "/"; + } history.pushState( {}, @@ -286,83 +327,64 @@ Intl.DateTimeFormat().resolvedOptions().timeZone; </script> - <div class="grow bg-split-left"></div> - - <div class="flex flex-col sm:flex-row"> - <div + <div class="flex flex-col md:flex-row w-full lg:w-11/12 xl:w-10/12 2xl:w-9/12 h-full @container/main"> + <nav id="sidebar" - class="bg-sidebar flex flex-row sticky w-dvw h-fit xs:w-[90dvw] sm:left-0 sm:flex-col sm:fixed sm:w-fit z-20 shadow-[0_0_1rem_black]" + aria-label="Main navigation" + class="flex flex-row w-full h-24 md:flex-col md:w-24 md:h-full bg-paper bg-background shadow-elevation-6 z-2 shrink-0" > - <nav - aria-label="Main navigation" - class="text-[3rem] flex flex-row sm:flex-col gap-0 relative z-20" + <a + class="w-18 h-18 rounded-xl m-3 accent-button" + onclick="return changeUrl('/..', true);" + href="../" + id="sidebar-back-button" + draggable="false" > - <a - onclick="return changeUrl('/..', true);" - href="../" - id="sidebar-back-button" - class="themed-button themed-button-sidebar w-fit h-fit hidden" - draggable="false" - > - <i - class="fas fa-circle-left flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> - <a - onclick="return changeUrl('/{{ .Lang }}');" - href="/{{ .Lang }}" - id="sidebar-home-button" - class="themed-button themed-button-sidebar w-fit h-fit hidden" - draggable="false" - > - <i - class="fas fa-home flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> - <a - onclick="return changeUrl('/{{ .Lang }}/blog');" - href="/{{ .Lang }}/blog" - id="sidebar-blog-button" - class="themed-button themed-button-sidebar w-fit h-fit hidden" - draggable="false" - > - <i - class="fas fa-search flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> - <a - href="/{{ .Lang }}/map" - id="sidebar-map-button" - class="themed-button themed-button-sidebar w-fit h-fit hidden" - draggable="false" - > - <i - class="fas fa-map flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> - <div - id="toolbar-theme-button" - onclick="toggleThemeWheel()" - class="themed-button themed-button-sidebar w-fit h-fit" - draggable="false" - > - <i - id="toolbar-theme-button-content" - class="fas fa-swatchbook flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </div> - <a - onclick="return changeUrl('/{{ .Lang }}/user');" - href="/{{ .Lang }}/user" - id="sidebar-user-button" - class="themed-button themed-button-sidebar w-fit h-fit hidden" - draggable="false" - > - <i - class="fas fa-user flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> - </nav> + <svg viewBox="0 0 24 24"><use href="#icon-back"/></svg> + </a> + <a + class="w-18 h-18 rounded-xl m-3 accent-button" + onclick="return changeUrl('/{{ .Lang }}');" + href="/{{ .Lang }}" + id="sidebar-home-button" + draggable="false" + > + <svg viewBox="0 0 24 24"><use href="#icon-logo"/></svg> + </a> + <a + class="w-18 h-18 rounded-xl m-3 accent-button" + onclick="return changeUrl('/{{ .Lang }}/blog');" + href="/{{ .Lang }}/blog" + id="sidebar-blog-button" + draggable="false" + > + <svg viewBox="0 0 24 24"><use href="#icon-newspaper"/></svg> + </a> + <a + class="w-18 h-18 rounded-xl m-3 accent-button" + href="/{{ .Lang }}/map" + id="sidebar-map-button" + draggable="false" + > + <svg viewBox="0 0 24 24"><use href="#icon-map"/></svg> + </a> + <div + class="w-18 h-18 rounded-xl m-3 accent-button" + onclick="toggleThemeWheel()" + id="sidebar-theme-button" + draggable="false" + > + <svg class="sidebar-theme-button-content" viewBox="0 0 24 24"><use href="#icon-palette"/></svg> + </div> + <a + class="w-18 h-18 rounded-xl m-3 accent-button" + onclick="return changeUrl('/{{ .Lang }}/user');" + href="/{{ .Lang }}/user" + id="sidebar-user-button" + draggable="false" + > + <svg viewBox="0 0 24 24"><use href="#icon-account"/></svg> + </a> <div class="theme-wheel" id="theme-wheel"> <div class="theme-icon" data-theme="olive"></div> <div class="theme-icon" data-theme="lettuce"></div> @@ -388,6 +410,11 @@ ); function updateSidebar() { + sidebarHomeButton.classList.remove("active"); + sidebarMapButton.classList.remove("active"); + sidebarBlogButton.classList.remove("active"); + sidebarBackButton.classList.remove("active"); + sidebarUserButton.classList.remove("active"); if ( location.pathname == "" || location.pathname == "/" @@ -409,6 +436,9 @@ "onclick", `return changeUrl('/${lang}', false);`, ); + if (location.pathname == `/${lang}`) { + sidebarHomeButton.classList.add("active"); + } sidebarMapButton.setAttribute( "href", `/${lang}/map`, @@ -421,6 +451,9 @@ "onclick", `return changeUrl('/${lang}/blog', false);`, ); + if (location.pathname.startsWith(`/${lang}/blog`)) { + sidebarBlogButton.classList.add("active"); + } sidebarUserButton.setAttribute( "href", `/${lang}/user`, @@ -429,6 +462,9 @@ "onclick", `return changeUrl('/${lang}/user', false);`, ); + if (location.pathname.startsWith(`/${lang}/user`)) { + sidebarUserButton.classList.add("active"); + } } } window.addEventListener("popstate", updateSidebar); @@ -436,21 +472,21 @@ once: true, }); </script> - </div> + </nav> <div - class="bg-paper bg-background-dark @container/main flex z-10 w-dvw xs:w-[90dvw] sm:w-[85dvw] md:w-[80dvw] lg:w-[75dvw] xl:w-[70dvw] 2xl:w-[60dvw] 3xl:w-[50dvw] grow-0 h-[calc(100dvh-5rem)] sm:h-dvh shadow-[0_0_1rem_black]" + class="flex flex-1 z-1 bg-paper bg-background shadow-elevation-3 @container/body" > <div class="bg-paper bg-background-dark border-r-2 border-dashed border-main-hard" ></div> <div - class="max-h-full max-w-full flex flex-col grow bg-paper bg-background-dark relative pt-4 ml-8 pr-4" + class="max-h-full max-w-full flex flex-col grow bg-paper bg-background-dark relative pt-4 pr-0 md:pr-4" > <header id="general-page-header" - class="max-xs:hidden [@media(max-height:32rem)]:hidden flex flex-col basis-8" + class="max-xs:hidden [@media(max-height:32rem)]:hidden flex flex-col ml-8 basis-8" hx-get="/api/v1/general-page/header{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="load" hx-target="this" @@ -506,7 +542,7 @@ </div> <div - class="pr-[0.5dvw] bg-paper bg-background-dark shadow-2xl border-l-2 border-dotted border-main-hard" + class="bg-paper bg-background-dark shadow-2xl border-l-2 border-dotted border-main-hard" ></div> </div> </div> @@ -574,9 +610,8 @@ <script> const themeWheel = document.getElementById("theme-wheel"); - const themeButton = document.getElementById("toolbar-theme-button"); + const themeButton = document.getElementById("sidebar-theme-button"); const themeIcons = document.querySelectorAll(".theme-icon"); - const themeWheelRadius = convertRemToPixels(6); themeIcons.forEach((icon) => { if (icon.getAttribute("data-theme") == savedTheme) { @@ -605,7 +640,7 @@ const clipPath = createSliceClipPath( startAngle, endAngle, - themeWheelRadius, + convertRemToPixels(6), ); icon.style.clipPath = clipPath; }); @@ -640,6 +675,7 @@ const buttonRect = themeButton.getBoundingClientRect(); const buttonCenterX = buttonRect.left + buttonRect.width / 2; const buttonCenterY = buttonRect.top + buttonRect.height / 2; + const themeWheelRadius = convertRemToPixels(6); const margin = 0; @@ -707,7 +743,7 @@ if ( !themeWheel.contains(e.target) && e.target !== themeButton && - !e.target.classList.contains("toolbar-theme-button-content") + !e.target.classList.contains("sidebar-theme-button-content") ) { hideThemeWheel(); } diff --git a/views/pages/global-map.html b/views/pages/global-map.html index ce9d5b1..248d0b9 100644 --- a/views/pages/global-map.html +++ b/views/pages/global-map.html @@ -20,18 +20,6 @@ rel="stylesheet" href="{{ .StaticStorageBaseUrl }}/fonts/fonts.css" /> - <link - rel="stylesheet" - href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/fontawesome.min.css" - /> - <link - rel="stylesheet" - href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/brands.min.css" - /> - <link - rel="stylesheet" - href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/solid.min.css" - /> {{ block "header" . }}{{ end }} <link rel="stylesheet" href="/output.css" /> <link @@ -64,6 +52,56 @@ data-theme="ram" class="font-m-plus text-main-hard overflow-hidden bg-interlocked-hexagons h-dvh" > + <!-- Streamline Icons: https://streamlinehq.com --> + <svg xmlns="http://www.w3.org/2000/svg" style="display:none" aria-hidden="true"> + <symbol id="icon-back" viewBox="-4 -4 32 32"><g> + <path d="M23.9 10.45a12.31 12.31 0 0 0 -1.15 -3.61 9.12 9.12 0 0 0 -2.29 -3A13 13 0 0 0 19 2.88c-0.81 -0.48 -1.73 -1 -2.2 -1.18a0.34 0.34 0 0 0 -0.29 0.62c0.39 0.18 1.09 0.56 1.77 1A14.8 14.8 0 0 1 20 4.38a8.27 8.27 0 0 1 2 2.81 11.57 11.57 0 0 1 1 3.37 9.88 9.88 0 0 1 -4.18 9 11.15 11.15 0 0 1 -9.82 2 20.19 20.19 0 0 1 -2 -0.68A13.23 13.23 0 0 1 5.2 20a8.59 8.59 0 0 1 -3.7 -4.66 8.84 8.84 0 0 1 0.08 -6A12.88 12.88 0 0 1 6 3.31a10.45 10.45 0 0 1 7.24 -1.72 0.3 0.3 0 0 0 0.06 -0.6 11.16 11.16 0 0 0 -7.69 1.69A13.82 13.82 0 0 0 0.71 9a9.81 9.81 0 0 0 -0.23 6.69A9.63 9.63 0 0 0 4.62 21a14.35 14.35 0 0 0 2 1 21.55 21.55 0 0 0 2.09 0.72 12.23 12.23 0 0 0 10.78 -2.27 10.81 10.81 0 0 0 4.41 -10Z" fill="var(--color-accent-deep)" stroke-width="1"></path> + <path d="M18.68 13.8a0.29 0.29 0 0 0 0.36 -0.22 7.5 7.5 0 0 0 -0.4 -4.82 0.6 0.6 0 0 0 -0.44 -0.3 4.51 4.51 0 0 0 -0.95 0c-0.46 0 -3.32 0.39 -5.08 0.58l-0.68 0.07 0 -0.67a18.15 18.15 0 0 0 -0.16 -2.34 1.16 1.16 0 0 0 -0.15 -0.42 0.57 0.57 0 0 0 -0.46 -0.25 2.88 2.88 0 0 0 -1.27 0.41A17.24 17.24 0 0 0 6 8.49a10.89 10.89 0 0 0 -1.68 2 2.28 2.28 0 0 0 -0.41 1.33A5.09 5.09 0 0 0 5.28 14a32.9 32.9 0 0 0 4 3.68 10.06 10.06 0 0 0 1.07 0.5 0.63 0.63 0 0 0 0.55 -0.06 2 2 0 0 0 0.42 -1c0.14 -0.82 0.23 -2.12 0.28 -2.72l0.31 0c1.43 0.11 4.57 0.35 5.94 0.4a5.59 5.59 0 0 0 0.64 0 0.48 0.48 0 0 0 0.29 -0.13 0.34 0.34 0 0 0 -0.36 -0.55c0 -0.08 -0.29 0 -0.54 0 -1.36 -0.08 -4.48 -0.4 -5.9 -0.55l-0.65 -0.07a0.51 0.51 0 0 0 -0.52 0.27 34 34 0 0 1 -0.49 3.45c-0.22 -0.13 -0.49 -0.35 -0.56 -0.4a34.25 34.25 0 0 1 -3.12 -3 13.83 13.83 0 0 1 -1.29 -1.54 1.39 1.39 0 0 1 -0.35 -0.55 1.61 1.61 0 0 1 0.39 -0.84 13 13 0 0 1 2 -2.17A16.1 16.1 0 0 1 9.8 6.91l0.54 -0.3a16.11 16.11 0 0 1 0.15 1.8l0 1.19a0.5 0.5 0 0 0 0.5 0.5c0.23 0 0.71 -0.06 1.32 -0.15 1.72 -0.25 4.5 -0.74 5 -0.74 0.15 0 0.65 0.14 0.79 0a6.76 6.76 0 0 1 0.54 2 6.61 6.61 0 0 1 -0.12 2.23 0.3 0.3 0 0 0 0.16 0.36Zm-8.07 3.46c0 0.07 -0.1 0.06 -0.2 0 0.1 -0.04 0.24 -0.11 0.2 0ZM10.26 6.2l0 0.08v0.08c-0.07 -0.06 -0.13 -0.12 0 -0.16Z" fill="var(--color-main)" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-logo" role="img" viewBox="-20 -20 160 160"> + <defs> + <linearGradient gradientTransform="rotate(150, 0.5, 0.5)" x1="50%" y1="0%" x2="50%" y2="100%" id="gradient"> + <stop stop-color="var(--color-accent-deep)" stop-opacity="1" offset="0%"></stop><stop stop-color="var(--color-main)" stop-opacity="1" offset="100%"></stop> + </linearGradient> + </defs> + <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" stroke-width="5"></path> + </symbol> + <symbol id="icon-newspaper" viewBox="-4 -4 32 32"><g> + <path d="M13.3 5.15c-1.68 -0.31 -9.3 -1.08 -9.61 0.47 -0.58 2.8 -0.8 3.4 -0.8 3.76 0 0.87 1.94 1 2.81 1.14s1.94 0.29 2.92 0.4a11.4 11.4 0 0 0 3.85 -0.28c0.29 0 0.68 0 0.9 -0.34a2.66 2.66 0 0 0 0.15 -1.3c0.34 -2.77 0.4 -3 0.3 -3.34a0.67 0.67 0 0 0 -0.52 -0.51Zm-1 4.36 -1.7 0.28a30.3 30.3 0 0 1 -4.81 -0.23 6.67 6.67 0 0 1 -2 -0.28c0 -0.19 -0.09 0.74 0.29 -2.08 0 0 0.36 -1.37 0.36 -1.45 0.15 0.37 5 -0.24 7.2 0.14q0.55 0.09 1.08 0.21l0 0.46c-0.52 3.63 -0.44 2.72 -0.45 2.95Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M17.54 7a0.34 0.34 0 0 0 0.46 -0.17c0.58 -0.9 -1.81 -1.11 -3.24 -0.87a0.35 0.35 0 0 0 -0.37 0.32c-0.04 0.72 2.45 0.41 3.15 0.72Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M14.44 9.13a5 5 0 0 0 3.08 0.48c0.43 0.14 1.06 -0.56 0.19 -0.86a3.36 3.36 0 0 0 -0.6 -0.09c-0.96 -0.15 -3.11 -0.4 -2.67 0.47Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M7.78 12.72c-4.92 -0.13 -4.67 -0.09 -4.8 0.13a0.28 0.28 0 0 0 0.15 0.42c0.16 0.09 0.06 0.05 4.61 0.52a73.45 73.45 0 0 0 9.5 0 0.34 0.34 0 0 0 0 -0.68c-2.38 0 -3 -0.23 -9.46 -0.39Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M16.68 16.61c-5.44 -0.27 -3.68 -0.55 -8.64 -0.47 -0.89 0 -1.78 0.05 -2.67 0 -0.35 0 -2.17 -0.26 -2.3 -0.23a0.32 0.32 0 0 0 0 0.61c0.1 0 -0.16 0 2.25 0.44a77.28 77.28 0 0 0 7.73 0.39l1.13 0c4.08 0.01 3.37 -0.77 2.5 -0.74Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M24 10.27c-0.13 -3.52 -0.05 -2.5 -0.14 -4.86a0.44 0.44 0 0 0 -0.76 -0.28 2.72 2.72 0 0 1 -2.33 1.25 21.46 21.46 0 0 0 0.56 -2.94 0.88 0.88 0 0 0 -0.22 -0.6c-0.31 -0.3 -3 -0.21 -3.48 -0.2 -3.05 0.09 -5.71 -0.27 -9.06 -0.2 -4.62 0.1 -5.83 -0.73 -5.47 0.2a0.45 0.45 0 0 0 0.3 0.24 33.56 33.56 0 0 0 5.17 0.37c4.41 0.09 4.28 0.53 11.32 0.53l0.17 0c0 1.27 -1 3.8 -1 8.45 0 1.64 0.13 6.24 0.85 7.56a2.26 2.26 0 0 0 0.4 0.51c-3.31 1.08 -15.91 0.5 -17.78 -0.21 -0.32 -0.12 -0.77 -0.16 -0.9 -0.36 -1.17 -1.73 0.06 -9.79 0.28 -11.81a27.82 27.82 0 0 1 0.67 -3.53A7.91 7.91 0 0 0 3 2.69a0.31 0.31 0 0 0 -0.58 0c0.09 -0.1 -0.89 2.79 -1.25 5.18C0.72 10.49 -0.86 18.1 0.61 20.33c0.4 0.61 1 0.63 1.45 0.81a11.09 11.09 0 0 0 3.14 0.51c2.08 0.13 15.3 0.61 16.69 -1.21 2.16 -2.82 2.2 -6.66 2.11 -10.17ZM21.3 20a1 1 0 0 1 -0.8 -0.58c-0.61 -1.2 -0.59 -5.82 -0.53 -7.19A33.39 33.39 0 0 1 20.61 7a3.11 3.11 0 0 0 1.24 -0.07 3.52 3.52 0 0 0 1.09 -0.52C22.61 13 23.52 16.56 21.3 20Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M21.43 8.91c-0.57 -0.41 -0.55 1 -0.68 2.15a19.8 19.8 0 0 0 0.06 4.15 0.34 0.34 0 0 0 0.68 0 20.13 20.13 0 0 0 0.31 -4.15c-0.28 -2.29 -0.19 -2.06 -0.37 -2.15Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-map" viewBox="-4 -4 32 32"><g> + <path d="M18.47 13.42a0.31 0.31 0 0 0 0.41 0.11 0.29 0.29 0 0 0 0.11 -0.41C18 11.2 16.38 9.18 15.71 7A5.35 5.35 0 0 1 16 2.86a3.54 3.54 0 0 1 2.4 -1.53 4.18 4.18 0 0 1 2.93 0.18 3.19 3.19 0 0 1 1.16 1.2A3.59 3.59 0 0 1 23 4.34a6.78 6.78 0 0 1 -0.53 2.76 34 34 0 0 1 -2.1 4l-1.11 1.62a0.35 0.35 0 0 0 0.1 0.48 0.34 0.34 0 0 0 0.47 -0.09L21 11.45a33.28 33.28 0 0 0 2.3 -4 7.51 7.51 0 0 0 0.7 -3.14 4.62 4.62 0 0 0 -0.6 -2.14A4.23 4.23 0 0 0 21.86 0.52 5.38 5.38 0 0 0 18.08 0.2 4.66 4.66 0 0 0 15 2.38a6.25 6.25 0 0 0 -0.12 4.94c0.74 2.18 2.44 4.18 3.59 6.1Z" fill="var(--color-main)" stroke-width="1"></path> + <path d="M18.36 6.15C21 7 21 4.49 20 3.73c-1.39 -1.32 -3.48 1.84 -1.64 2.42Z" fill="var(--color-main)" stroke-width="1"></path> + <path d="M8.79 9a1.43 1.43 0 0 1 -0.37 0.77c-0.31 0.31 -0.89 0.45 -1.26 0.74a1.36 1.36 0 0 0 -0.49 0.85 3.43 3.43 0 0 0 0.21 1.58 8 8 0 0 1 0.55 1.79 1 1 0 0 1 -0.3 0.86 1.51 1.51 0 0 1 -0.65 0.35 1.9 1.9 0 0 1 -0.81 0.08 8.41 8.41 0 0 0 -1.15 -0.14 1.73 1.73 0 0 0 -0.94 0.23 1.93 1.93 0 0 0 -0.67 0.8c-0.15 0.31 -0.28 0.67 -0.44 1s0 1.08 0.51 0.57a2.55 2.55 0 0 0 0.51 -0.86 1.53 1.53 0 0 1 0.51 -0.76 0.87 0.87 0 0 1 0.48 -0.06 6.7 6.7 0 0 1 1 0.21 3.13 3.13 0 0 0 1.25 0 2.54 2.54 0 0 0 1.18 -0.59 2.11 2.11 0 0 0 0.66 -1.77 6.48 6.48 0 0 0 -0.53 -1.77 3.24 3.24 0 0 1 -0.37 -1.37 0.52 0.52 0 0 1 0.24 -0.34A6.52 6.52 0 0 0 9 10.31a2.07 2.07 0 0 0 0.48 -1.25 4.3 4.3 0 0 0 -0.07 -1c-0.26 -0.34 -0.71 -0.22 -0.63 0.07a2.49 2.49 0 0 1 0.01 0.87Z" fill="var(--color-accent-deep)" stroke-width="1"></path> + <path d="m23.83 20.17 -0.44 -2.79 -0.67 -5.76a0.3 0.3 0 0 0 -0.6 0.08l0.54 5.77 0.34 2.77c0 0.17 0.06 0.38 0.08 0.58a0.5 0.5 0 0 1 0 0.18 0.63 0.63 0 0 1 -0.26 0.22c-0.16 0.09 -0.34 0.15 -0.49 0.22 -0.33 0.13 -0.67 0.25 -1 0.36 -0.52 0.16 -1 0.28 -1.58 0.41 -0.84 0.2 -1.7 0.45 -2.57 0.61a7.67 7.67 0 0 1 -1.65 0.14 4.8 4.8 0 0 1 -1.13 -0.21c-0.39 -0.11 -4.47 -1.38 -6 -1.81a8.17 8.17 0 0 0 -2.35 -0.33 10.19 10.19 0 0 0 -2.33 0.32 5.3 5.3 0 0 0 -1.21 0.27l0 -0.21c0 -0.22 0 -0.45 -0.06 -0.67 0 -0.47 -0.28 -2.86 -0.33 -3.26 -0.3 -2.29 -0.7 -4.78 -0.88 -7.09l-0.08 -1.36A9.09 9.09 0 0 1 1 7.34 0.4 0.4 0 0 1 1.14 7a2.44 2.44 0 0 1 1.07 -0.33 12.47 12.47 0 0 1 1.94 0A12.63 12.63 0 0 1 6 6.88a14.23 14.23 0 0 1 1.81 0.49c0.24 0.08 2.74 0.92 3.32 1.09a22.06 22.06 0 0 0 2.3 0.6 0.35 0.35 0 1 0 0.12 -0.68 20.56 20.56 0 0 1 -2.2 -0.61c-1.28 -0.42 -2.6 -0.91 -3.28 -1.15a15.84 15.84 0 0 0 -1.9 -0.55 13.16 13.16 0 0 0 -2 -0.28 12.94 12.94 0 0 0 -2.08 0 3.2 3.2 0 0 0 -1.47 0.44A1.27 1.27 0 0 0 0 7a5.65 5.65 0 0 0 0.19 1.71L0.22 10c0.15 2.33 0.63 4.62 0.9 6.93 0.07 0.57 0.13 1.13 0.16 1.7s0 1.12 0 1.69a7 7 0 0 0 0.07 0.79 3.24 3.24 0 0 0 0.16 0.8 1.51 1.51 0 0 0 0.27 0.42 0.76 0.76 0 0 0 0.63 0.22A11.69 11.69 0 0 0 4 22.06a8.45 8.45 0 0 1 2.06 -0.29 7 7 0 0 1 2 0.28l4.16 1.13c0.62 0.2 1.22 0.43 1.84 0.6a5.67 5.67 0 0 0 1.37 0.21 8 8 0 0 0 1.88 -0.19c0.89 -0.18 1.76 -0.47 2.6 -0.69 0.56 -0.14 1.1 -0.29 1.63 -0.47 0.37 -0.12 0.73 -0.26 1.08 -0.41a4.65 4.65 0 0 0 0.7 -0.36 1.35 1.35 0 0 0 0.45 -0.5 1 1 0 0 0 0.1 -0.47 6.79 6.79 0 0 0 -0.04 -0.73Z" fill="var(--color-main)" stroke-width="1"></path> + <path d="M13.27 21.36a3 3 0 0 0 -0.93 -2 8.73 8.73 0 0 1 -0.87 -0.85 0.56 0.56 0 0 1 -0.11 -0.62 1.94 1.94 0 0 1 0.76 -0.83 3 3 0 0 1 1.12 -0.51 8.59 8.59 0 0 0 2.07 -0.43 1.88 1.88 0 0 0 1 -1.23l0.12 -0.7a0.3 0.3 0 0 0 -0.29 -0.32 0.29 0.29 0 0 0 -0.31 0.29l-0.15 0.5a1.21 1.21 0 0 1 -0.71 0.71 7.5 7.5 0 0 1 -1.89 0.14 4 4 0 0 0 -1.62 0.59 3 3 0 0 0 -1.19 1.35 1.56 1.56 0 0 0 0.12 1.5 6.3 6.3 0 0 0 1.26 1.15 2.41 2.41 0 0 1 0.8 1.19 0.92 0.92 0 0 1 0 0.52c0 0.33 0.6 0.64 0.75 0.14a1.84 1.84 0 0 0 0.07 -0.59Z" fill="var(--color-accent-deep)" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-palette" viewBox="-4 -4 32 32"><g> + <path d="M10 19.26a0.32 0.32 0 0 0 0 0.59 5.85 5.85 0 0 0 1.62 0.42 1 1 0 0 0 0.93 -0.34 5.08 5.08 0 0 0 0.63 -1.35c0.33 -1 0.46 -2.23 0.71 -3.15 0.09 -0.34 0.2 -0.67 0.32 -1 0.28 -0.79 0.61 -1.56 0.88 -2.36 0.14 -0.4 0.27 -0.81 0.39 -1.22 0.27 -0.94 0.5 -1.9 0.78 -2.84 0.2 -0.69 0.43 -1.39 0.62 -2.1a12.59 12.59 0 0 0 0.32 -1.48 8.09 8.09 0 0 0 0.16 -1 0.83 0.83 0 0 0 -0.19 -0.58 1.68 1.68 0 0 0 -0.64 -0.41 7.51 7.51 0 0 0 -1.33 -0.37l-4.3 -0.78c-0.4 -0.1 -0.73 0.1 -0.95 0.57 -0.33 0.7 -0.42 2.14 -0.77 2.79a0.3 0.3 0 0 0 0.11 0.39 0.28 0.28 0 0 0 0.42 -0.04 18.6 18.6 0 0 0 0.77 -2.47 1.87 1.87 0 0 1 0.19 -0.4s0 -0.07 0.08 -0.06L15 3a4.45 4.45 0 0 1 1.41 0.53 5.74 5.74 0 0 1 -0.24 0.71 12.78 12.78 0 0 1 -0.32 1.36c-0.2 0.7 -0.43 1.4 -0.63 2.09l-1.1 4c-0.24 0.81 -0.54 1.58 -0.79 2.38 -0.11 0.35 -0.21 0.7 -0.3 1.07 -0.21 0.92 -0.3 2.11 -0.58 3.15a4.64 4.64 0 0 1 -0.45 1.23s-0.08 0 -0.13 0a1.89 1.89 0 0 1 -0.57 0 6.94 6.94 0 0 1 -1 -0.28 0.33 0.33 0 0 0 -0.24 0 4 4 0 0 0 0.83 -0.27 1.74 1.74 0 0 0 0.68 -0.57 0.83 0.83 0 0 0 0.14 -0.54 5.77 5.77 0 0 0 -0.17 -0.79l-0.59 -2.83c-0.22 -1.19 -0.48 -2.38 -0.76 -3.56 -0.43 -1.77 -0.91 -3.53 -1.37 -5.27A24.28 24.28 0 0 0 8 2.73 5.29 5.29 0 0 0 6.85 1a0.74 0.74 0 0 0 -0.54 -0.17 3.48 3.48 0 0 0 -0.67 0.17l-2.21 0.66A10.36 10.36 0 0 0 0.91 2.77 1.91 1.91 0 0 0 0 4a2.51 2.51 0 0 0 0.08 1c0.14 0.61 0.44 1.28 0.58 1.73L2.17 12l2.27 8a0.27 0.27 0 0 0 0.35 0.2 0.29 0.29 0 0 0 0.2 -0.35l-2 -8.1 -1.37 -5.36c-0.1 -0.38 -0.32 -0.94 -0.46 -1.47a1.93 1.93 0 0 1 -0.1 -0.79c0 -0.27 0.38 -0.45 0.74 -0.65a9.89 9.89 0 0 1 2 -0.78L6 2l0.24 0a4.41 4.41 0 0 1 0.7 1.2 21 21 0 0 1 0.8 2.55c0.49 1.72 1 3.46 1.46 5.21 0.31 1.16 0.6 2.33 0.84 3.49l0.66 2.86 0.18 0.71a1 1 0 0 1 -0.39 0.32 3.81 3.81 0 0 1 -0.91 0.32l-3.64 0.93a0.33 0.33 0 0 0 -0.24 0.39 0.32 0.32 0 0 0 0.39 0.25l3.67 -0.86a2 2 0 0 0 0.24 -0.11Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M23.73 9.93a7.66 7.66 0 0 0 -0.8 -0.88 13.75 13.75 0 0 0 -1.45 -1.31c-0.77 -0.63 -1.61 -1.25 -2.23 -1.75a0.58 0.58 0 0 0 -0.68 0.11c-0.37 0.29 -1.05 1 -1.5 1.41l-0.18 0.19 -0.08 0 -0.07 0a0.25 0.25 0 0 0 -0.17 0.1 0.27 0.27 0 0 0 0 0.4c0.07 0.07 0.32 0.12 0.62 -0.1s1.09 -1 1.55 -1.34l0.26 -0.1c0.57 0.5 1.3 1.11 2 1.71a15.9 15.9 0 0 1 1.3 1.3c0.15 0.17 1.1 0.88 0.77 1a1.06 1.06 0 0 1 -0.23 0.41c-0.15 0.2 -0.34 0.39 -0.47 0.54s-0.49 0.51 -0.74 0.76c-0.61 0.6 -1.25 1.17 -1.86 1.77 -1.47 1.51 -2.86 3.12 -4.32 4.65 -0.62 0.65 -1.24 1.29 -1.9 1.9 -0.33 0.3 -0.65 0.6 -1 0.88s-0.45 0.37 -0.68 0.54 -0.46 0.2 -0.42 0.33a1.38 1.38 0 0 1 -0.74 -0.32 7.64 7.64 0 0 1 -1.13 -1.17 0.33 0.33 0 0 0 -0.51 0.41 8.44 8.44 0 0 0 1.21 1.32 2 2 0 0 0 1.27 0.51 0.62 0.62 0 0 0 0.31 -0.1c0.15 -0.09 0.36 -0.28 0.45 -0.34 0.26 -0.18 0.51 -0.36 0.75 -0.55s0.7 -0.57 1.05 -0.86c0.7 -0.6 1.37 -1.22 2 -1.87 1.46 -1.48 2.89 -3.1 4.37 -4.58 0.6 -0.61 1.24 -1.17 1.84 -1.78 0.27 -0.27 0.53 -0.54 0.78 -0.83a5.83 5.83 0 0 0 0.71 -1 1.66 1.66 0 0 0 0.19 -0.65 1.3 1.3 0 0 0 -0.27 -0.71Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="m16.85 7.71 -0.09 0h0.05Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M14.33 8.68a5.87 5.87 0 0 0 0.29 -0.75 11.92 11.92 0 0 0 0.62 -1.7 3.66 3.66 0 0 0 0.08 -1.38 0.61 0.61 0 0 0 -0.38 -0.43 4.9 4.9 0 0 0 -0.51 -0.12L12.84 4l-1.31 -0.29 -0.36 0a0.45 0.45 0 0 0 -0.47 0.28l-0.33 1.81a0.28 0.28 0 0 0 0.22 0.34 0.29 0.29 0 0 0 0.34 -0.22l0.41 -1.42 1.22 0.42 1.58 0.43h0.1a3.68 3.68 0 0 1 -0.09 0.63 12.53 12.53 0 0 1 -0.49 1.59s0 0.17 0 0.32c-0.18 -0.07 -0.43 -0.09 -0.51 -0.12 -0.37 -0.13 -0.74 -0.25 -1.12 -0.36l-1.13 -0.29a0.32 0.32 0 0 0 -0.4 0.22 0.32 0.32 0 0 0 0.22 0.4c0.36 0.12 0.72 0.24 1.07 0.38l1 0.43c0.13 0.06 0.47 0.29 0.71 0.38A0.86 0.86 0 0 0 14 9a0.57 0.57 0 0 0 0.33 -0.32Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M12.42 12.21s-0.07 0.14 -0.12 0.27l-0.71 -0.21a0.33 0.33 0 0 0 -0.4 0.24 0.32 0.32 0 0 0 0.24 0.39c0.27 0.1 0.57 0.31 0.86 0.44l0.31 0.1a0.55 0.55 0 0 0 0.49 -0.34c0.07 -0.15 0.23 -0.55 0.25 -0.59a11.17 11.17 0 0 0 0.49 -1.3 2.71 2.71 0 0 0 0.09 -1.11 0.59 0.59 0 0 0 -0.34 -0.44 4.71 4.71 0 0 0 -0.66 -0.13l-2 -0.19a0.28 0.28 0 0 0 -0.32 0.25 0.29 0.29 0 0 0 0.24 0.32l1.89 0.57 0.15 0c0 0.14 -0.06 0.29 -0.09 0.44 -0.12 0.47 -0.27 0.93 -0.37 1.29Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="m18.71 12.05 -0.09 0.15a2.08 2.08 0 0 0 -0.19 -0.23l-1.57 -1.45a0.33 0.33 0 0 0 -0.46 0.46l1.41 1.67a5.31 5.31 0 0 0 0.38 0.46 0.67 0.67 0 0 0 0.35 0.2 0.6 0.6 0 0 0 0.43 -0.09 5.42 5.42 0 0 0 0.43 -0.34c0.22 -0.18 0.43 -0.36 0.64 -0.56s0.38 -0.4 0.57 -0.61c0 0 0.31 -0.37 0.39 -0.51a0.57 0.57 0 0 0 -0.05 -0.72c-0.44 -0.36 -0.86 -0.72 -1.27 -1.1s-0.54 -0.51 -0.81 -0.78a0.29 0.29 0 0 0 -0.4 0 0.3 0.3 0 0 0 0 0.41c0.28 0.4 0.57 0.77 0.88 1.15s0.42 0.51 0.64 0.76l-0.15 0.1Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M15.08 15.8a0.33 0.33 0 0 0 0.41 0.52c2.89 -1.7 2.2 -1.19 2.45 -1.42a0.59 0.59 0 0 0 0.19 -0.34 0.57 0.57 0 0 0 -0.13 -0.46 6.23 6.23 0 0 0 -0.56 -0.6A16.32 16.32 0 0 0 16 12.36a0.3 0.3 0 0 0 -0.41 0 0.29 0.29 0 0 0 0 0.41l1.21 1.54 -0.27 0.21Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M4.42 15.19a0.43 0.43 0 0 0 0.34 0.32 1.3 1.3 0 0 0 0.44 0c0.26 0 0.54 -0.14 0.75 -0.18 0.43 -0.11 0.88 -0.17 1.32 -0.27a5.69 5.69 0 0 0 0.59 -0.16 7.54 7.54 0 0 0 0.81 -0.27 0.66 0.66 0 0 0 0.33 -0.52 2.87 2.87 0 0 0 0 -0.76c-0.1 -0.49 -0.54 -1.9 -0.67 -2.31a4.6 4.6 0 0 0 -0.23 -0.63 0.57 0.57 0 0 0 -0.26 -0.26 1 1 0 0 0 -0.56 0 6.66 6.66 0 0 0 -0.8 0.28c-2.84 1.09 -2.89 0.66 -2.81 1.08l0.65 3.09s0.05 0.4 0.1 0.59Zm2.26 -3.95c0.13 0 0.33 -0.11 0.53 -0.16l0.07 0a3 3 0 0 0 0.12 0.3c0.09 0.33 0.46 1.65 0.55 2.05a2.79 2.79 0 0 1 0.07 0.38 3.67 3.67 0 0 1 -0.45 0.06l-1.85 0.54 -0.61 0.2c-0.05 -0.11 -0.12 -0.22 -0.12 -0.24l-0.67 -2.43Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M2.88 8.84a0.44 0.44 0 0 0 0.34 0.33 1.15 1.15 0 0 0 0.45 0A6.18 6.18 0 0 0 4.41 9c0.44 -0.1 0.88 -0.16 1.32 -0.26 0.2 -0.05 0.4 -0.1 0.6 -0.17 0 0 0.6 -0.17 0.81 -0.27a0.62 0.62 0 0 0 0.36 -0.52A2.88 2.88 0 0 0 7.44 7c-0.11 -0.48 -0.55 -1.9 -0.68 -2.3a6.1 6.1 0 0 0 -0.22 -0.63 0.57 0.57 0 0 0 -0.27 -0.27 1 1 0 0 0 -0.56 0 5.82 5.82 0 0 0 -0.79 0.29C2.08 5.14 2 4.71 2.1 5.14l0.65 3.09s0.08 0.46 0.13 0.61Zm2.26 -3.95 0.53 -0.15 0.07 0c0 0.12 0.11 0.25 0.12 0.29 0.09 0.33 0.46 1.65 0.55 2.05a2.66 2.66 0 0 1 0.07 0.39c-0.19 0 -0.42 0 -0.45 0.06L4.19 8l-0.62 0.2c0 -0.11 -0.12 -0.22 -0.12 -0.23l-0.67 -2.39Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-account" viewBox="-4 -4 32 32"><g> + <path d="M18.33 20a0.35 0.35 0 0 0 0.35 -0.34 10.26 10.26 0 0 0 -0.22 -2.9 8.42 8.42 0 0 0 -0.36 -1.21 7.92 7.92 0 0 0 -0.54 -1.14 6 6 0 0 0 -1.92 -2 4.54 4.54 0 0 0 1.53 -3.5 7.58 7.58 0 0 0 -0.23 -2.56 4.49 4.49 0 0 0 -0.88 -1.53 0.34 0.34 0 0 0 -0.49 0 0.35 0.35 0 0 0 -0.05 0.49 3.53 3.53 0 0 1 0.77 1.67 7.89 7.89 0 0 1 0 1.95 3.63 3.63 0 0 1 -2.71 3.47A5.37 5.37 0 0 1 9 11.54a2.77 2.77 0 0 1 -0.92 -1.41 4.19 4.19 0 0 1 -0.19 -1.8 5.55 5.55 0 0 1 0.86 -2.46 3.65 3.65 0 0 1 2 -1.5 7.27 7.27 0 0 1 1.94 -0.31 4.75 4.75 0 0 1 1.89 0.35 0.3 0.3 0 0 0 0.25 -0.55 5.19 5.19 0 0 0 -2.13 -0.51 8.53 8.53 0 0 0 -2.16 0.23A4.58 4.58 0 0 0 8 5.3a6.6 6.6 0 0 0 -1.18 2.86A5.17 5.17 0 0 0 7 10.48a3.85 3.85 0 0 0 1.34 2l0.22 0.14a6.23 6.23 0 0 0 -2.34 1.88 6 6 0 0 0 -0.94 1.8 7.45 7.45 0 0 0 -0.33 2 12.07 12.07 0 0 0 -0.08 1.48 1.82 1.82 0 0 0 0.17 0.76 0.32 0.32 0 0 0 0.42 0.13 0.31 0.31 0 0 0 0.13 -0.42 1.25 1.25 0 0 1 0 -0.64c0.07 -0.45 0.22 -0.93 0.28 -1.2a8.28 8.28 0 0 1 0.5 -1.69 7.87 7.87 0 0 1 0.78 -1.53A6.48 6.48 0 0 1 9.4 13.1a6.41 6.41 0 0 0 4.53 0.29 5.19 5.19 0 0 0 1.21 -0.58 6.56 6.56 0 0 1 1.59 2.5c0.24 0.55 0.46 1.12 0.65 1.69a11.51 11.51 0 0 1 0.62 2.67 0.35 0.35 0 0 0 0.33 0.33Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M0.24 6.28a0.5 0.5 0 0 0 0 0.14 0.29 0.29 0 0 0 0.31 0.18c0.38 -0.06 0.26 -0.41 0.27 -0.82a29.28 29.28 0 0 1 0.3 -3.08 4.73 4.73 0 0 1 0.24 -1.14 0.48 0.48 0 0 1 0.3 -0.28 8.85 8.85 0 0 1 1.25 -0.16A7.63 7.63 0 0 1 3.86 1l2.36 0a0.35 0.35 0 0 0 0.35 -0.33 0.35 0.35 0 0 0 -0.35 -0.35C5.43 0.28 4.66 0.13 3.87 0.08A6.36 6.36 0 0 0 2.8 0.07a7.65 7.65 0 0 0 -1.49 0.1 1.53 1.53 0 0 0 -1 0.92A4.77 4.77 0 0 0 0 2.6a22.83 22.83 0 0 0 0.18 3.21 3.73 3.73 0 0 0 0.06 0.47Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="m6.29 23 -2.37 0a7.47 7.47 0 0 1 -0.92 -0.12 9 9 0 0 1 -1.26 -0.16 0.46 0.46 0 0 1 -0.29 -0.29 4.46 4.46 0 0 1 -0.25 -1.13 28.94 28.94 0 0 1 -0.26 -3.08 2.37 2.37 0 0 0 0 -0.64c0 -0.09 -0.51 -0.33 -0.6 0.14l-0.06 0.47a21.56 21.56 0 0 0 -0.2 3.21 4.77 4.77 0 0 0 0.28 1.51 1.52 1.52 0 0 0 1 0.92 7.66 7.66 0 0 0 1.49 0.11 7.79 7.79 0 0 0 1.08 0c0.79 -0.06 1.56 -0.2 2.35 -0.24a0.35 0.35 0 0 0 0 -0.7Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M17.71 1c0.79 0.05 1.58 0 2.37 0a7.47 7.47 0 0 1 0.94 0.09 9 9 0 0 1 1.26 0.16 0.47 0.47 0 0 1 0.29 0.28 4.56 4.56 0 0 1 0.25 1.14 32.83 32.83 0 0 1 0.28 3.72c0 0.09 0.51 0.32 0.6 -0.14l0.06 -0.47a21.7 21.7 0 0 0 0.16 -3.22 4.7 4.7 0 0 0 -0.28 -1.5 1.53 1.53 0 0 0 -1 -0.93 8.59 8.59 0 0 0 -1.49 -0.1 9.73 9.73 0 0 0 -1.08 0c-0.79 0.06 -1.56 0.2 -2.35 0.25a0.34 0.34 0 0 0 -0.34 0.34 0.34 0.34 0 0 0 0.33 0.38Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M23.82 18.17c0 -0.42 -0.05 -0.84 -0.4 -0.78s-0.26 0.35 -0.27 0.81a28.84 28.84 0 0 1 -0.27 3.08 4.63 4.63 0 0 1 -0.24 1.14 0.46 0.46 0 0 1 -0.3 0.28 7.6 7.6 0 0 1 -1.25 0.16 7.63 7.63 0 0 1 -0.95 0.09l-2.36 0a0.35 0.35 0 1 0 0 0.69c0.79 0.05 1.56 0.19 2.35 0.25a9.53 9.53 0 0 0 1.07 0 8.52 8.52 0 0 0 1.49 -0.1 1.55 1.55 0 0 0 1 -0.93 4.7 4.7 0 0 0 0.28 -1.5 23 23 0 0 0 -0.15 -3.19Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + </g></symbol> + </svg> + <script> function switchTheme(theme) { if (theme == "" || typeof theme == "undefined") { @@ -109,70 +147,59 @@ } </script> - <div + <nav id="sidebar" - class="bg-sidebar block fixed shadow-[0_0_0.4rem_black] z-1001 w-fit h-auto" + aria-label="Main navigation" + class="fixed flex flex-row w-full h-24 md:flex-col md:w-24 md:h-auto bg-paper bg-background shadow-elevation-6 z-1001 shrink-0 md:rounded-br-md" > - <div class="text-[3rem] flex flex-col gap-0 relative z-1001"> - <a - href="./" - class="themed-button themed-button-sidebar w-fit h-fit" - draggable="false" - > - <i - class="fas fa-circle-left flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> - <a - href="/{{ .Lang }}" - class="themed-button themed-button-sidebar w-fit h-fit" - draggable="false" - > - <i - class="fas fa-home flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> - <a - href="/{{ .Lang }}/blog" - class="themed-button themed-button-sidebar w-fit h-fit" - draggable="false" - > - <i - class="fas fa-search flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> - <a - href="/{{ .Lang }}/map" - class="themed-button themed-button-sidebar w-fit h-fit" - draggable="false" - > - <i - class="fas fa-map flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> - <div - id="toolbar-theme-button" - onclick="toggleThemeWheel()" - class="themed-button themed-button-sidebar w-fit h-fit" - draggable="false" - > - <i - id="toolbar-theme-button-content" - class="fas fa-swatchbook flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </div> - <a - href="/{{ .Lang }}/user" - id="sidebar-user-button" - class="themed-button themed-button-sidebar w-fit h-fit" - draggable="false" - > - <i - onclick="return changeUrl('/{{ .Lang }}/user');" - class="fas fa-user flex faw-18 h-18 content-center text-center text-sidebar" - ></i> - </a> + <a + class="w-18 h-18 rounded-xl m-3 accent-button" + href="./" + id="sidebar-back-button" + draggable="false" + > + <svg viewBox="0 0 24 24"><use href="#icon-back"/></svg> + </a> + <a + class="w-18 h-18 rounded-xl m-3 accent-button" + href="/{{ .Lang }}" + id="sidebar-home-button" + draggable="false" + > + <svg viewBox="0 0 24 24"><use href="#icon-logo"/></svg> + </a> + <a + class="w-18 h-18 rounded-xl m-3 accent-button" + href="/{{ .Lang }}/blog" + id="sidebar-blog-button" + draggable="false" + > + <svg viewBox="0 0 24 24"><use href="#icon-newspaper"/></svg> + </a> + <a + class="w-18 h-18 rounded-xl m-3 accent-button active" + href="/{{ .Lang }}/map" + id="sidebar-map-button" + draggable="false" + > + <svg viewBox="0 0 24 24"><use href="#icon-map"/></svg> + </a> + <div + class="w-18 h-18 rounded-xl m-3 accent-button" + onclick="toggleThemeWheel()" + id="sidebar-theme-button" + draggable="false" + > + <svg class="sidebar-theme-button-content" viewBox="0 0 24 24"><use href="#icon-palette"/></svg> </div> + <a + class="w-18 h-18 rounded-xl m-3 accent-button" + href="/{{ .Lang }}/user" + id="sidebar-user-button" + draggable="false" + > + <svg viewBox="0 0 24 24"><use href="#icon-account"/></svg> + </a> <div class="theme-wheel" id="theme-wheel"> <div class="theme-icon" data-theme="olive"></div> <div class="theme-icon" data-theme="lettuce"></div> @@ -181,7 +208,7 @@ <div class="theme-icon" data-theme="lilac"></div> <div class="theme-pin"></div> </div> - </div> + </nav> <div id="map-container" @@ -194,7 +221,7 @@ <script> const themeWheel = document.getElementById("theme-wheel"); - const themeButton = document.getElementById("toolbar-theme-button"); + const themeButton = document.getElementById("sidebar-theme-button"); const themeIcons = document.querySelectorAll(".theme-icon"); const themeWheelRadius = convertRemToPixels(6); const THUMB_BASE = "{{ .ThumbnailBaseUrl }}"; @@ -328,7 +355,7 @@ if ( !themeWheel.contains(e.target) && e.target !== themeButton && - !e.target.classList.contains("toolbar-theme-button-content") + !e.target.classList.contains("sidebar-theme-button-content") ) { hideThemeWheel(); } diff --git a/views/pages/home-page.html b/views/pages/home-page.html index c966fc2..7de9420 100644 --- a/views/pages/home-page.html +++ b/views/pages/home-page.html @@ -1,4 +1,22 @@ {{ define "body" }} +<!-- Streamline Icons: https://streamlinehq.com --> +<svg xmlns="http://www.w3.org/2000/svg" style="display:none" aria-hidden="true"> + <symbol id="icon-discord" viewBox="0 0 24 24"><g> + <path d="M23.8 8.8A10.45 10.45 0 0 0 20 3 13 13 0 0 0 13.59 0.4c-0.14 0 -6 -1 -9.79 2.77C1.67 5.32 0.56 8.65 0.15 11.77A15.3 15.3 0 0 0 0 14.71a8.77 8.77 0 0 0 3.46 6.44 13.74 13.74 0 0 0 4 2 13.55 13.55 0 0 0 1.91 0.52 5.32 5.32 0 0 0 1.41 0.11 16.63 16.63 0 0 0 6.12 -1.57A12.19 12.19 0 0 0 21.75 18a14.6 14.6 0 0 0 1.87 -4.4 10.74 10.74 0 0 0 0.18 -4.8Zm-1.19 4.56a13.31 13.31 0 0 1 -1.77 4.05 11 11 0 0 1 -4.43 3.73 15.5 15.5 0 0 1 -5.71 1.47 4.07 4.07 0 0 1 -1.13 -0.09 13.63 13.63 0 0 1 -1.76 -0.47 13.06 13.06 0 0 1 -3.68 -1.75 7.87 7.87 0 0 1 -2.5 -3.08A7.75 7.75 0 0 1 1 14.63a14.11 14.11 0 0 1 0 -2.75c0.32 -3 1.29 -6.15 3.27 -8.23 0.1 -0.11 2.84 -3.36 9.2 -2.5a12.09 12.09 0 0 1 5.95 2.53A9.47 9.47 0 0 1 22.86 9a9.56 9.56 0 0 1 -0.25 4.36Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M20.27 11.06c-0.33 -0.59 -0.74 -1.14 -1.08 -1.69a16.78 16.78 0 0 0 -1.4 -2 6 6 0 0 0 -1.27 -1.17A6.34 6.34 0 0 0 14 5.36a31.12 31.12 0 0 0 -3.83 -0.08 12.94 12.94 0 0 0 -3 0.18c-1.41 0.35 -0.76 0.32 -2 2.72 -0.57 0.89 -1.02 1.82 -1.49 2.72a11.42 11.42 0 0 0 -0.77 1.39 1.65 1.65 0 0 0 -0.1 0.82 2.77 2.77 0 0 0 0.45 1.15 8.92 8.92 0 0 0 1.08 1.27l1.09 1.29a3.51 3.51 0 0 0 0.29 0.37 0.47 0.47 0 0 0 0.42 0.15 2 2 0 0 0 1.16 -0.62 12.55 12.55 0 0 0 1.49 -2c0.06 -0.08 0.36 -0.36 0.37 -0.52l0.93 0.11 2.91 0c1.31 0.09 0.41 -0.77 1.77 1.78a9.19 9.19 0 0 0 0.52 0.85 5.71 5.71 0 0 0 0.53 0.81 0.67 0.67 0 0 0 0.39 0.19 1.49 1.49 0 0 0 0.74 -0.11 5 5 0 0 0 1 -0.67 11.91 11.91 0 0 0 1.52 -1.42 13 13 0 0 0 1.28 -1.64 1.47 1.47 0 0 0 0.25 -0.77 3.09 3.09 0 0 0 -0.16 -0.94 6.06 6.06 0 0 0 -0.57 -1.33Zm-0.38 2.43A12.53 12.53 0 0 1 18.7 15a11.92 11.92 0 0 1 -1.4 1.28 5 5 0 0 1 -0.57 0.42l-0.14 0.08a2.55 2.55 0 0 0 -0.38 -0.48 6.07 6.07 0 0 1 -0.45 -0.74c-0.35 -0.64 -0.64 -1.32 -1 -1.95a0.73 0.73 0 0 0 -0.48 -0.31 11.39 11.39 0 0 0 -1.22 -0.09h-2.95c-0.21 0 -0.69 -0.1 -1 -0.1a1.13 1.13 0 0 0 -0.45 0.08 0.88 0.88 0 0 0 -0.34 0.29c-0.14 0.19 -0.28 0.53 -0.35 0.63a19.39 19.39 0 0 1 -1.11 1.72 1.93 1.93 0 0 1 -0.59 0.53l-0.11 -0.09L5 14.93a10 10 0 0 1 -1 -1.12 1.94 1.94 0 0 1 -0.41 -0.81 1.11 1.11 0 0 1 0.11 -0.64c0.17 -0.4 0.45 -0.79 0.62 -1.14 0.45 -0.91 0.87 -1.84 1.33 -2.75 1.29 -2.53 1.18 -2.29 2 -2.41a14.57 14.57 0 0 1 2.46 0 28 28 0 0 1 3.71 0.16A5.33 5.33 0 0 1 16 7a5.08 5.08 0 0 1 1 1 16.3 16.3 0 0 1 1.27 1.93c0.33 0.55 0.72 1.11 1 1.69a5.1 5.1 0 0 1 0.48 1.1 2.36 2.36 0 0 1 0.1 0.53 0.43 0.43 0 0 1 0.04 0.24Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M7.15 8.26a1.44 1.44 0 0 0 -0.51 0.6 1.56 1.56 0 0 0 0.14 1.48A1.49 1.49 0 0 0 8.2 11a1.77 1.77 0 0 0 1.38 -1.42c0.27 -1.69 -1.45 -1.94 -2.43 -1.32Zm1.53 1.11a0.71 0.71 0 0 1 -0.6 0.53 0.44 0.44 0 0 1 -0.41 -0.2 0.65 0.65 0 0 1 -0.19 -0.54 0.68 0.68 0 0 1 0.21 -0.37c0.75 -0.55 1.17 0.02 0.99 0.58Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M15 8a1.38 1.38 0 0 0 -0.77 -0.21 2.68 2.68 0 0 0 -1 0.25 3.12 3.12 0 0 0 -0.72 1 1.65 1.65 0 0 0 0.55 1.53 1.6 1.6 0 0 0 1.69 0.38 1.71 1.71 0 0 0 0.89 -1.47A1.65 1.65 0 0 0 15 8Zm-0.37 1.4a0.62 0.62 0 0 1 -0.3 0.53 0.36 0.36 0 0 1 -0.27 0 1.28 1.28 0 0 1 -0.4 -0.25c-0.15 -0.14 -0.3 -0.29 -0.28 -0.47a0.45 0.45 0 0 1 0.17 -0.34 2.73 2.73 0 0 1 0.53 -0.29 0.57 0.57 0 0 1 0.39 0.14 0.74 0.74 0 0 1 0.2 0.69Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-telegram" viewBox="0 0 24 24"><g> + <path d="M23.8 9.74a10.54 10.54 0 0 0 -3.1 -5.5c-1.25 -1.19 -7.2 -6 -13.52 -3.12a12 12 0 0 0 -4.56 18.49 12.24 12.24 0 0 0 2.66 2.53 9.1 9.1 0 0 0 3.43 1.45c3.79 0.74 7.9 -0.75 10.9 -3.38s5.03 -6.67 4.19 -10.47Zm-4.87 9.68c-2.78 2.38 -6.54 3.78 -10 3.09a8.18 8.18 0 0 1 -3 -1.27 11.8 11.8 0 0 1 -2.44 -2.3 11 11 0 0 1 -2.25 -9.53 11.25 11.25 0 0 1 6.24 -7.66C8.17 1.42 12.94 -0.79 19 3.84a10 10 0 0 1 3.91 6.08c0.74 3.49 -1.1 7.08 -3.98 9.5Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M17.5 6.52a8 8 0 0 0 -2.14 0.35l-0.78 0.13c-1.67 0.31 -3.36 0.63 -5 1 -1.11 0.28 -2.21 0.59 -3.29 1a5.12 5.12 0 0 0 -0.65 0.25 4.6 4.6 0 0 0 -0.64 0.34l-0.61 0.4 -0.39 0.34a0.93 0.93 0 0 0 -0.24 1.09C4 12 5 12.34 5.49 12.48l0.53 0.17 0.15 0 0 0.81 0 1 0.08 0.74 0.06 0.53A8.91 8.91 0 0 0 6.53 17a1.4 1.4 0 0 0 0.42 0.71H7a0.3 0.3 0 0 0 0.34 0.22A13.32 13.32 0 0 0 9 17.8a5.35 5.35 0 0 0 0.69 -0.17c0.23 -0.07 0.45 -0.15 0.67 -0.24 0.49 -0.19 0.94 -0.41 1.4 -0.63l0.58 0.56 0.66 0.47 0.52 0.23a1.08 1.08 0 0 0 1 -0.19 4.55 4.55 0 0 0 0.92 -1.51l1.4 -2.92c0.38 -0.76 0.78 -1.51 1.15 -2.28 0.25 -0.52 0.48 -1 0.68 -1.59A3.92 3.92 0 0 0 19 8.2a1.73 1.73 0 0 0 -0.31 -1.08 1.51 1.51 0 0 0 -1.19 -0.6ZM6.88 13.44l-0.07 -0.58c0.46 0 0.49 -0.43 5.26 -1.84l0.62 -0.16A16.71 16.71 0 0 1 11.34 12c-0.74 0.57 -1.51 1.12 -2.26 1.69l-0.46 0.52 -0.69 1.49s-0.22 0.44 -0.4 0.82c-0.07 -0.36 -0.1 -0.74 -0.14 -0.91l-0.12 -0.54 -0.19 -0.7Zm3.14 3c-0.23 0.05 -0.46 0.1 -0.68 0.17l-0.66 0.21 -0.27 0.12c0.07 -0.25 0.26 -0.76 0.31 -0.93 0.12 -0.36 0.35 -1.18 0.48 -1.5a0.3 0.3 0 0 0 0 -0.23s0.07 0 0.11 0l1.81 2c-0.35 -0.02 -0.72 0.04 -1.12 0.13Zm7.83 -8.08a3.2 3.2 0 0 1 -0.22 0.82c-0.14 0.39 -0.3 0.77 -0.46 1.14 -0.4 0.9 -0.83 1.79 -1.24 2.68l-1.31 2.95a6 6 0 0 1 -0.55 1.15 0.34 0.34 0 0 1 -0.36 0.16l-0.35 -0.14 -0.57 -0.38 -1 -0.91 -1.86 -1.93c0.78 -0.49 1.56 -1 2.32 -1.48 0.4 -0.27 0.8 -0.55 1.17 -0.85 0.2 -0.17 0.41 -0.34 0.59 -0.52a2.16 2.16 0 0 0 0.36 -0.51 2.52 2.52 0 0 0 0.14 -0.56 0.54 0.54 0 0 0 -0.51 -0.55 1.06 1.06 0 0 0 -0.24 0 3.54 3.54 0 0 0 -0.47 0.12l-1.51 0.45c-0.58 0.19 -1.14 0.38 -1.69 0.6 -1.27 0.5 -2.49 1.07 -3.78 1.55l-0.09 0 -0.53 -0.18a3.39 3.39 0 0 1 -1.22 -0.65c-0.11 -0.11 -0.11 -0.26 0.06 -0.43l0.3 -0.25 0.52 -0.32 1.16 -0.52c1.08 -0.32 2.17 -0.58 3.26 -0.8 1.66 -0.35 3.33 -0.62 5 -0.89l0.81 -0.16a10 10 0 0 1 1.6 -0.32c0.23 0 0.46 0 0.57 0.14a0.76 0.76 0 0 1 0.1 0.56Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + </g></symbol> + <symbol id="icon-email" viewBox="0 0 24 24"><g> + <path d="M23.58 5.09a2.73 2.73 0 0 0 -0.71 -1.43 4.24 4.24 0 0 0 -1.62 -0.34 99 99 0 0 0 -11.89 0.07C5.34 3.65 1.7 4.18 0.55 5a1.12 1.12 0 0 0 -0.35 0.68A25.75 25.75 0 0 0 0 9.6a93.2 93.2 0 0 0 0.5 10.09 0.31 0.31 0 1 0 0.61 -0.11c-0.15 -0.95 -0.29 -4 -0.31 -7.11A56 56 0 0 1 1 6.36c1.64 1.1 4.88 3.25 7.53 4.69l1.46 0.72a7.13 7.13 0 0 0 2.53 0.82 3.16 3.16 0 0 0 1.14 -0.42 8.38 8.38 0 0 0 0.79 -0.48l1.44 -1c0.34 -0.25 0.67 -0.49 1 -0.77A44.32 44.32 0 0 0 22.32 5c0 0.11 0.07 0.24 0.1 0.38a24.38 24.38 0 0 1 0.41 4.75 65 65 0 0 1 -0.36 8.17c0 0.22 -0.07 0.45 -0.1 0.58l-0.69 0c-1.79 0.18 -5.6 0.46 -9.48 0.7 -4.39 0.27 -8.86 0.5 -10.56 0.54a0.35 0.35 0 0 0 -0.35 0.35 0.36 0.36 0 0 0 0.36 0.35c2.27 0 9.45 -0.29 14.83 -0.58 2.56 -0.13 4.71 -0.27 5.73 -0.37a2.73 2.73 0 0 0 0.86 -0.19 0.6 0.6 0 0 0 0.24 -0.3 4.17 4.17 0 0 0 0.22 -0.94A65.86 65.86 0 0 0 24 10.1a26 26 0 0 0 -0.42 -5.01Zm-6.33 3.28c-1.23 0.92 -2.48 1.78 -3.44 2.36a4.31 4.31 0 0 1 -1.36 0.67 3.75 3.75 0 0 1 -1.27 -0.4c-0.9 -0.37 -2.06 -0.94 -3.29 -1.59C5.34 8.1 2.52 6.49 1.13 5.68c1.18 -0.69 4.57 -1 8.29 -1.2a106 106 0 0 1 11.74 0h0.62a38.87 38.87 0 0 1 -4.53 3.89Z" fill="var(--color-main)" stroke-width="1"></path> + <path d="M17.68 14.41c0.34 0.33 0.69 0.65 1 0.95 1 0.93 2 1.74 2.46 2.19a0.36 0.36 0 0 0 0.5 0 0.35 0.35 0 0 0 0 -0.5c-0.43 -0.51 -1.23 -1.46 -2.18 -2.49q-0.48 -0.51 -1 -1c-0.34 -0.33 -0.69 -0.66 -1 -1s-0.81 -0.68 -1.19 -1c-0.69 -0.47 -1.2 0 -0.71 0.59 0.34 0.37 0.71 0.78 1.12 1.2s0.66 0.73 1 1.06Z" fill="var(--color-accent-deep)" stroke-width="1"></path> + <path d="M4.59 15.35a39.94 39.94 0 0 0 -2.94 3.25 0.35 0.35 0 1 0 0.53 0.46c0.59 -0.6 1.69 -1.51 2.89 -2.58 0.63 -0.57 1.29 -1.17 1.9 -1.79s1.42 -1.52 2 -2.21 -0.14 -1 -0.82 -0.39c-0.52 0.46 -1.08 0.94 -1.67 1.47s-1.28 1.19 -1.89 1.79Z" fill="var(--color-accent-deep)" stroke-width="1"></path> + </g></symbol> +</svg> <div class="absolute w-full h-full inset-0 inset-shadow-[0_0_0.4rem_black] pointer-events-none z-20"></div> <div class="relative bg-paper bg-background-light font-gentium flex flex-row ar-lt-0.6:flex-col w-full h-full overflow-y-auto text-base/loose tracking-wide z-10"> <div class="ar-gt-0.6:flex-3/5 justify-center content-start p-8"> @@ -32,17 +50,17 @@ bg-linear-to-r from-background-dark to-background-light">{{ .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 faw-4 h-4 mr-1"></i> + <svg class="w-4 h-4 mr-1 inline" viewBox="0 0 24 24"><use href="#icon-telegram"/></svg> <span class="font-bold">Telegram:</span> <span>@EarlInisMona</span> </a> <a href="https://discord.com/users/356057270951346176"> - <i class="fa-brands fa-discord faw-4 h-4 mr-1"></i> + <svg class="w-4 h-4 mr-1 inline" viewBox="0 0 24 24"><use href="#icon-discord"/></svg> <span class="font-bold">Discord:</span> <span>montferrat</span> </a> <a href="mailto:saya.andy@posteo.com"> - <i class="fas fa-envelope faw-4 h-4 mr-1"></i> + <svg class="w-4 h-4 mr-1 inline" viewBox="0 0 24 24"><use href="#icon-email"/></svg> <span class="font-bold">E-mail:</span> <span>saya.andy@posteo.com</span> </a> @@ -108,14 +126,18 @@ <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/50 [&>*:nth-child(4n+3)]:bg-background-medium/50" style="container-type: inline-size;"> - <i class="fas fa-home faw-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 faw-full h-full text-[10cqi] content-center text-center text-main-hard"></i> - <p class="p-1">{{ .L.HomePage.BlogSearchDescription }}</p> - <i class="fas fa-map faw-full h-full text-[10cqi] content-center text-center text-main-hard"></i> - <p class="p-1">{{ .L.HomePage.MarkerMapDescription }}</p> - <i class="fas fa-swatchbook faw-full h-full text-[10cqi] content-center text-center text-main-hard"></i> - <p class="p-1">{{ .L.HomePage.ThemeSwitchDescription }}</p> + <svg viewBox="0 0 24 24" class="h-full w-[15cqi] context-center text-main-hard"><use href="#icon-back"/></svg> + <p class="p-1 w-[85cqi]">{{ .L.HomePage.BackDescription }}</p> + <svg viewBox="0 0 24 24" class="h-full w-[15cqi] context-center text-main-hard"><use href="#icon-logo"/></svg> + <p class="p-1 w-[85cqi]">{{ .L.HomePage.HomePageDescription }}</p> + <svg viewBox="0 0 24 24" class="h-full w-[15cqi] context-center text-main-hard"><use href="#icon-newspaper"/></svg> + <p class="p-1 w-[85cqi]">{{ .L.HomePage.BlogSearchDescription }}</p> + <svg viewBox="0 0 24 24" class="h-full w-[15cqi] context-center text-main-hard"><use href="#icon-map"/></svg> + <p class="p-1 w-[85cqi]">{{ .L.HomePage.MarkerMapDescription }}</p> + <svg viewBox="0 0 24 24" class="h-full w-[15cqi] context-center text-main-hard"><use href="#icon-palette"/></svg> + <p class="p-1 w-[85cqi]">{{ .L.HomePage.ThemeSwitchDescription }}</p> + <svg viewBox="0 0 24 24" class="h-full w-[15cqi] context-center text-main-hard"><use href="#icon-account"/></svg> + <p class="p-1 w-[85cqi]">{{ .L.HomePage.AccountDescription }}</p> </div> </div> </div> diff --git a/views/partials/blog-page-like-button.html b/views/partials/blog-page-like-button.html index d8238f4..54b2914 100644 --- a/views/partials/blog-page-like-button.html +++ b/views/partials/blog-page-like-button.html @@ -1,5 +1,28 @@ <button hx-put="/api/v1/like" hx-vals='{"like": {{ not .Liked }}}' hx-target="this" hx-swap="outerHTML" hx-trigger="click" - class="themed-button themed-button-like flex flex-col shrink-0 w-fit h-fit mr-2 my-auto{{ if .Liked }} active{{ end }}"> - <i class="fas fa-thumbs-up faw-8 h-fit py-0.5 content-center text-center"></i> - <div class="h-fit px-0.5 content-center bg-background-medium text-main-hard">{{ .LikedCount }}</div> -</button>
\ No newline at end of file + class="accent-button rounded-xl flex flex-row shrink-0 w-fit h-full mx-2 my-auto{{ if .Liked }} active{{ end }}"> + {{ if .Liked }} + <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="Like-Hand-1--Streamline-Freehand" class="h-10"> + <desc> + Like Hand 1 Streamline Icon: https://streamlinehq.com + </desc> + <g> + <path d="M18.36 11a4.26 4.26 0 0 0 -3 -0.92 22.21 22.21 0 0 0 -3.72 0.43c0 -0.69 0.05 -1.76 0 -2.69a4.77 4.77 0 0 0 -0.31 -1.56 1.73 1.73 0 0 0 -2 -1 2.13 2.13 0 0 0 -1.69 1.29 17.51 17.51 0 0 1 -2.3 4.14c-0.77 1 -1.56 1.83 -2.17 1.89a1.68 1.68 0 0 0 -0.12 -0.31A2 2 0 0 0 2 11.52a4.67 4.67 0 0 0 -1.7 -0.21 0.3 0.3 0 0 0 -0.28 0.32 0.3 0.3 0 0 0 0.32 0.28 3.71 3.71 0 0 1 1.17 0.22 1.31 1.31 0 0 1 0.81 0.55 7.78 7.78 0 0 1 0.17 1.68c0 0.54 0 1.14 0.06 1.78 0 0.88 0.07 1.82 0.1 2.66s0.06 1.82 0 2.35c0 0.17 -0.08 0.34 -0.06 0.39a2.1 2.1 0 0 1 -0.91 0.36 2.74 2.74 0 0 1 -1.21 0 0.34 0.34 0 0 0 -0.22 0.65 3.61 3.61 0 0 0 1.54 0.11 2.85 2.85 0 0 0 1.53 -0.58 1.4 1.4 0 0 0 0.24 -0.72 31.22 31.22 0 0 0 0.14 -4.27c0 -0.82 -0.09 -1.64 -0.17 -2.36s-0.15 -1.15 -0.23 -1.57a5.48 5.48 0 0 0 2.56 -2.06 18 18 0 0 0 2.55 -4.26 1.32 1.32 0 0 1 1 -0.77 0.88 0.88 0 0 1 1 0.51 4.12 4.12 0 0 1 0.18 1.24c0 1.09 -0.08 2.38 0 3a1.39 1.39 0 0 0 0.12 0.57 0.55 0.55 0 0 0 0.51 0.27 4 4 0 0 0 0.52 -0.06 18.17 18.17 0 0 1 4.26 -0.36 2.45 2.45 0 0 1 1.57 0.55c0.85 0.9 1.31 3 1.4 5s-0.18 4.15 -1.05 5 -2.57 1.05 -4.37 1.21a12 12 0 0 1 -4.67 -0.46C8 22.1 6.71 21.39 5.6 21a3.82 3.82 0 0 0 -1.66 -0.27 0.34 0.34 0 0 0 -0.3 0.38 0.34 0.34 0 0 0 0.36 0.29 3.15 3.15 0 0 1 1.34 0.27c1.09 0.41 2.33 1.14 3.2 1.54a14.07 14.07 0 0 0 6 0.58 7.25 7.25 0 0 0 4 -1.28c1 -1 1.55 -3.37 1.46 -5.78S19.34 12 18.36 11Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M0.37 6c0.31 0 0.82 0.13 1.41 0.17H2v0.1c0.06 0.68 0.15 1.25 0.17 1.46a0.34 0.34 0 0 0 0.68 0C2.84 7.54 3 7 3 6.27l0 -0.15c0.64 -0.08 1.16 -0.2 1.25 -0.18a0.34 0.34 0 0 0 0.43 -0.22 0.32 0.32 0 0 0 -0.21 -0.42 7 7 0 0 0 -1.46 -0.24V5c-0.07 -0.67 -0.2 -1.24 -0.24 -1.47a0.31 0.31 0 0 0 -0.31 -0.3 0.29 0.29 0 0 0 -0.29 0.3C2.17 3.78 2 4.34 2 5l-0.2 0a10.33 10.33 0 0 0 -1.43 0.32 0.3 0.3 0 0 0 -0.27 0.33 0.3 0.3 0 0 0 0.27 0.35Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M23.77 10.81a5.83 5.83 0 0 0 -1.25 -0.25c-0.1 -0.39 -0.24 -0.71 -0.29 -0.92a0.3 0.3 0 1 0 -0.6 0c0 0.2 -0.11 0.53 -0.15 0.91a8.85 8.85 0 0 0 -1.2 0.31 0.29 0.29 0 0 0 -0.26 0.33 0.3 0.3 0 0 0 0.32 0.27c0.3 0 0.7 0.13 1.17 0.18h0.07c0.09 0.44 0.22 0.81 0.25 1a0.34 0.34 0 1 0 0.68 0 8.85 8.85 0 0 0 0.14 -1.08c0.47 -0.07 0.84 -0.17 0.93 -0.15a0.34 0.34 0 0 0 0.22 -0.65Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M13.94 4.33a2.57 2.57 0 0 1 1.43 0.88 4.52 4.52 0 0 1 1 1.54 0.57 0.57 0 0 0 0.56 0.37 0.57 0.57 0 0 0 0.53 -0.41 2.81 2.81 0 0 1 1 -1.41 6.9 6.9 0 0 1 1.69 -1 0.49 0.49 0 0 0 0.31 -0.43 0.5 0.5 0 0 0 -0.24 -0.47 8.18 8.18 0 0 1 -2.26 -1.47 2.39 2.39 0 0 1 -0.71 -1.46 0.34 0.34 0 0 0 -0.34 -0.34 0.35 0.35 0 0 0 -0.34 0.35 0.29 0.29 0 0 0 -0.27 0.23 4.41 4.41 0 0 1 -1 1.63 3.53 3.53 0 0 1 -1.48 1 0.47 0.47 0 0 0 -0.32 0.5 0.48 0.48 0 0 0 0.44 0.49Zm2 -1.47a5.53 5.53 0 0 0 0.82 -1.44 3.34 3.34 0 0 0 0.59 1 6.91 6.91 0 0 0 1.53 1.3 5.93 5.93 0 0 0 -1.48 1 6.91 6.91 0 0 0 -0.51 0.57 4.8 4.8 0 0 0 -0.7 -0.85 4 4 0 0 0 -1 -0.74 5.76 5.76 0 0 0 0.71 -0.84Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + </g> + </svg> + <div class="ml-auto bg-accent-light rounded-full w-6 h-6 text-main">{{ .LikedCount }}</div> + {{ else }} + <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="Like-Hand--Streamline-Freehand" class="h-10"> + <desc> + Like Hand Streamline Icon: https://streamlinehq.com + </desc> + <g> + <path d="M24 14.66c-0.1 -2.79 -0.84 -5.58 -2 -6.82a5 5 0 0 0 -3.59 -1.08 27.12 27.12 0 0 0 -4.58 0.54 1.27 1.27 0 0 1 0 -0.2c0 -0.82 0.06 -2.11 0 -3.23a5.56 5.56 0 0 0 -0.4 -1.87A2 2 0 0 0 11.16 0.87a2.51 2.51 0 0 0 -1.94 1.55 20.45 20.45 0 0 1 -2.79 5C5.52 8.64 5 9.45 4.22 9.58c-0.37 0.13 -0.11 0.56 0.22 0.45C5.27 9.81 6 9.12 7 7.85a21.68 21.68 0 0 0 3 -5.14 1.66 1.66 0 0 1 1.3 -1 1.15 1.15 0 0 1 1.28 0.67 4.82 4.82 0 0 1 0.23 1.52c0 1.31 -0.08 2.87 -0.06 3.61a1.57 1.57 0 0 0 0.14 0.63 0.58 0.58 0 0 0 0.53 0.28 5 5 0 0 0 0.58 -0.06 22.31 22.31 0 0 1 5.15 -0.43 3 3 0 0 1 2 0.7c1.05 1.1 1.61 3.6 1.72 6.08s-0.23 5.07 -1.3 6.11c-0.91 0.88 -3.09 1.3 -5.29 1.43a14.43 14.43 0 0 1 -5.66 -0.57c-1.07 -0.47 -2.61 -1.33 -3.95 -1.8a4.56 4.56 0 0 0 -2 -0.33 0.34 0.34 0 0 0 -0.29 0.38 0.34 0.34 0 0 0 0.38 0.3 3.7 3.7 0 0 1 1.64 0.32c1.32 0.49 2.82 1.37 3.86 1.85 1.4 0.65 4.49 0.93 7.24 0.68 2 -0.19 3.87 -0.71 4.74 -1.52 1.26 -1.17 1.85 -4.02 1.76 -6.9Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path> + <path d="M3.53 9.34a2.22 2.22 0 0 0 -1.24 -0.88 5.37 5.37 0 0 0 -2 -0.26 0.3 0.3 0 0 0 -0.29 0.31 0.3 0.3 0 0 0 0.32 0.29 4.36 4.36 0 0 1 1.44 0.25 1.74 1.74 0 0 1 1 0.69A9.16 9.16 0 0 1 3 11.8c0 0.64 0.06 1.38 0.09 2.14 0 1.07 0.08 2.2 0.11 3.22s0.06 2.19 0 2.84c0 0.23 -0.12 0.45 -0.07 0.51A2.7 2.7 0 0 1 2 21a3.34 3.34 0 0 1 -1.49 0 0.34 0.34 0 0 0 -0.22 0.65 4.22 4.22 0 0 0 1.82 0.13 3.37 3.37 0 0 0 1.79 -0.69 1.82 1.82 0 0 0 0.26 -0.82 37.13 37.13 0 0 0 0.14 -5.13c0 -1 -0.1 -2 -0.19 -2.83a12.48 12.48 0 0 0 -0.58 -2.97Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path> + </g> + </svg> + <div class="ml-auto bg-accent-deep rounded-full w-6 h-6 text-background">{{ .LikedCount }}</div> + {{ end }} +</button> |
