fix: UX for selection

* make it more obvious what is the selected topic
* use branded information

less/category.less

@@ -76,8 +76,8 @@
 				}
 
 				.fa-check {
-					border: 1px solid @brand-primary;
+					border: 1px solid @brand-success;
-					color: @brand-primary;
+					color: @brand-success;
 					opacity: 1;
 				}
 			}
@@ -90,15 +90,17 @@
 				.avatar .select {
 					.fa-check {
 						opacity: 1;
+						background-color: @brand-success;
 						border: 1px solid @brand-success;
-						color: @brand-success;
+						color: @btn-success-color;
-
+						.transition(all .15s ease-in-out);
-						&:hover {
-							border: 1px solid @brand-success;
-							color: @brand-success;
-						}
 					}
 
+					&:hover .fa-check {
+						background-color: @brand-success;
+						border: 1px solid @btn-success-border;
+						color: @btn-success-color;
+					}
 				} 
 			}