assure that badges will be displayed as circles no matter what font is used and if there is only one digit inside. move css to its proper place

2 files changed, 12 insertions, 7 deletions

diff --git a/view/css/bootstrap-red.css b/view/css/bootstrap-red.css
index cb26910b0..ffc288962 100644
--- a/view/css/bootstrap-red.css
+++ b/view/css/bootstrap-red.css
@@ -4,13 +4,23 @@
 
 nav .badge {
 	position: relative;
-	top: -48px;
+	top: -49px;
 	float: left;
 	font-size: 10px;
-	padding: 2px 6px;
+	line-height: 20px;
+	padding: 0px 5px;
+	height: 20px;
+	min-width: 20px;
+	border-radius: 10px;
 	cursor: pointer;
 }
 
+@media screen and (max-width: 767px) {
+	nav .badge {
+		top: -46px;
+	}
+}
+
 nav i {
 	font-size: 14px;
 }
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index b01e03636..da75cf3f8 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -2001,11 +2001,6 @@ blockquote {
 	border-radius: $radiuspx;
 }
 
-nav .badge {
-	padding: 5px 6px;
-	border-radius: 9px;
-}
-
 nav .badge:hover {
 	background-color: #999;
 }