Added basic design for arrows on desktop
This commit is contained in:
parent
ec9bd057ef
commit
ccfdd36ce4
@ -3,19 +3,23 @@ component AnimeEpisode(anime *arn.Anime, episode *arn.AnimeEpisode, user *arn.Us
|
|||||||
a(href=anime.Link())= anime.Title.ByUser(user)
|
a(href=anime.Link())= anime.Title.ByUser(user)
|
||||||
|
|
||||||
.episode-view-image-container
|
.episode-view-image-container
|
||||||
|
if episodeIndex > 0
|
||||||
|
.episode-arrow.episode-arrow-previous
|
||||||
|
a.button.tip(href=anime.Link() + "/episode/" + strconv.Itoa(anime.Episodes().Items[episodeIndex - 1].Number), aria-label="Previous episode")
|
||||||
|
Icon("chevron-left")
|
||||||
|
span= anime.Episodes().Items[episodeIndex - 1].Number
|
||||||
|
|
||||||
a(href=anime.Link(), title=anime.Title.ByUser(user))
|
a(href=anime.Link(), title=anime.Title.ByUser(user))
|
||||||
img.anime-cover-image.lazy(data-src=anime.ImageLink("large"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.ByUser(user))
|
img.anime-cover-image.lazy(data-src=anime.ImageLink("large"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.ByUser(user))
|
||||||
|
|
||||||
|
if episodeIndex < len(anime.Episodes().Items) - 1
|
||||||
|
.episode-arrow.episode-arrow-next
|
||||||
|
a.button.tip(href=anime.Link() + "/episode/" + strconv.Itoa(anime.Episodes().Items[episodeIndex + 1].Number), aria-label="Next episode")
|
||||||
|
Icon("chevron-right")
|
||||||
|
span= anime.Episodes().Items[episodeIndex + 1].Number
|
||||||
|
|
||||||
h3.episode-view-number= "Episode " + strconv.Itoa(episode.Number)
|
h3.episode-view-number= "Episode " + strconv.Itoa(episode.Number)
|
||||||
|
|
||||||
//- if episodeIndex > 0
|
|
||||||
//- a.button(href=anime.Link() + "/episode/" + strconv.Itoa(anime.Episodes().Items[episodeIndex - 1].Number))
|
|
||||||
//- Icon("chevron-left")
|
|
||||||
|
|
||||||
//- if episodeIndex < len(anime.Episodes().Items) - 1
|
|
||||||
//- a.button(href=anime.Link() + "/episode/" + strconv.Itoa(anime.Episodes().Items[episodeIndex + 1].Number))
|
|
||||||
//- Icon("chevron-right")
|
|
||||||
|
|
||||||
if episode.Title.Japanese != ""
|
if episode.Title.Japanese != ""
|
||||||
.episode-view-title
|
.episode-view-title
|
||||||
Japanese(episode.Title.Japanese)
|
Japanese(episode.Title.Japanese)
|
||||||
|
@ -14,4 +14,17 @@
|
|||||||
.episode-view-image-container
|
.episode-view-image-container
|
||||||
horizontal
|
horizontal
|
||||||
justify-content center
|
justify-content center
|
||||||
|
align-items center
|
||||||
|
position relative
|
||||||
|
height anime-image-large-height
|
||||||
margin-bottom content-padding
|
margin-bottom content-padding
|
||||||
|
|
||||||
|
.episode-arrow
|
||||||
|
position absolute
|
||||||
|
top 50%
|
||||||
|
|
||||||
|
.episode-arrow-previous
|
||||||
|
left 0
|
||||||
|
|
||||||
|
.episode-arrow-next
|
||||||
|
right 0
|
Loading…
Reference in New Issue
Block a user