Style activities on dashboard

src/styles/_dashboard.sass

@@ -1,8 +1,4 @@
-
-#dashboard
-	width: 100%
-	padding: 0 20px
-
+/* General style for activities in all places */
 .d-activity
 	font-size: .9em
 
@@ -13,29 +9,42 @@
 		padding: 0 10px
 		color: $color-text-dark-primary
 		list-style: none
-		border-left: thin solid rgba($activity-highlight-color, .2)
+		border-left: thin solid $activity-highlight-color
 
 		li
 			padding: 7px 0
+			span.date
+				color: darken($activity-highlight-color, 5%)
+				position: relative
 
-		span.date
-			color: darken($activity-highlight-color, 5%)
-			position: relative
+				&:before
+					content: ''
+					display: block
+					position: absolute
+					bottom: 5px
+					left: -13px
+					width: 5px
+					height: 5px
+					border-radius: 50%
+					background-color: $color-background-light
+					border: thin solid $activity-highlight-color
+					transition: all 250ms ease-in-out
 
-			&:before
-				content: ''
-				display: block
-				position: absolute
-				bottom: 5px
-				left: -13px
-				width: 5px
-				height: 5px
-				border-radius: 50%
-				background-color: $color-background-light
-				border: thin solid $activity-highlight-color
+			&:hover span.date:before
+				background-color: $activity-highlight-color
 
 		span.actor
 			padding: 0 5px
 			color: $color-text-dark
 
+/* Dashboard specific styles */
+.dashboard
+	.d-stats
+		padding: 0 20px
+	.d-activity
+		padding: 5px 15px
+		margin: 0 20px
+		+container-box
 
+		a
+			color: $color-text-dark-primary