web/notify.moe
Code Issues Pull Requests Activity

Improved tooltips

Browse Source
This commit is contained in:
Eduard Urbach 2018-04-18 12:33:19 +02:00
parent 6e697dba98
commit 0913b18239
7 changed files with 12 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
pages/anime/character.pixy
View File

@ -5,7 +5,5 @@ component Character(character *arn.Character)
.image-title-text= character.Name.Canonical
component CharacterSmall(character *arn.Character)
a.character(href="/character/" + character.ID)
a.character.tip(href="/character/" + character.ID, aria-label=character.Name.Canonical)
img.character-image.character-image-small.lazy(data-src=character.ImageLink("small"), data-webp="true", data-color=character.AverageColor(), alt=character.Name.Canonical)
.image-title
.image-title-text= character.Name.Canonical

2
pages/anime/relations.pixy
View File

@ -11,7 +11,7 @@ component AnimeRelations(anime *arn.Anime, user *arn.User, standAlonePage bool)
.anime-relations
each relation in anime.Relations().Items
if relation.Anime() != nil
a.anime-relation.mountable(href=relation.Anime().Link(), title=relation.Anime().Title.ByUser(user), data-mountable-type="relation")
a.anime-relation.tip.mountable(href=relation.Anime().Link(), aria-label=relation.Anime().Title.ByUser(user), data-mountable-type="relation")
img.anime-relation-image.lazy(data-src=relation.Anime().ImageLink("small"), data-webp="true", data-color=relation.Anime().AverageColor(), alt=relation.Anime().Title.ByUser(user))
.anime-relation-type= relation.HumanReadableType()
.anime-relation-year

2
pages/search/search.pixy
View File

@ -64,7 +64,7 @@ component AnimeSearchResults(animes []*arn.Anime)
else
.profile-watching-list.anime-search
each anime in animes
a.profile-watching-list-item.mountable(href=anime.Link(), title=anime.Title.Canonical, data-mountable-type="anime")
a.profile-watching-list-item.tip.mountable(href=anime.Link(), aria-label=anime.Title.Canonical, data-mountable-type="anime")
img.anime-cover-image.anime-search-result.lazy(data-src=anime.ImageLink("small"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.Canonical)
component CharacterSearchResults(characters []*arn.Character)

2
scripts/Actions/Notifications.ts
View File

@ -18,6 +18,8 @@ export async function disableNotifications(arn: AnimeNotifier, button: HTMLEleme
// Test notification
export async function testNotification(arn: AnimeNotifier) {
arn.statusMessage.showInfo("Sending test notification...this might take a few seconds...")
await fetch("/api/test/notification", {
credentials: "same-origin"
})

3
scripts/DateView.ts
View File

@ -92,7 +92,8 @@ export function displayAiringDate(element: HTMLElement, now: Date) {
airingVerb = "aired"
}
element.title = "Episode " + element.dataset.episodeNumber + " " + airingVerb + " " + dayNames[startDate.getDay()] + " from " + startTime + " - " + endTime
element.setAttribute("aria-label", "Episode " + element.dataset.episodeNumber + " " + airingVerb + " " + dayNames[startDate.getDay()] + " from " + startTime + " - " + endTime)
element.classList.add("tip")
}
export function displayDate(element: HTMLElement, now: Date) {

6
styles/tip.scarlet
View File

@ -1,3 +1,5 @@
const tip-opacity = 0.94
.tip
position relative
@ -38,9 +40,9 @@
:hover
:before
opacity 1
opacity tip-opacity
transform translateX(-50%) translateY(calc(-100% - 10px))
:after
opacity 1
opacity tip-opacity
transform translateX(-50%) translateY(calc(-100% - 4px))

2
styles/widgets.scarlet
View File

@ -21,10 +21,8 @@
.widget
vertical
// flex-basis 100%
flex 1
margin calc(content-padding / 2)
overflow hidden
.widget-section
vertical