forked from
tangled.org/core
Mirror of @tangled.org/core. Running on a Raspberry Pi Zero 2 (Please be gentle).
blog: minor style updates
no bg around footer, move author avatars to the right on index etc.
Signed-off-by: oppiliappan <me@oppi.li>
+41
-19
+5
-7
blog/blog.go
+5
-7
blog/blog.go
···
76
76
77
77
rctx := &markup.RenderContext{
78
78
RendererType: markup.RendererTypeDefault,
79
-
Sanitizer: markup.NewSanitizer(),
80
79
}
81
80
var posts []Post
82
81
for _, entry := range entries {
···
99
100
}
100
101
101
102
htmlStr := rctx.RenderMarkdownWith(string(rest), markup.NewMarkdownWith("", textension.Dashes))
102
-
sanitized := rctx.SanitizeDefault(htmlStr)
103
103
104
104
posts = append(posts, Post{
105
105
Meta: meta,
106
-
Body: template.HTML(sanitized),
106
+
Body: template.HTML(htmlStr),
107
107
})
108
108
}
109
109
···
124
126
for _, p := range posts {
125
127
postURL := strings.TrimRight(baseURL, "/") + "/" + p.Meta.Slug
126
128
127
-
var authorName string
129
+
var authorName strings.Builder
128
130
for i, a := range p.Meta.Authors {
129
131
if i > 0 {
130
-
authorName += " & "
132
+
authorName.WriteString(" & ")
131
133
}
132
-
authorName += a.Name
134
+
authorName.WriteString(a.Name)
133
135
}
134
136
135
137
feed.Items = append(feed.Items, &feeds.Item{
136
138
Title: p.Meta.Title,
137
139
Link: &feeds.Link{Href: postURL},
138
140
Description: p.Meta.Subtitle,
139
-
Author: &feeds.Author{Name: authorName},
141
+
Author: &feeds.Author{Name: authorName.String()},
140
142
Created: p.ParsedDate(),
141
143
})
142
144
}
+35
-11
blog/templates/index.html
+35
-11
blog/templates/index.html
···
10
10
11
11
{{ define "topbarLayout" }}
12
12
<header class="max-w-screen-xl mx-auto w-full" style="z-index: 20;">
13
-
{{ template "layouts/fragments/topbar" . }}
13
+
<nav class="mx-auto space-x-4 px-6 py-2">
14
+
<div class="flex justify-between p-0 items-center">
15
+
<div id="left-items">
16
+
<a href="/" hx-boost="true" class="text-2xl no-underline hover:no-underline flex items-center gap-2">
17
+
{{ template "fragments/logotypeSmall" }}
18
+
</a>
19
+
</div>
20
+
21
+
<div id="right-items" class="flex items-center gap-4">
22
+
<a href="https://tangled.org/login">login</a>
23
+
<span class="text-gray-500 dark:text-gray-400">or</span>
24
+
<a href="https://tangled.org/signup" class="btn-create py-0 hover:no-underline hover:text-white flex items-center gap-2">
25
+
join now {{ i "arrow-right" "size-4" }}
26
+
</a>
27
+
</div>
28
+
</div>
29
+
</nav>
14
30
</header>
15
31
{{ end }}
16
32
···
42
26
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6 mb-14">
43
27
{{ range .Featured }}
44
28
<a href="/{{ .Meta.Slug }}" class="no-underline hover:no-underline group flex flex-col bg-white dark:bg-gray-800 rounded border border-gray-200 dark:border-gray-700 overflow-hidden hover:bg-gray-100/25 hover:dark:bg-gray-700/25 transition-colors">
45
-
<div class="aspect-[16/9] overflow-hidden bg-gray-100 dark:bg-gray-700">
29
+
<div class="overflow-hidden bg-gray-100 dark:bg-gray-700 md:h-48">
46
30
<img src="{{ .Meta.Image }}" alt="{{ .Meta.Title }}" class="w-full h-full object-cover group-hover:scale-[1.02] transition-transform duration-300" />
47
31
</div>
48
32
<div class="flex flex-col flex-1 px-5 py-4">
···
50
34
{{ $date := .ParsedDate }}{{ $date | shortTimeFmt}}
51
35
{{ if .Meta.Draft }}<span class="text-red-500">[draft]</span>{{ end }}
52
36
</div>
53
-
<h2 class="font-bold text-gray-900 dark:text-white text-base leading-snug mb-1 group-hover:underline">{{ .Meta.Title }}</h2>
37
+
<h2 class="font-bold text-gray-900 dark:text-white text-base leading-snug mb-1">{{ .Meta.Title }}</h2>
54
38
<p class="text-sm text-gray-500 dark:text-gray-400 line-clamp-2 flex-1">{{ .Meta.Subtitle }}</p>
55
-
<div class="flex items-center mt-4">
39
+
<div class="flex items-center mt-4 gap-2">
56
40
{{ $hasAvatar := false }}{{ range .Meta.Authors }}{{ if tinyAvatar .Handle }}{{ $hasAvatar = true }}{{ end }}{{ end }}
57
41
{{ if $hasAvatar }}
58
42
<div class="inline-flex items-center -space-x-2">
59
43
{{ range .Meta.Authors }}
60
-
{{ $av := tinyAvatar .Handle }}{{ if $av }}<img src="{{ $av }}" class="size-6 rounded-full border border-gray-300 dark:border-gray-700" alt="{{ .Name }}" title="{{ .Name }}" />{{ end }}
44
+
{{ $av := tinyAvatar .Handle }}{{ if $av }}<img src="{{ $av }}" class="size-6 rounded-full border border-gray-300 dark:border-gray-700" alt="{{ .Name }}" title="{{ .Name }}" />{{ end }}
61
45
{{ end }}
62
46
</div>
63
47
{{ end }}
48
+
<div class="text-xs">
49
+
{{ $last := sub (len .Meta.Authors) 1 }}
50
+
{{ range $i, $n := .Meta.Authors }}
51
+
{{ $n.Handle }}{{ if ne $i $last }}, {{ end }}
52
+
{{ end }}
53
+
</div>
64
54
</div>
65
55
</div>
66
56
</a>
···
78
56
{{ range .Posts }}
79
57
<a href="/{{ .Meta.Slug }}" class="no-underline hover:no-underline group flex items-center justify-between gap-4 px-6 py-3 hover:bg-gray-100/25 hover:dark:bg-gray-700/25 transition-colors">
80
58
<div class="flex items-center gap-3 min-w-0">
59
+
<span class="font-medium text-gray-900 dark:text-white truncate">
60
+
{{ .Meta.Title }}
61
+
{{ if .Meta.Draft }}<span class="text-red-500 text-xs font-normal ml-1">[draft]</span>{{ end }}
62
+
</span>
63
+
</div>
64
+
<div class="flex items-center gap-2">
81
65
<div class="inline-flex items-center -space-x-2 shrink-0">
82
66
{{ range .Meta.Authors }}
83
67
<img src="{{ tinyAvatar .Handle }}" class="size-5 rounded-full border border-gray-300 dark:border-gray-700" alt="{{ .Name }}" title="{{ .Name }}" />
84
68
{{ end }}
85
69
</div>
86
-
<span class="font-medium text-gray-900 dark:text-white group-hover:underline truncate">
87
-
{{ .Meta.Title }}
88
-
{{ if .Meta.Draft }}<span class="text-red-500 text-xs font-normal ml-1">[draft]</span>{{ end }}
89
-
</span>
90
-
</div>
91
-
<div class="text-sm text-gray-400 dark:text-gray-500 shrink-0">
70
+
<div class="text-sm text-gray-400 dark:text-gray-500 shrink-0">
92
71
{{ $date := .ParsedDate }}{{ $date | shortTimeFmt }}
72
+
</div>
93
73
</div>
94
74
</a>
95
75
{{ end }}