summaryrefslogtreecommitdiffci
diff refs
from: back
to: back
| flip
diff options
context:
space:
mode:
-rw-r--r--internal/glightbox/block.go31
-rw-r--r--internal/glightbox/html_renderer.go134
-rw-r--r--internal/lightgallery/block.go31
-rw-r--r--internal/lightgallery/extension.go (renamed from internal/glightbox/extension.go)14
-rw-r--r--internal/lightgallery/html_renderer.go145
-rw-r--r--internal/lightgallery/parser.go (renamed from internal/glightbox/parser.go)26
-rw-r--r--main.go4
-rw-r--r--static/input.css147
-rw-r--r--views/layouts/general-page.html11
-rw-r--r--views/pages/blog-catalogue.html2
10 files changed, 339 insertions, 206 deletions
diff --git a/internal/glightbox/block.go b/internal/glightbox/block.go
deleted file mode 100644
index 696f328..0000000
--- a/internal/glightbox/block.go
+++ /dev/null
@@ -1,31 +0,0 @@
-package glightbox
-
-import (
- "time"
-
- "github.com/yuin/goldmark/ast"
-)
-
-// GLightboxBlock represents a light gallery block in the AST
-type GLightboxBlock struct {
- ast.BaseBlock
- Images []GLightboxImage
- Location *time.Location
-}
-
-type GLightboxImage struct {
- URL string
- Caption []byte
-}
-
-var KindGLightboxBlock = ast.NewNodeKind("GLightboxBlock")
-
-// Dump implements ast.Node.Dump
-func (n *GLightboxBlock) Dump(source []byte, level int) {
- ast.DumpHelper(n, source, level, nil, nil)
-}
-
-// Kind implements ast.Node.Kind
-func (n *GLightboxBlock) Kind() ast.NodeKind {
- return KindGLightboxBlock
-}
diff --git a/internal/glightbox/html_renderer.go b/internal/glightbox/html_renderer.go
deleted file mode 100644
index 3b6a533..0000000
--- a/internal/glightbox/html_renderer.go
+++ /dev/null
@@ -1,134 +0,0 @@
-package glightbox
-
-import (
- "bytes"
- "fmt"
- "math/rand"
- "strings"
- "time"
-
- "github.com/yuin/goldmark"
- "github.com/yuin/goldmark/ast"
- "github.com/yuin/goldmark/renderer"
- "github.com/yuin/goldmark/renderer/html"
- "github.com/yuin/goldmark/util"
-)
-
-type GLightboxHTMLRenderer struct {
- html.Config
- md goldmark.Markdown
-}
-
-func NewGLightboxHTMLRenderer(opts ...html.Option) renderer.NodeRenderer {
- r := &GLightboxHTMLRenderer{
- Config: html.NewConfig(),
- md: goldmark.New(
- goldmark.WithRendererOptions(
- html.WithHardWraps(),
- html.WithXHTML(),
- ),
- ),
- }
- for _, opt := range opts {
- opt.SetHTMLOption(&r.Config)
- }
- return r
-}
-
-func (r *GLightboxHTMLRenderer) RegisterFuncs(reg renderer.NodeRendererFuncRegisterer) {
- reg.Register(KindGLightboxBlock, r.renderGLightbox)
-}
-
-func (r *GLightboxHTMLRenderer) renderGLightbox(w util.BufWriter, source []byte, n ast.Node, entering bool) (ast.WalkStatus, error) {
- if entering {
- gallery := n.(*GLightboxBlock)
-
- if len(gallery.Images) == 0 {
- return ast.WalkContinue, nil
- }
-
- galleryID := generateDivId(8)
-
- var elements []string
- for i, img := range gallery.Images {
- imageUrlSegments := strings.Split(img.URL, ".")
- imageUrlWithoutExt := strings.Join(imageUrlSegments[:len(imageUrlSegments)-1], ".")
- imageUrlParts := strings.Split(imageUrlWithoutExt, "/")
- imageNameParts := strings.Split(imageUrlParts[len(imageUrlParts)-1], "-")
-
- var captionBuf bytes.Buffer
- captionHTML := img.Caption
- if err := r.md.Convert(img.Caption, &captionBuf); err == nil {
- captionHTML = captionBuf.Bytes()
- captionHTML = bytes.TrimPrefix(captionHTML, []byte("<p>"))
- captionHTML = bytes.TrimSuffix(captionHTML, []byte("</p>\n"))
- captionHTML = bytes.TrimSuffix(captionHTML, []byte("</p>"))
- }
-
- dayDate, _ := time.Parse("20060102 150405", imageNameParts[len(imageNameParts)-2]+" "+imageNameParts[len(imageNameParts)-1])
- dayDate = dayDate.In(gallery.Location)
-
- glightboxDescId := ""
- if len(captionHTML) != 0 {
- glightboxDescId = fmt.Sprintf("glightbox-desc-%s-%d", galleryID, i)
- }
-
- dataDescriptionAttribute := ""
- if glightboxDescId != "" {
- dataDescriptionAttribute = fmt.Sprintf("data-description=\".%s\"", glightboxDescId)
- }
-
- elements = append(elements, fmt.Sprintf(`
- <a href="https://f003.backblazeb2.com/file/sayana-photos/full/%s" class="glightbox-%s grid-item grid-item-%s"
- data-gallery="gallery-%s" data-title="%s" %s>
- <img src="https://f003.backblazeb2.com/file/sayana-photos/webp-320p/%s.webp" class="rounded-md p-0.5" alt="webp thumbnail" />
- </a>`, img.URL, galleryID, galleryID, galleryID, dayDate.Format("2006-01-02 15:04:05 -07:00"), dataDescriptionAttribute, imageUrlWithoutExt))
-
- if glightboxDescId != "" {
- elements = append(elements, fmt.Sprintf(`
- <div class="glightbox-desc rounded-4 %s">
- <p>%s</p>
- </div>`, glightboxDescId, captionHTML))
- }
- }
-
- w.WriteString(fmt.Sprintf(`
-<div class="justify-content-center display-block m-1">
- <hr class="border-t-3 border-dotted border-main-dark mt-1 mb-2 w-[80%%] ml-auto mr-auto">
- <div class="grid masonry-grid-%s">
- <div class="grid-sizer grid-sizer-%s"></div>
- %s
- </div>
- <hr class="border-t-3 border-dotted border-main-dark mt-1 mb-2 w-[80%%] ml-auto mr-auto">
-</div>`, galleryID, galleryID, strings.Join(elements, "\n")))
-
- w.WriteString(fmt.Sprintf(`
-<script>
- var lightbox_%s = GLightbox({
- selector: '.glightbox-%s'
- });
-
- var msnry_%s = new Masonry('.masonry-grid-%s', {
- itemSelector: '.grid-item-%s',
- columnWidth: '.grid-sizer-%s',
- percentPosition: true
- });
-
- imagesLoaded('.masonry-grid-%s', function() {
- msnry_%s.layout();
- });
-</script>`, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID, galleryID))
- }
-
- return ast.WalkContinue, nil
-}
-
-func generateDivId(length int) string {
- const charset = "abcdefghijklmnopqrstuvwxyz"
- seededRand := rand.New(rand.NewSource(time.Now().UnixNano())) // Seed with current time
- b := make([]byte, length)
- for i := range b {
- b[i] = charset[seededRand.Intn(len(charset))]
- }
- return string(b)
-}
diff --git a/internal/lightgallery/block.go b/internal/lightgallery/block.go
new file mode 100644
index 0000000..8eb7c9e
--- /dev/null
+++ b/internal/lightgallery/block.go
@@ -0,0 +1,31 @@
+package lightgallery
+
+import (
+ "time"
+
+ "github.com/yuin/goldmark/ast"
+)
+
+// LightGalleryBlock represents a light gallery block in the AST
+type LightGalleryBlock struct {
+ ast.BaseBlock
+ Images []LightGalleryImage
+ Location *time.Location
+}
+
+type LightGalleryImage struct {
+ URL string
+ Caption []byte
+}
+
+var KindLightGalleryBlock = ast.NewNodeKind("LightGalleryBlock")
+
+// Dump implements ast.Node.Dump
+func (n *LightGalleryBlock) Dump(source []byte, level int) {
+ ast.DumpHelper(n, source, level, nil, nil)
+}
+
+// Kind implements ast.Node.Kind
+func (n *LightGalleryBlock) Kind() ast.NodeKind {
+ return KindLightGalleryBlock
+}
diff --git a/internal/glightbox/extension.go b/internal/lightgallery/extension.go
index 7fd17b1..761dc05 100644
--- a/internal/glightbox/extension.go
+++ b/internal/lightgallery/extension.go
@@ -1,4 +1,4 @@
-package glightbox
+package lightgallery
import (
"github.com/yuin/goldmark"
@@ -8,21 +8,21 @@ import (
)
// Extension that combines parser and renderer
-type GLightboxExtension struct{}
+type LightGalleryExtension struct{}
-func NewGLightboxExtension() goldmark.Extender {
- return &GLightboxExtension{}
+func NewLightGalleryExtension() goldmark.Extender {
+ return &LightGalleryExtension{}
}
-func (e *GLightboxExtension) Extend(m goldmark.Markdown) {
+func (e *LightGalleryExtension) Extend(m goldmark.Markdown) {
m.Parser().AddOptions(
parser.WithBlockParsers(
- util.Prioritized(NewGLightboxParser(), 500),
+ util.Prioritized(NewLightGalleryParser(), 500),
),
)
m.Renderer().AddOptions(
renderer.WithNodeRenderers(
- util.Prioritized(NewGLightboxHTMLRenderer(), 500),
+ util.Prioritized(NewLightGalleryHTMLRenderer(), 500),
),
)
}
diff --git a/internal/lightgallery/html_renderer.go b/internal/lightgallery/html_renderer.go
new file mode 100644
index 0000000..c2f785e
--- /dev/null
+++ b/internal/lightgallery/html_renderer.go
@@ -0,0 +1,145 @@
+package lightgallery
+
+import (
+ "bytes"
+ "fmt"
+ "math/rand"
+ "strings"
+ "time"
+
+ "github.com/yuin/goldmark"
+ "github.com/yuin/goldmark/ast"
+ "github.com/yuin/goldmark/renderer"
+ "github.com/yuin/goldmark/renderer/html"
+ "github.com/yuin/goldmark/util"
+)
+
+type LightGalleryHTMLRenderer struct {
+ html.Config
+ md goldmark.Markdown
+}
+
+func NewLightGalleryHTMLRenderer(opts ...html.Option) renderer.NodeRenderer {
+ r := &LightGalleryHTMLRenderer{
+ Config: html.NewConfig(),
+ md: goldmark.New(
+ goldmark.WithRendererOptions(
+ html.WithHardWraps(),
+ html.WithXHTML(),
+ ),
+ ),
+ }
+ for _, opt := range opts {
+ opt.SetHTMLOption(&r.Config)
+ }
+ return r
+}
+
+func (r *LightGalleryHTMLRenderer) RegisterFuncs(reg renderer.NodeRendererFuncRegisterer) {
+ reg.Register(KindLightGalleryBlock, r.renderLightGallery)
+}
+
+func (r *LightGalleryHTMLRenderer) renderLightGallery(w util.BufWriter, source []byte, n ast.Node, entering bool) (ast.WalkStatus, error) {
+ if entering {
+ gallery := n.(*LightGalleryBlock)
+
+ if len(gallery.Images) == 0 {
+ return ast.WalkContinue, nil
+ }
+
+ galleryID := generateDivId(8)
+
+ w.WriteString(fmt.Sprintf(`
+<div class="justify-content-center display-block m-1">
+ <hr class="border-t-3 border-dotted border-main-dark mt-1 mb-2 w-[80%%] ml-auto mr-auto">
+ <div id="lg-%s" class="inline-gallery-container relative ml-auto mr-auto"></div>
+ <hr class="border-t-3 border-dotted border-main-dark mt-1 mb-2 w-[80%%] ml-auto mr-auto">
+</div>`, galleryID))
+
+ var dynamicElements []string
+ for _, img := range gallery.Images {
+ imageUrlSegments := strings.Split(img.URL, ".")
+ imageUrlWithoutExt := strings.Join(imageUrlSegments[:len(imageUrlSegments)-1], ".")
+ imageUrlParts := strings.Split(imageUrlWithoutExt, "/")
+ imageNameParts := strings.Split(imageUrlParts[len(imageUrlParts)-1], "-")
+
+ var captionBuf bytes.Buffer
+ captionHTML := img.Caption
+ if err := r.md.Convert(img.Caption, &captionBuf); err == nil {
+ captionHTML = captionBuf.Bytes()
+ captionHTML = bytes.TrimPrefix(captionHTML, []byte("<p>"))
+ captionHTML = bytes.TrimSuffix(captionHTML, []byte("</p>\n"))
+ captionHTML = bytes.TrimSuffix(captionHTML, []byte("</p>"))
+ }
+
+ dayDate, _ := time.Parse("20060102 150405", imageNameParts[len(imageNameParts)-2]+" "+imageNameParts[len(imageNameParts)-1])
+ dayDate = dayDate.In(gallery.Location)
+ dynamicElements = append(dynamicElements, fmt.Sprintf(`{
+ src:
+ "https://f003.backblazeb2.com/file/sayana-photos/full/%s",
+ downloadUrl:
+ "https://f003.backblazeb2.com/file/sayana-photos/full/%s",
+ alt: "%s",
+ responsive: "https://f003.backblazeb2.com/file/sayana-photos/webp-320p/%s.webp 384, https://f003.backblazeb2.com/file/sayana-photos/webp-560p/%s.webp 672, https://f003.backblazeb2.com/file/sayana-photos/webp-800p/%s.webp 960, https://f003.backblazeb2.com/file/sayana-photos/webp-1200p/%s.webp 1440, https://f003.backblazeb2.com/file/sayana-photos/webp-1600p/%s.webp 1920",
+ thumb:
+ "https://f003.backblazeb2.com/file/sayana-photos/webp-320p/%s.webp",
+ subHtml: `+"`"+`<div class="flex flex-row light-gallery-captions">
+ <p class="grow !text-base/[1] text-left font-spectral text-main-dark">%s</p>
+ <p class="!text-base/[1] text-right font-spectral text-secondary">%s</p>
+ </div>`+"`"+`
+ }`, img.URL, img.URL, util.EscapeHTML(captionHTML), imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, imageUrlWithoutExt, captionHTML, dayDate.Format("2006-01-02 15:04:05 -07:00")))
+ }
+
+ w.WriteString(fmt.Sprintf(`
+<script>
+function createLightGallery%s() {
+ const $lgContainer = document.getElementById('lg-%s');
+ const config = {
+ container: $lgContainer,
+ dynamic: true,
+ dynamicEl: [%s],
+ width: "100%%",
+ height: "50vmin",
+ hash: false,
+ closable: false,
+ showMaximizeIcon: true,
+ appendSubHtmlTo: ".lg-sub-html",
+ isMobile: () => false,
+ slideDelay: 0,
+ plugins: [lgZoom, lgThumbnail],
+ thumbWidth: calculateVmin(10),
+ thumbHeight: "10vmin",
+ thumbMargin: 4
+ };
+ const inlineGallery = lightGallery($lgContainer, config);
+
+ setTimeout(() => {
+ inlineGallery.openGallery();
+ }, 200);
+
+ galleryMap.set(inlineGallery, createLightGallery%s);
+}
+
+document.addEventListener('htmx:afterRequest', (e) => {
+ if (e.detail.xhr.status == 404 || e.detail.successful != true) {
+ return console.error(e);
+ }
+ if (e.detail.target.id == 'general-page-body') {
+ createLightGallery%s();
+ }
+}, {once: true});
+</script>`, galleryID, galleryID, strings.Join(dynamicElements, ","), galleryID, galleryID))
+ }
+
+ return ast.WalkContinue, nil
+}
+
+func generateDivId(length int) string {
+ const charset = "abcdefghijklmnopqrstuvwxyz"
+ seededRand := rand.New(rand.NewSource(time.Now().UnixNano())) // Seed with current time
+ b := make([]byte, length)
+ for i := range b {
+ b[i] = charset[seededRand.Intn(len(charset))]
+ }
+ return string(b)
+}
diff --git a/internal/glightbox/parser.go b/internal/lightgallery/parser.go
index ba3f22e..daec797 100644
--- a/internal/glightbox/parser.go
+++ b/internal/lightgallery/parser.go
@@ -1,4 +1,4 @@
-package glightbox
+package lightgallery
import (
"bytes"
@@ -11,17 +11,17 @@ import (
"github.com/yuin/goldmark/text"
)
-type GLightboxParser struct{}
+type LightGalleryParser struct{}
-func NewGLightboxParser() parser.BlockParser {
- return &GLightboxParser{}
+func NewLightGalleryParser() parser.BlockParser {
+ return &LightGalleryParser{}
}
-func (p *GLightboxParser) Trigger() []byte {
+func (p *LightGalleryParser) Trigger() []byte {
return []byte{'{'}
}
-func (p *GLightboxParser) Open(parent ast.Node, reader text.Reader, pc parser.Context) (ast.Node, parser.State) {
+func (p *LightGalleryParser) Open(parent ast.Node, reader text.Reader, pc parser.Context) (ast.Node, parser.State) {
line, _ := reader.PeekLine()
if !bytes.HasPrefix(line, []byte("{Gallery:")) {
@@ -43,10 +43,10 @@ func (p *GLightboxParser) Open(parent ast.Node, reader text.Reader, pc parser.Co
return nil, parser.NoChildren
}
- return &GLightboxBlock{Location: loc}, parser.NoChildren
+ return &LightGalleryBlock{Location: loc}, parser.NoChildren
}
-func (p *GLightboxParser) Continue(node ast.Node, reader text.Reader, pc parser.Context) parser.State {
+func (p *LightGalleryParser) Continue(node ast.Node, reader text.Reader, pc parser.Context) parser.State {
line, segment := reader.PeekLine()
if len(line) == 0 || segment.Len() == 0 {
return parser.Continue | parser.NoChildren
@@ -58,7 +58,7 @@ func (p *GLightboxParser) Continue(node ast.Node, reader text.Reader, pc parser.
return parser.Close
}
- gallery := node.(*GLightboxBlock)
+ gallery := node.(*LightGalleryBlock)
parts := bytes.SplitN(trimmed, []byte{'|'}, 2)
url := bytes.TrimSpace(parts[0])
@@ -68,7 +68,7 @@ func (p *GLightboxParser) Continue(node ast.Node, reader text.Reader, pc parser.
caption = bytes.TrimSpace(parts[1])
}
- gallery.Images = append(gallery.Images, GLightboxImage{
+ gallery.Images = append(gallery.Images, LightGalleryImage{
URL: string(url),
Caption: caption,
})
@@ -76,13 +76,13 @@ func (p *GLightboxParser) Continue(node ast.Node, reader text.Reader, pc parser.
return parser.Continue | parser.NoChildren
}
-func (p *GLightboxParser) Close(node ast.Node, reader text.Reader, pc parser.Context) {
+func (p *LightGalleryParser) Close(node ast.Node, reader text.Reader, pc parser.Context) {
}
-func (p *GLightboxParser) CanInterruptParagraph() bool {
+func (p *LightGalleryParser) CanInterruptParagraph() bool {
return true
}
-func (p *GLightboxParser) CanAcceptIndentedLine() bool {
+func (p *LightGalleryParser) CanAcceptIndentedLine() bool {
return false
}
diff --git a/main.go b/main.go
index 53dbb74..20e90f4 100644
--- a/main.go
+++ b/main.go
@@ -12,7 +12,7 @@ import (
"github.com/SayaAndy/saya-today-web/config"
"github.com/SayaAndy/saya-today-web/internal/b2"
"github.com/SayaAndy/saya-today-web/internal/factgiver"
- "github.com/SayaAndy/saya-today-web/internal/glightbox"
+ "github.com/SayaAndy/saya-today-web/internal/lightgallery"
"github.com/SayaAndy/saya-today-web/internal/router"
"github.com/SayaAndy/saya-today-web/internal/tailwind"
"github.com/SayaAndy/saya-today-web/locale"
@@ -32,7 +32,7 @@ import (
var (
md = goldmark.New(
goldmark.WithExtensions(
- glightbox.NewGLightboxExtension(),
+ lightgallery.NewLightGalleryExtension(),
tailwind.NewTailwindExtension(),
),
goldmark.WithParserOptions(
diff --git a/static/input.css b/static/input.css
index 36d17b2..51c3c30 100644
--- a/static/input.css
+++ b/static/input.css
@@ -247,6 +247,10 @@ a:hover {
background-size: calc(var(--squares-and-triangles-background-width-coef) * 1vw) calc(var(--squares-and-triangles-background-height-coef) * 1vw);
}
+body:has(.lg-container:not([class~="lg-inline"])) #sidebar {
+ display: none !important;
+}
+
.logo-custom {
width: 3.5vw;
height: 20vw;
@@ -342,25 +346,142 @@ a:hover {
transform: scale(1.1);
}
-.grid-item, .grid-sizer {
- width: 50%;
+.lg-backdrop {
+ background-color: var(--background-light-color);
+ opacity: 0.8 !important;
+}
+
+.lg-container:not([class~="lg-inline"]) .lg-outer {
+ width: 90%;
+ height: 90%;
+ margin: 5dvh 5dvw;
+}
+
+.lg-thumb-outer {
+ background-color: var(--background-light-color) !important;
+ opacity: 0.8 !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-container:not([class~="lg-inline"]) .lg-counter {
+ font-size: 2vmax;
+ height: 2vmax;
+}
+
+.lg-content {
+ top: 2.5vmax !important;
+ bottom: calc(10vmin + 5vmax) !important;
+}
+
+.lg-outer[class~="lg-single-item"] .lg-content {
+ bottom: 5vmax !important;
+}
+
+.lg-thumb-item {
+ width: 10vmin !important;
+ height: 10vmin !important;
+}
+
+.lg-container:not([class~="lg-inline"]) .lg-content {
+ top: 4vmax !important;
+}
+
+.lg-toolbar .lg-icon,
+.lg-content .lg-icon {
+ padding: 0 0.7vmax;
+ font-size: 1.5vmax !important;
+ height: 1.5vmax;
+ width: auto;
+ color: var(--main-dark-color);
+}
+
+.lg-container:not([class~="lg-inline"]) .lg-toolbar .lg-icon,
+.lg-container:not([class~="lg-inline"]) .lg-content .lg-icon {
+ font-size: 3vmax !important;
+ height: 3vmax;
+}
+
+.lg-prev {
+ left: 0 !important;
+}
+
+.lg-next {
+ right: 0 !important;
}
-@media (width >= 32rem) {
- .grid-item, .grid-sizer {
- width: 33%;
+.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: 70vmin;
+}
+
+.light-gallery-captions {
+ p {
+ transform: translate3d(0, 0, 0px);
+ transition-delay: 500ms;
+ opacity: 1;
}
}
-@media (width >= 40rem) {
- .grid-item, .grid-sizer {
- width: 25%;
+.lg-slide-progress {
+ .light-gallery-captions {
+ h4 {
+ transform: translate3d(-60px, 0, 0px);
+ }
+
+ p {
+ transform: translate3d(60px, 0, 0px);
+ }
+
+ h4,
+ p {
+ opacity: 0;
+ }
}
}
-@media (width >= 48rem) {
- .grid-item, .grid-sizer {
- width: 20%;
+.lg-current {
+ &.lg-slide-progress {
+ .light-gallery-captions {
+
+ h4,
+ p {
+ transition-delay: 0ms;
+ }
+ }
}
}
@@ -414,8 +535,8 @@ body[data-theme~="ram"] .leaflet-tile {
background-size: calc(var(--squares-and-triangles-background-width-coef) * 1.6vh) calc(var(--squares-and-triangles-background-height-coef) * 1.6vh);
}
- .ar-lt-0\.8\:bg-background-light {
- background-color: var(--background-light-color);
+ .inline-gallery-container {
+ width: 100%;
}
.logo-custom {
diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html
index 88c5de5..5d84649 100644
--- a/views/layouts/general-page.html
+++ b/views/layouts/general-page.html
@@ -7,8 +7,10 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&family=Patua+One&display=swap" rel="stylesheet">
+ <link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/css/lightgallery.min.css">
+ <link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/css/lg-zoom.min.css">
+ <link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/css/lg-thumbnail.min.css">
<link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.css">
- <link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/glightbox/3.3.0/css/glightbox.min.css">
<link href="/output.css" rel="stylesheet">
</head>
@@ -24,8 +26,6 @@
};
</script>
- <script src="https://f003.backblazeb2.com/file/sayana-static/libs/glightbox/3.3.0/js/glightbox.min.js"></script>
-
<script>
function sfc32(a, b, c, d) {
return function() {
@@ -208,9 +208,10 @@
</div>
<script src="https://f003.backblazeb2.com/file/sayana-static/libs/htmx/2.0.6/htmx.min.js"></script>
+ <script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/lightgallery.min.js"></script>
+ <script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/plugins/lg-zoom.min.js"></script>
+ <script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/plugins/lg-thumbnail.min.js"></script>
<script src="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.js"></script>
- <script src="https://f003.backblazeb2.com/file/sayana-static/libs/imagesloaded/5.0.0/imagesloaded.pkgd.min.js"></script>
- <script src="https://f003.backblazeb2.com/file/sayana-static/libs/masonry-layout/4.2.2/masonry.pkgd.min.js"></script>
<div id="general-page-bottom-embeds" class="flex"
hx-get="/api/v1/general-page/bottom-embeds{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="load" hx-target="this" hx-swap="innerHTML">
diff --git a/views/pages/blog-catalogue.html b/views/pages/blog-catalogue.html
index 05a7bc5..faa6588 100644
--- a/views/pages/blog-catalogue.html
+++ b/views/pages/blog-catalogue.html
@@ -1,7 +1,7 @@
{{ define "body" }}
<div class="flex flex-row ar-lt-0.8:flex-col text-base h-[100%]">
<form hx-get="/api/v1/blog-search" hx-vals='{"lang": "{{ .Lang }}"}' hx-target=".blog-cards" hx-swap="innerHTML"
- class="tags-list ar-gt-0.8:min-w-[10dvh] ar-gt-0.8:max-w-[20dvh] ar-gt-0.8:w-fit ar-lt-0.8:w-[100%] ar-lt-0.8:max-h-[30%] flex shrink-0 flex-col ar-gt-0.8:mr-6 bg-background-dark ar-lt-0.8:bg-background-light inset-shadow">
+ class="tags-list ar-gt-0.8:min-w-[10dvh] ar-gt-0.8:max-w-[20dvh] ar-gt-0.8:w-fit ar-lt-0.8:w-[100%] ar-lt-0.8:max-h-[30%] flex shrink-0 flex-col ar-gt-0.8:mr-6 bg-background-light inset-shadow">
<div class="flex flex-col overflow-y-auto">
<fieldset>
<legend class="font-bold w-[100%] text-center">{{ .L.BlogSearch.TagsHeader }}</legend>