summaryrefslogtreecommitdiff
diff options
from:
to:
context:
space:
mode:
authorGravatar SayaAndy <montferrat@tuta.io> 2025-07-26 22:01:30 +0700
committerGravatar SayaAndy <montferrat@tuta.io> 2025-07-26 22:01:30 +0700
commit97e30570056309bda28fc41acba27c01fa1ef9f3 (patch)
treed6102a1756c9fb57bf5b61283d0163b29e3a8881
parent452a99641208db2695f3c1d0419c3a547cabca70 (diff)
downloadweb-97e30570056309bda28fc41acba27c01fa1ef9f3.tar.gz
web-97e30570056309bda28fc41acba27c01fa1ef9f3.zip
refactor: use tailwindcss tool for generating css (vpn required no more for russia)
refactor: move css to sayana-static bucket refactor: first touch of rendering templates
-rw-r--r--go.mod3
-rw-r--r--go.sum6
-rw-r--r--main.go13
-rw-r--r--views/index.html (renamed from public/index.html)402
4 files changed, 24 insertions, 400 deletions
diff --git a/go.mod b/go.mod
index 8269668..578b61b 100644
--- a/go.mod
+++ b/go.mod
@@ -6,6 +6,9 @@ require github.com/gofiber/fiber/v2 v2.52.9
require (
github.com/andybalholm/brotli v1.1.0 // indirect
+ github.com/gofiber/template v1.8.3 // indirect
+ github.com/gofiber/template/html/v2 v2.1.3 // indirect
+ github.com/gofiber/utils v1.1.0 // indirect
github.com/google/uuid v1.6.0 // indirect
github.com/klauspost/compress v1.17.9 // indirect
github.com/mattn/go-colorable v0.1.13 // indirect
diff --git a/go.sum b/go.sum
index 339ed77..cfc34da 100644
--- a/go.sum
+++ b/go.sum
@@ -2,6 +2,12 @@ github.com/andybalholm/brotli v1.1.0 h1:eLKJA0d02Lf0mVpIDgYnqXcUn0GqVmEFny3VuID1
github.com/andybalholm/brotli v1.1.0/go.mod h1:sms7XGricyQI9K10gOSf56VKKWS4oLer58Q+mhRPtnY=
github.com/gofiber/fiber/v2 v2.52.9 h1:YjKl5DOiyP3j0mO61u3NTmK7or8GzzWzCFzkboyP5cw=
github.com/gofiber/fiber/v2 v2.52.9/go.mod h1:YEcBbO/FB+5M1IZNBP9FO3J9281zgPAreiI1oqg8nDw=
+github.com/gofiber/template v1.8.3 h1:hzHdvMwMo/T2kouz2pPCA0zGiLCeMnoGsQZBTSYgZxc=
+github.com/gofiber/template v1.8.3/go.mod h1:bs/2n0pSNPOkRa5VJ8zTIvedcI/lEYxzV3+YPXdBvq8=
+github.com/gofiber/template/html/v2 v2.1.3 h1:n1LYBtmr9C0V/k/3qBblXyMxV5B0o/gpb6dFLp8ea+o=
+github.com/gofiber/template/html/v2 v2.1.3/go.mod h1:U5Fxgc5KpyujU9OqKzy6Kn6Qup6Tm7zdsISR+VpnHRE=
+github.com/gofiber/utils v1.1.0 h1:vdEBpn7AzIUJRhe+CiTOJdUcTg4Q9RK+pEa0KPbLdrM=
+github.com/gofiber/utils v1.1.0/go.mod h1:poZpsnhBykfnY1Mc0KeEa6mSHrS3dV0+oBWyeQmb2e0=
github.com/google/uuid v1.6.0 h1:NIvaJDMOsjHA8n1jAhLSgzrAzy1Hgr+hNrb57e+94F0=
github.com/google/uuid v1.6.0/go.mod h1:TIyPZe4MgqvfeYDBFedMoGGpEw/LqOeaOT+nhxU+yHo=
github.com/klauspost/compress v1.17.9 h1:6KIumPrER1LHsvBVuDa0r5xaG0Es51mhhB9BQB2qeMA=
diff --git a/main.go b/main.go
index c927dac..ed47574 100644
--- a/main.go
+++ b/main.go
@@ -4,10 +4,21 @@ import (
"log"
"github.com/gofiber/fiber/v2"
+ "github.com/gofiber/template/html/v2"
)
func main() {
- app := fiber.New()
+ engine := html.New("./views", ".html")
+
+ app := fiber.New(fiber.Config{
+ Views: engine,
+ })
+
+ app.Get("/", func(c *fiber.Ctx) error {
+ return c.Render("index", fiber.Map{
+ "Title": "Демо-материал после демон-аэропорта",
+ })
+ })
app.Static("/", "./public")
diff --git a/public/index.html b/views/index.html
index ba13e3b..fc47acc 100644
--- a/public/index.html
+++ b/views/index.html
@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>SAYA TODAY // Демо-материал после демон-аэропорта</title>
+ <title>SAYA TODAY // {{ .Title }}</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-zoom.min.css">
@@ -11,403 +11,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&family=Patua+One&display=swap" rel="stylesheet">
- <script src="https://cdn.tailwindcss.com"></script>
-
- <script>
- tailwind.config = {
- theme: {
- extend: {
- colors: {
- 'olive-dark': '#4b513a',
- 'olive-medium': '#8a9d8a',
- 'olive-light': '#a5b8a5',
- 'cream-dark': '#ffffdd',
- 'cream-light': '#fffff0',
- 'lettuce-dark': '#384a0c',
- 'lettuce-medium': '#9bb665',
- 'lettuce-light': '#bbd095',
- 'sunny-dark': '#f5eee2',
- 'sunny-light': '#fff9ef',
- },
- fontFamily: {
- 'spectral': ['Spectral', 'serif'],
- 'patua': ['Patua One', 'cursive']
- },
- backgroundImage: {
- 'olive-interlocked-hexagons': "url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/interlocked-hexagons.svg')",
- 'olive-squares-and-triangles': "url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/squares-and-triangles.svg')",
- 'lettuce-interlocked-hexagons': "url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/interlocked-hexagons.svg')",
- 'lettuce-squares-and-triangles': "url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/squares-and-triangles.svg')"
- }
- }
- }
- }
- </script>
-
- <style>
- [data-theme="olive"] {
- --main-dark-color: #4b513a;
- --main-medium-color: #8a9d8a;
- --main-light-color: #a5b8a5;
- --background-dark-color: #ffffdd;
- --background-light-color: #fffff0;
- --sidebar-text-color: var(--background-dark-color);
- --sidebar-stroke-color: var(--main-dark-color);
- --secondary-color: var(--main-light-color);
- --interlocked-hexagons-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/interlocked-hexagons.svg');
- --squares-and-triangles-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/olive/squares-and-triangles.svg');
- --invert-colors-in-sidebar: false;
- }
-
- [data-theme="lettuce"] {
- --main-dark-color: #384a0c;
- --main-medium-color: #9bb665;
- --main-light-color: #bbd095;
- --background-dark-color: #f5eee2;
- --background-light-color: #fff9ef;
- --sidebar-text-color: var(--main-dark-color);
- --sidebar-stroke-color: var(--background-dark-color);
- --secondary-color: var(--main-medium-color);
- --interlocked-hexagons-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/interlocked-hexagons.svg');
- --squares-and-triangles-background: url('https://f003.backblazeb2.com/file/sayana-static/themes/lettuce/squares-and-triangles.svg');
- --invert-colors-in-sidebar: true;
- }
-
- .bg-interlocked-hexagons {
- background-image: var(--interlocked-hexagons-background);
- }
-
- .bg-squares-and-triangles {
- background-image: var(--squares-and-triangles-background);
- }
-
- .text-sidebar {
- color: var(--sidebar-text-color);
- }
-
- .stroke-sidebar {
- border-color: var(--sidebar-stroke-color);
- }
-
- .text-main-dark {
- color: var(--main-dark-color);
- }
-
- .text-background-dark {
- color: var(--background-dark-color);
- }
-
- .text-secondary {
- color: var(--secondary-color);
- }
-
- .bg-main-dark {
- background-color: var(--main-dark-color);
- }
-
- .bg-background-dark {
- background-color: var(--background-dark-color);
- }
-
- .bg-background-light {
- background-color: var(--background-light-color);
- }
-
- .border-main-dark {
- border-color: var(--main-dark-color);
- }
-
- .desktop-sidebar-custom {
- width: 5vw;
- background-size: 10vw;
- }
-
- .mobile-topbar-custom {
- width: 90vw;
- height: 10vh;
- background-size: 20vh;
- margin-left: 5vw;
- }
-
- .logo-custom {
- width: 3.5vw;
- height: 25vw;
- font-size: 2.5vw;
- -webkit-text-stroke: 0.1vw var(--sidebar-stroke-color);
- writing-mode: sideways-lr;
- text-orientation: mixed;
- display: block;
- }
-
- .nav-icon-custom {
- font-size: 3vw !important;
- -webkit-text-stroke: 0.1vw var(--sidebar-stroke-color);
- width: 5vw;
- height: 5vw;
- }
-
- .nav-icon-custom:hover {
- font-size: 4vw;
- }
-
- .content-square {
- width: 100vh;
- }
-
- .border-left-custom {
- width: 0.5vw;
- border-right: 0.3vh dashed var(--main-dark-color);
- }
-
- .border-right-custom {
- width: 0.5vw;
- border-left: 0.5vh dotted var(--main-dark-color);
- }
-
- .bg-pattern-body {
- background-size: 10vw;
- }
-
- .inset-shadow {
- box-shadow: inset 0vh 1vh 1vh -1vh rgba(75,81,58,0.5),
- inset 1vh 0vh 1vh -1vh rgba(75,81,58,0.5),
- inset -1vh 0vh 1vh -1vh rgba(75,81,58,0.5),
- inset 0vh -0.5vh rgba(75,81,58,0.5);
- }
-
- .desktop {
- display: flex;
- }
-
- .mobile {
- display: none;
- }
-
- .lh-0-9 {
- line-height: 0.9;
- }
-
- .lh-2 {
- line-height: 2;
- }
-
- .ls-vmin0-04 {
- letter-spacing: 0.04vmin;
- }
-
- .timl-vmax2 {
- text-indent: 2vmax hanging;
- }
-
- .text-vmax0-8 {
- font-size: 0.8vmax;
- }
-
- .text-vmax1 {
- font-size: 1vmax !important;
- }
-
- .text-vmax1-5 {
- font-size: 1.5vmax !important;
- }
-
- .text-vmax2 {
- font-size: 2vmax;
- }
-
- .w-vw90 {
- width: 90vw;
- }
-
- .h-vh90 {
- height: 90vh;
- }
-
- .w-p80 {
- width: 80%;
- }
-
- .mt-vmin0-8 {
- margin-top: 0.8vmin;
- }
-
- .mt-vmin1-6 {
- margin-top: 1.6vmin;
- }
-
- .mx-vmin1-6 {
- margin-left: 1.6vmin;
- margin-right: 1.6vmin;
- }
-
- .mb-vmin0-4 {
- margin-bottom: 0.4vmin;
- }
-
- .mb-vmin0-8 {
- margin-bottom: 0.8vmin;
- }
-
- .pl-vmin0-8 {
- padding-left: 0.8vmin;
- }
-
- .pr-vmin1-2 {
- padding-right: 1.2vmin;
- }
-
- .p-vmin2-4 {
- padding: 2.4vmin;
- }
-
- .lg-backdrop {
- background-color: var(--background-light-color);
- }
-
- .lg-thumb-outer {
- background-color: var(--background-light-color) !important;
- }
-
- .lg-prev {
- background-color: var(--background-light-color);
- color: var(--main-dark-color);
- }
-
- .lg-next {
- background-color: var(--background-light-color);
- color: var(--main-dark-color);
- }
-
- .lg-counter {
- color: var(--main-dark-color);
- font-family: 'Spectral';
- font-size: 1vmax;
- padding-top: 0;
- height: 1vmax;
- }
-
- .lg-toolbar .lg-icon {
- padding: 0 0.7vmax;
- font-size: 1.5vmax !important;
- height: 1.5vmax;
- width: auto;
- color: var(--main-dark-color);
- }
-
- .lg-toolbar .lg-icon:hover {
- color: var(--main-medium-color);
- }
-
- .lg-toolbar .lg-icon {
- font-size: 1.5vmax !important;
- color: var(--main-dark-color);
- }
-
- .lg-content .lg-icon:hover {
- color: var(--main-medium-color);
- }
-
- .lg-sub-html {
- padding: 0.7vmin 1.25vmin !important;
- }
-
- .inline-gallery-container {
- width: 80%;
- height: 60vmin;
- }
-
- .light-gallery-captions {
- p {
- transform: translate3d(0, 0, 0px);
- transition-delay: 500ms;
- opacity: 1;
- }
- }
-
- .lg-slide-progress {
- .light-gallery-captions {
- h4 {
- transform: translate3d(-60px, 0, 0px);
- }
- p {
- transform: translate3d(60px, 0, 0px);
- }
- h4,
- p {
- opacity: 0;
- }
- }
- }
-
- .lg-current {
- &.lg-slide-progress {
- .light-gallery-captions {
- h4,
- p {
- transition-delay: 0ms;
- }
- }
- }
- }
-
- /* Mobile responsive styles */
- @media (max-aspect-ratio: 1.1/1) {
- .desktop {
- display: none;
- }
-
- .mobile {
- display: flex;
- }
-
- .inline-gallery-container {
- width: 100%;
- }
-
- .desktop-sidebar-custom {
- width: 90%;
- margin-left: 5vw;
- height: 10vh;
- background-size: 20vh;
- }
-
- .logo-custom {
- display: none;
- }
-
- .nav-icon-custom {
- font-size: 6vh !important;
- -webkit-text-stroke: 0.1vh var(--sidebar-stroke-color);
- width: 10vh;
- height: 10vh;
- }
-
- .nav-icon-custom:hover {
- font-size: 8vh;
- }
-
- .bg-pattern-body {
- background-size: 10vh;
- }
-
- .border-left-custom {
- width: 1%;
- border-right: 0.3vw dashed var(--main-dark-color);
- }
-
- .border-right-custom {
- width: 1.5%;
- border-left: 0.5vw dotted var(--main-dark-color);
- }
- }
-
- @media (max-aspect-ratio: 0.4/1) {
- .desktop-sidebar-custom {
- width: 100%;
- margin-left: 0;
- }
- }
- </style>
+ <link href="https://f003.backblazeb2.com/file/sayana-static/styles/output.css" rel="stylesheet">
</head>
<body data-theme="olive" class="font-spectral text-main-dark overflow-hidden bg-interlocked-hexagons bg-repeat bg-pattern-body h-screen flex">
@@ -533,7 +137,7 @@
<div class="flex flex-row mt-vmin0-8 mb-vmin0-4">
<p class="grow text-vmax0-8 lh-0-9 font-spectral italic text-right text-secondary mr-2">
- <a href="https://demo.saya.today">Демо-материал после демон-аэропорта</a> © 2025 by <a href="https://t.me/EarlInisMona">Saya Andy</a> is licensed under <a href="https://creativecommons.org/licenses/by-sa/4.0/">CC BY-SA 4.0</a>
+ <a href="https://demo.saya.today">{{ .Title }}</a> © 2025 by <a href="https://t.me/EarlInisMona">Saya Andy</a> is licensed under <a href="https://creativecommons.org/licenses/by-sa/4.0/">CC BY-SA 4.0</a>
</p>
<img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width:1.2vh; max-height:1.2vh;">
<img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width:1.2vh; max-height:1.2vh;">