From 84783c871cbda62034ccd89af1898361ec58504a Mon Sep 17 00:00:00 2001
From: Eduard Urbach <e.urbach@gmail.com>
Date: Wed, 28 Feb 2018 12:12:58 +0100
Subject: [PATCH] Updated sidebar interface

---
 layout/sidebar/sidebar.pixy               |  9 ++++++++-
 layout/sidebar/sidebar.scarlet            | 21 +++++++++++++++++++++
 pages/notifications/notifications.scarlet |  1 +
 3 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/layout/sidebar/sidebar.pixy b/layout/sidebar/sidebar.pixy
index 36fa518f..8b34a054 100644
--- a/layout/sidebar/sidebar.pixy
+++ b/layout/sidebar/sidebar.pixy
@@ -6,6 +6,13 @@ component Sidebar(user *arn.User)
 				Avatar(user)
 			else
 				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
 		if user != nil
@@ -22,7 +29,7 @@ component Sidebar(user *arn.User)
 
 		if user != nil
 			SidebarButton("Shop", "/shop", "shopping-cart")
-			SidebarButton("Settings", "/settings", "cog")
+			//- SidebarButton("Settings", "/settings", "cog")
 
 		//- Disabled:
 		//- SidebarButton("Dash", "/dashboard", "tachometer")
diff --git a/layout/sidebar/sidebar.scarlet b/layout/sidebar/sidebar.scarlet
index 17346ce8..bb8924d0 100644
--- a/layout/sidebar/sidebar.scarlet
+++ b/layout/sidebar/sidebar.scarlet
@@ -21,6 +21,7 @@ sidebar-spacing-y = 0.7rem
 
 	.user-image-container
 		horizontal
+		position relative
 		justify-content center
 		margin 0.8rem 0
 		flex-shrink 0
@@ -64,3 +65,23 @@ sidebar-spacing-y = 0.7rem
 	.icon
 		font-size 1rem
 		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%
+
+
diff --git a/pages/notifications/notifications.scarlet b/pages/notifications/notifications.scarlet
index 2155daea..6848d121 100644
--- a/pages/notifications/notifications.scarlet
+++ b/pages/notifications/notifications.scarlet
@@ -13,6 +13,7 @@
 	img
 		width 64px
 		height 64px
+		object-fit cover
 
 .notification-info
 	vertical