Updated sidebar interface
This commit is contained in:
parent
b77229595e
commit
84783c871c
@ -7,6 +7,13 @@ component Sidebar(user *arn.User)
|
|||||||
else
|
else
|
||||||
img.user-image.lazy(src=utils.EmptyImage(), data-src="/images/brand/64.png", data-webp="true", alt="Anime Notifier")
|
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.ajax(href="/settings")
|
||||||
|
RawIcon("cog")
|
||||||
|
|
||||||
|
a.badge.right-badge.ajax(href="/notifications")
|
||||||
|
RawIcon("bell")
|
||||||
|
|
||||||
//- Sidebar buttons
|
//- Sidebar buttons
|
||||||
if user != nil
|
if user != nil
|
||||||
SidebarButton("Home", "/animelist/watching", "home")
|
SidebarButton("Home", "/animelist/watching", "home")
|
||||||
@ -22,7 +29,7 @@ component Sidebar(user *arn.User)
|
|||||||
|
|
||||||
if user != nil
|
if user != nil
|
||||||
SidebarButton("Shop", "/shop", "shopping-cart")
|
SidebarButton("Shop", "/shop", "shopping-cart")
|
||||||
SidebarButton("Settings", "/settings", "cog")
|
//- SidebarButton("Settings", "/settings", "cog")
|
||||||
|
|
||||||
//- Disabled:
|
//- Disabled:
|
||||||
//- SidebarButton("Dash", "/dashboard", "tachometer")
|
//- SidebarButton("Dash", "/dashboard", "tachometer")
|
||||||
|
@ -21,6 +21,7 @@ sidebar-spacing-y = 0.7rem
|
|||||||
|
|
||||||
.user-image-container
|
.user-image-container
|
||||||
horizontal
|
horizontal
|
||||||
|
position relative
|
||||||
justify-content center
|
justify-content center
|
||||||
margin 0.8rem 0
|
margin 0.8rem 0
|
||||||
flex-shrink 0
|
flex-shrink 0
|
||||||
@ -64,3 +65,23 @@ sidebar-spacing-y = 0.7rem
|
|||||||
.icon
|
.icon
|
||||||
font-size 1rem
|
font-size 1rem
|
||||||
margin-right 0.75rem
|
margin-right 0.75rem
|
||||||
|
|
||||||
|
.badge
|
||||||
|
position absolute
|
||||||
|
top 50%
|
||||||
|
background reverse-light-color
|
||||||
|
border-radius 50%
|
||||||
|
transform translateY(-50%)
|
||||||
|
padding 0.5rem
|
||||||
|
color text-color
|
||||||
|
|
||||||
|
:active
|
||||||
|
transform translateY(-50%) translateY(3px)
|
||||||
|
|
||||||
|
.left-badge
|
||||||
|
left 12%
|
||||||
|
|
||||||
|
.right-badge
|
||||||
|
right 12%
|
||||||
|
|
||||||
|
|
||||||
|
@ -13,6 +13,7 @@
|
|||||||
img
|
img
|
||||||
width 64px
|
width 64px
|
||||||
height 64px
|
height 64px
|
||||||
|
object-fit cover
|
||||||
|
|
||||||
.notification-info
|
.notification-info
|
||||||
vertical
|
vertical
|
||||||
|
Loading…
Reference in New Issue
Block a user