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