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 dark:bg-gray-800 text-black dark:text-white 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 "arrow-right" "w-4 h-4" }}</a>
26 <p class="pt-5 px-10 text-sm text-gray-500 dark:text-gray-400">Join our IRC channel: <a href="https://web.libera.chat/#tangled"><code>#tangled</code> on Libera Chat</a>.
27 Read an introduction to Tangled <a href="https://blog.tangled.sh/intro">here</a>.</p>
28 </div>
29</div>
30{{ end }}
31
32{{ define "timeline" }}
33<div>
34 <div class="p-6">
35 <p class="text-xl font-bold dark:text-white">Timeline</p>
36 </div>
37
38 <div class="flex flex-col gap-3 relative">
39 <div class="absolute left-8 top-0 bottom-0 w-px bg-gray-300 dark:bg-gray-600"></div>
40 {{ range .Timeline }}
41 <div class="px-6 py-2 bg-white dark:bg-gray-800 rounded drop-shadow-sm w-fit">
42 {{ if .Repo }}
43 {{ $userHandle := index $.DidHandleMap .Repo.Did }}
44 <div class="flex items-center">
45 <p class="text-gray-600 dark:text-gray-300">
46 <a href="/{{ $userHandle }}" class="no-underline hover:underline">{{ $userHandle | truncateAt30 }}</a>
47 {{ if .Source }}
48 forked
49 <a href="/{{ index $.DidHandleMap .Source.Did }}/{{ .Source.Name }}" class="no-underline hover:underline">
50 {{ index $.DidHandleMap .Source.Did }}/{{ .Source.Name }}
51 </a>
52 to
53 <a href="/{{ $userHandle }}/{{ .Repo.Name }}" class="no-underline hover:underline">{{ .Repo.Name }}</a>
54 {{ else }}
55 created
56 <a href="/{{ $userHandle }}/{{ .Repo.Name }}" class="no-underline hover:underline">{{ .Repo.Name }}</a>
57 {{ end }}
58 <time class="text-gray-700 dark:text-gray-400 text-xs">{{ .Repo.Created | timeFmt }}</time>
59 </p>
60 </div>
61 {{ else if .Follow }}
62 {{ $userHandle := index $.DidHandleMap .Follow.UserDid }}
63 {{ $subjectHandle := index $.DidHandleMap .Follow.SubjectDid }}
64 <div class="flex items-center">
65 <p class="text-gray-600 dark:text-gray-300">
66 <a href="/{{ $userHandle }}" class="no-underline hover:underline">{{ $userHandle | truncateAt30 }}</a>
67 followed
68 <a href="/{{ $subjectHandle }}" class="no-underline hover:underline">{{ $subjectHandle | truncateAt30 }}</a>
69 <time class="text-gray-700 dark:text-gray-400 text-xs">{{ .Follow.FollowedAt | timeFmt }}</time>
70 </p>
71 </div>
72 {{ else if .Star }}
73 {{ $starrerHandle := index $.DidHandleMap .Star.StarredByDid }}
74 {{ $repoOwnerHandle := index $.DidHandleMap .Star.Repo.Did }}
75 <div class="flex items-center">
76 <p class="text-gray-600 dark:text-gray-300">
77 <a href="/{{ $starrerHandle }}" class="no-underline hover:underline">{{ $starrerHandle | truncateAt30 }}</a>
78 starred
79 <a href="/{{ $repoOwnerHandle }}/{{ .Star.Repo.Name }}" class="no-underline hover:underline">{{ $repoOwnerHandle | truncateAt30 }}/{{ .Star.Repo.Name }}</a>
80 <time class="text-gray-700 dark:text-gray-400 text-xs">{{ .Star.Created | timeFmt }}</time>
81 </p>
82 </div>
83 {{ end }}
84 </div>
85 {{ end }}
86 </div>
87</div>
88{{ end }}