Monorepo for Tangled
tangled.org
1{{ define "focus/pill" }}
2 {{ if .Focusing }}
3 {{ $offFocus := and .FocusLink .CurrentPath (not (hasPrefix .CurrentPath .FocusLink)) }}
4 <div id="focus-border" class="ring-inset ring-4 ring-indigo-600 rounded-2xl fixed inset w-screen h-screen z-50 pointer-events-none
5 before:ring-inset before:ring-4 before:ring-indigo-600 before:fixed before:inset before:w-screen before:h-screen before:z-50 before:pointer-events-none"></div>
6 <div id="focus-pill" class="focus-pill fixed bottom-1 left-1/2 -translate-x-1/2 z-50 select-none">
7 {{ if $offFocus }}<a href="{{ .FocusLink }}" class="absolute inset-0 z-0 no-underline" aria-label="Return to focus"></a>{{ end }}
8 <div class="relative flex items-center gap-12 bg-indigo-600 text-sm text-white rounded-t-lg px-4 py-2">
9
10 <form method="POST" action="/focus/end" class="relative z-10 inline m-0">
11 <button type="submit" class="flex items-center gap-1 text-white hover:text-indigo-200 bg-transparent border-0 p-0 cursor-pointer text-sm">
12 {{ i "x" "size-4" }} Exit
13 </button>
14 </form>
15
16 {{ $remaining := sub .FocusCount 1 }}
17 {{ if $offFocus }}
18 <span class="flex items-center gap-2 whitespace-nowrap">
19 {{ i "route-off" "size-4 animate-pulse" }}
20 Off track
21 {{ if gt $remaining 0 }}
22 <span class="opacity-75">{{ $remaining }} remaining</span>
23 {{ end }}
24 </span>
25 {{ else }}
26 <span class="flex items-center gap-2 whitespace-nowrap">
27 {{ i "telescope" "size-4" }}
28 Focusing
29 {{ if gt $remaining 0 }}
30 <span class="opacity-75">{{ $remaining }} remaining</span>
31 {{ end }}
32 </span>
33 {{ end }}
34
35 {{ if $offFocus }}
36 <a href="{{ .FocusLink }}" class="flex items-center gap-1 text-white hover:text-indigo-200 no-underline hover:no-underline bg-transparent border-0 p-0 cursor-pointer text-sm">
37 Return {{ i "undo-2" "size-4" }}
38 </a>
39 {{ else }}
40 <form method="POST" action="/focus/next" class="inline m-0">
41 <input type="hidden" name="current_id" value="{{ .FocusNotificationID }}">
42 <button type="submit" class="flex items-center gap-1 text-white hover:text-indigo-200 bg-transparent border-0 p-0 cursor-pointer text-sm">
43 {{ if le .FocusCount 1 }}
44 {{ i "check" "size-4" }} Finish
45 {{ else }}
46 Next {{ i "arrow-right" "size-4" }}
47 {{ end }}
48 </button>
49 </form>
50 {{ end }}
51 </div>
52 </div>
53 {{ end }}
54{{ end }}