refactor: group episode nav with segment editor in watch toolbar
This commit is contained in:
@@ -53,7 +53,25 @@
|
|||||||
{{template "video_player" dict "WatchData" .WatchData "TotalEpisodes" $totalEpisodes}}
|
{{template "video_player" dict "WatchData" .WatchData "TotalEpisodes" $totalEpisodes}}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mt-3 flex justify-end" data-segment-editor-root>
|
<div class="mt-3 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div class="flex gap-2">
|
||||||
|
{{$prevEp := sub (int $currentEpID) 1}}
|
||||||
|
{{if ge $prevEp 1}}
|
||||||
|
<a href="/anime/{{$anime.MalID}}/watch?ep={{$prevEp}}" class="inline-flex items-center gap-2 px-4 py-2 bg-background-surface hover:bg-surface-hover text-sm text-foreground-muted leading-none transition-colors">
|
||||||
|
<svg class="block w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" /></svg>
|
||||||
|
Prev
|
||||||
|
</a>
|
||||||
|
{{end}}
|
||||||
|
{{$nextEp := add (int $currentEpID) 1}}
|
||||||
|
{{if le $nextEp $totalEpisodes}}
|
||||||
|
<a href="/anime/{{$anime.MalID}}/watch?ep={{$nextEp}}" class="inline-flex items-center gap-2 px-4 py-2 bg-background-surface hover:bg-surface-hover text-sm text-foreground-muted leading-none transition-colors">
|
||||||
|
Next
|
||||||
|
<svg class="block w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" /></svg>
|
||||||
|
</a>
|
||||||
|
{{end}}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex justify-end" data-segment-editor-root>
|
||||||
<div class="relative">
|
<div class="relative">
|
||||||
<button type="button" data-segment-editor-toggle class="inline-flex items-center gap-2 px-4 py-2 bg-background-surface hover:bg-surface-hover text-sm text-foreground-muted leading-none transition-colors ring-1 ring-border">
|
<button type="button" data-segment-editor-toggle class="inline-flex items-center gap-2 px-4 py-2 bg-background-surface hover:bg-surface-hover text-sm text-foreground-muted leading-none transition-colors ring-1 ring-border">
|
||||||
<svg class="block w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" /></svg>
|
<svg class="block w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" /></svg>
|
||||||
@@ -119,24 +137,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="flex items-center mt-4">
|
|
||||||
<div class="flex gap-2">
|
|
||||||
{{$prevEp := sub (int $currentEpID) 1}}
|
|
||||||
{{if ge $prevEp 1}}
|
|
||||||
<a href="/anime/{{$anime.MalID}}/watch?ep={{$prevEp}}" class="inline-flex items-center gap-2 px-4 py-2 bg-background-surface hover:bg-surface-hover text-sm text-foreground-muted leading-none transition-colors">
|
|
||||||
<svg class="block w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" /></svg>
|
|
||||||
Prev
|
|
||||||
</a>
|
|
||||||
{{end}}
|
|
||||||
{{$nextEp := add (int $currentEpID) 1}}
|
|
||||||
{{if le $nextEp $totalEpisodes}}
|
|
||||||
<a href="/anime/{{$anime.MalID}}/watch?ep={{$nextEp}}" class="inline-flex items-center gap-2 px-4 py-2 bg-background-surface hover:bg-surface-hover text-sm text-foreground-muted leading-none transition-colors">
|
|
||||||
Next
|
|
||||||
<svg class="block w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" /></svg>
|
|
||||||
</a>
|
|
||||||
{{end}}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user