web/notify.moe
Code Issues Pull Requests Activity

Fixed opacity influence on tooltips

Browse Source
This commit is contained in:
Eduard Urbach 2018-04-18 14:34:33 +02:00
parent 2302dbad31
commit d25ad77715
8 changed files with 20 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pages/anime/episodes.pixy
View File

@ -22,7 +22,7 @@ component AnimeEpisodes(anime *arn.Anime, episodes []*arn.AnimeEpisode, user *ar
span - span -
if validate.DateTime(episode.AiringDate.Start) if validate.DateTime(episode.AiringDate.Start)
.episode-airing-date-start.utc-airing-date(data-start-date=episode.AiringDate.Start, data-end-date=episode.AiringDate.End, data-episode-number=episode.Number)= episode.AiringDate.StartDateHuman() .episode-airing-date-start.utc-airing-date.no-tip(data-start-date=episode.AiringDate.Start, data-end-date=episode.AiringDate.End, data-episode-number=episode.Number)= episode.AiringDate.StartDateHuman()
//- table.episodes //- table.episodes
//- tbody //- tbody

2
pages/animelist/animelist.scarlet
View File

@ -120,7 +120,7 @@
text-align right text-align right
flex-basis 150px flex-basis 150px
flex-shrink 1 flex-shrink 1
opacity 0.8 color hsla(text-color-h, text-color-s, text-color-l, 0.8)
justify-content flex-end justify-content flex-end
.anime-list-item-episodes .anime-list-item-episodes

4
pages/compare/animelist.pixy
View File

@ -56,9 +56,9 @@ component CompareAnimeList(a *arn.User, b *arn.User, countA int, countB int, com
if comparison.ItemA.Rating.Overall == comparison.ItemB.Rating.Overall if comparison.ItemA.Rating.Overall == comparison.ItemB.Rating.Overall
span.comparison-rating-equal= utils.FormatRating(comparison.ItemB.Rating.Overall) span.comparison-rating-equal= utils.FormatRating(comparison.ItemB.Rating.Overall)
else if comparison.ItemB.Rating.Overall > comparison.ItemA.Rating.Overall else if comparison.ItemB.Rating.Overall > comparison.ItemA.Rating.Overall
span.comparison-rating-higher(title=utils.FormatRating(comparison.ItemB.Rating.Overall))= "+" + utils.FormatRating(comparison.ItemB.Rating.Overall - comparison.ItemA.Rating.Overall) span.comparison-rating-higher.tip(aria-label=utils.FormatRating(comparison.ItemB.Rating.Overall))= "+" + utils.FormatRating(comparison.ItemB.Rating.Overall - comparison.ItemA.Rating.Overall)
else else
span.comparison-rating-lower(title=utils.FormatRating(comparison.ItemB.Rating.Overall))= "-" + utils.FormatRating(comparison.ItemA.Rating.Overall - comparison.ItemB.Rating.Overall) span.comparison-rating-lower.tip(aria-label=utils.FormatRating(comparison.ItemB.Rating.Overall))= "-" + utils.FormatRating(comparison.ItemA.Rating.Overall - comparison.ItemB.Rating.Overall)
else else
span= utils.FormatRating(comparison.ItemB.Rating.Overall) span= utils.FormatRating(comparison.ItemB.Rating.Overall)
else else

2
pages/episode/episode.scarlet
View File

@ -8,8 +8,8 @@
.episode-view-airing-date .episode-view-airing-date
text-align center text-align center
opacity 0.5
font-size 0.9rem font-size 0.9rem
half-opacity-text
.episode-view-image-container .episode-view-image-container
horizontal horizontal

2
scripts/Actions/Theme.ts
View File

@ -8,7 +8,7 @@ const dark = {
"hue": "45", "hue": "45",
"saturation": "100%", "saturation": "100%",
"text-color": "hsl(0, 0%, 90%)", "text-color-l": "90%",
"bg-color": "hsl(0, 0%, 18%)", "bg-color": "hsl(0, 0%, 18%)",
"link-color": "hsl(var(--hue), var(--saturation), 66%)", "link-color": "hsl(var(--hue), var(--saturation), 66%)",
"link-hover-color": "hsl(var(--hue), var(--saturation), 76%)", "link-hover-color": "hsl(var(--hue), var(--saturation), 76%)",

8
scripts/DateView.ts
View File

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

5
styles/include/config.scarlet
View File

@ -1,5 +1,8 @@
// Colors // Colors
text-color = rgb(60, 60, 60) text-color-h = 0
text-color-s = 0%
text-color-l = 23.5%
text-color = hsl(text-color-h, text-color-s, text-color-l)
bg-color = rgb(246, 246, 246) bg-color = rgb(246, 246, 246)
main-color = rgb(248, 165, 130) main-color = rgb(248, 165, 130)
link-color = rgb(215, 38, 15) link-color = rgb(215, 38, 15)

2
styles/mixins/half-opacity-text.scarlet Normal file
View File

@ -0,0 +1,2 @@
mixin half-opacity-text
color hsla(text-color-h, text-color-s, text-color-l, 0.5)