From 1d1aaccc8e8232f201b56aff180ec40167862566 Mon Sep 17 00:00:00 2001
From: elit-altum <manan.sharma311@gmail.com>
Date: Mon, 6 Apr 2020 20:24:39 +0530
Subject: [PATCH] fix(toolbar): centered the toolbar icons

---
 client/styles/components/_toolbar.scss | 30 ++++++++++++++++++++++++--
 1 file changed, 28 insertions(+), 2 deletions(-)

diff --git a/client/styles/components/_toolbar.scss b/client/styles/components/_toolbar.scss
index 86dec1b2..e4157d8e 100644
--- a/client/styles/components/_toolbar.scss
+++ b/client/styles/components/_toolbar.scss
@@ -1,6 +1,9 @@
 .toolbar__play-button {
 	@include themify() {
 		@extend %toolbar-button;
+		display: flex;
+		justify-content: center;
+		align-items: center;
 		&--selected {
 			@extend %toolbar-button--selected;
 		}
@@ -18,8 +21,13 @@
 	    }
 	}
 	margin-right: #{15 / $base-font-size}rem;
-	& span {
-		padding-left: #{3 / $base-font-size}rem;
+	span {
+		padding-left: #{4 / $base-font-size}rem;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 20px;
+		height: 20px;
 	}
 }
 
@@ -30,16 +38,29 @@
 .toolbar__stop-button {
 	@include themify() {
 		@extend %toolbar-button;
+		display: flex;
+		justify-content: center;
+		align-items: center;
 		margin-right: #{15 / $base-font-size}rem;
 		&--selected {
 			@extend %toolbar-button--selected;
 		}
 	}
+	span {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 20px;
+		height: 20px;
+	}
 }
 
 .toolbar__preferences-button {
 	@include themify() {
 		@extend %toolbar-button;
+		display: flex;
+		justify-content: center;
+		align-items: center;
 		line-height: #{52 / $base-font-size}rem;
 		&--selected {
 			@extend %toolbar-button--selected;
@@ -50,6 +71,11 @@
 	margin-left: auto;
 	& span {
 		padding-left: #{1 / $base-font-size}rem;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 20px;
+		height: 20px;
 	}
 }