66 lines
2.2 kB
1
{{ define "title" }}timeline{{ end }}
2
3
{{ define "topbar" }}
4
{{ with .LoggedInUser }}
5
{{ template "layouts/topbar" $ }}
6
{{ else }}
7
{{ end }}
8
{{ end }}
9
10
{{ define "content" }}
11
{{ with .LoggedInUser }}
12
{{ block "timeline" $ }} {{ end }}
13
{{ else }}
14
{{ block "hero" $ }} {{ end }}
15
{{ block "timeline" $ }} {{ end }}
16
{{ end }}
17
{{ end }}
18
19
{{ define "hero" }}
20
<div class="flex flex-col items-center justify-center text-center rounded drop-shadow bg-white text-black py-4 px-10">
21
<div class="font-bold italic text-4xl mb-4">
22
tangled
23
</div>
24
<div class="italic text-lg">
25
tightly-knit social coding, <a href="/login" class="underline inline-flex gap-1 items-center">join now <i data-lucide="arrow-right" class="w-4 h-4"></i></a>
26
</div>
27
</div>
28
{{ end }}
29
30
{{ define "timeline" }}
31
<div>
32
<div class="p-6">
33
<p class="text-xl font-bold">Timeline</p>
34
</div>
35
36
<div class="flex flex-col gap-3 relative">
37
<div class="absolute left-8 top-0 bottom-0 w-px bg-gray-300"></div>
38
{{ range .Timeline }}
39
<div class="px-6 py-2 bg-white rounded drop-shadow-sm w-fit">
40
{{ if .Repo }}
41
{{ $userHandle := index $.DidHandleMap .Repo.Did }}
42
<div class="flex items-center">
43
<p class="text-gray-600">
44
<a href="/{{ $userHandle }}" class="no-underline hover:underline">{{ $userHandle }}</a>
45
created
46
<a href="/{{ $userHandle }}/{{ .Repo.Name }}" class="no-underline hover:underline">{{ .Repo.Name }}</a>
47
<time class="text-gray-700">{{ .Repo.Created | timeFmt }}</time>
48
</p>
49
</div>
50
{{ else if .Follow }}
51
{{ $userHandle := index $.DidHandleMap .Follow.UserDid }}
52
{{ $subjectHandle := index $.DidHandleMap .Follow.SubjectDid }}
53
<div class="flex items-center">
54
<p class="text-gray-600">
55
<a href="/{{ $userHandle }}" class="no-underline hover:underline">{{ $userHandle }}</a>
56
followed
57
<a href="/{{ $subjectHandle }}" class="no-underline hover:underline">{{ $subjectHandle }}</a>
58
<time class="text-gray-700">{{ .Follow.FollowedAt | timeFmt }}</time>
59
</p>
60
</div>
61
{{ end }}
62
</div>
63
{{ end }}
64
</div>
65
</div>
66
{{ end }}
67