Improved anime editing sidebar icons

This commit is contained in:
2019-03-11 10:19:08 +09:00
parent 7adf038729
commit 997694d7df
5 changed files with 34 additions and 40 deletions
images/icons
layout/sidebar
pages
anime/editanime
editor

@ -9,13 +9,13 @@ component Sidebar(searchTerm string, user *arn.User)
img.user-image.lazy(src=utils.EmptyImage(), data-src="/images/brand/64.png", data-webp="true", alt="Anime Notifier")
if user != nil
a.badge.left-badge(href="/settings", title="Settings")
a.badge.sidebar-badge.left-badge(href="/settings", title="Settings")
RawIcon("cog")
a#notification-icon.badge.right-badge(href="/notifications", title="Notifications")
a#notification-icon.badge.sidebar-badge.right-badge(href="/notifications", title="Notifications")
RawIcon("bell")
a#notification-count.badge.right-badge.badge-important.hidden(href="/notifications", title="Notifications") 0
a#notification-count.badge.sidebar-badge.right-badge.badge-important.hidden(href="/notifications", title="Notifications") 0
//- Search
div(aria-label="Search")

@ -70,11 +70,8 @@ const sidebar-spacing-y = 0.7rem
horizontal
justify-content center
align-items center
position absolute
top 50%
background reverse-light-color
border-radius 50%
transform translateY(-50%)
padding 0.5rem
color text-color
width 30px
@ -84,6 +81,11 @@ const sidebar-spacing-y = 0.7rem
color text-color
background reverse-light-hover-color
.sidebar-badge
position absolute
top 50%
transform translateY(-50%)
:active
transform translateY(-50%) translateY(3px)