From 37aa6925ba74f8588195d9e275656b10dc189908 Mon Sep 17 00:00:00 2001
From: tylim <limteikyee@gmail.com>
Date: Fri, 10 May 2019 19:38:17 +0800
Subject: [PATCH] issues:
 https://github.com/creativetimofficial/blk-design-system-react/issues/2

---
 .../custom/_icons.scss                        | 50 +++++++++++--------
 1 file changed, 28 insertions(+), 22 deletions(-)

diff --git a/src/assets/scss/blk-design-system-react/custom/_icons.scss b/src/assets/scss/blk-design-system-react/custom/_icons.scss
index 20d900f6..231bef35 100644
--- a/src/assets/scss/blk-design-system-react/custom/_icons.scss
+++ b/src/assets/scss/blk-design-system-react/custom/_icons.scss
@@ -1,57 +1,62 @@
+// issues: https://github.com/creativetimofficial/blk-design-system-react/issues/2
+
 .icon {
 	width: $icon-size;
 	height: $icon-size;
 
-	i, svg {
-		font-size: $icon-size - .75;
+	i,
+	svg {
+		font-size: $icon-size - 0.75;
 	}
 }
 
 .icon + .icon-text {
 	padding-left: 1rem;
-	width: calc(100% - #{$icon-size} - 1);
+	// width: calc(100% - #{$icon-size} - 1);
 }
 
 .icon-xl {
 	width: $icon-size-xl;
 	height: $icon-size-xl;
 
-	i, svg {
-		font-size: $icon-size-xl - .75;
+	i,
+	svg {
+		font-size: $icon-size-xl - 0.75;
 	}
 }
 
 .icon-xl + .icon-text {
-	width: calc(100% - $icon-size-xl - 1);
+	// width: calc(100% - $icon-size-xl - 1);
 }
 
 .icon-lg {
 	width: $icon-size-lg;
 	height: $icon-size-lg;
 
-	i, svg {
-		font-size: $icon-size-lg - .75;
+	i,
+	svg {
+		font-size: $icon-size-lg - 0.75;
 	}
 }
 
 .icon-lg + .icon-text {
-	width: calc(100% - $icon-size-lg - 1);
+	// width: calc(100% - $icon-size-lg - 1);
 }
 
 .icon-sm {
 	width: $icon-size-sm;
 	height: $icon-size-sm;
 
-	i, svg {
-		font-size: $icon-size-sm - .75;
+	i,
+	svg {
+		font-size: $icon-size-sm - 0.75;
 	}
 }
 
 .icon-sm + .icon-text {
-	width: calc(100% - $icon-size-sm - 1);
+	// width: calc(100% - $icon-size-sm - 1);
 }
 
-
 // Icons included in shapes
 .icon-shape {
 	padding: 12px;
@@ -60,33 +65,34 @@
 	align-items: center;
 	justify-content: center;
 	border-radius: 50%;
-	
 
-	i, svg {
+	i,
+	svg {
 		font-size: 1.25rem;
 	}
 
 	&.icon-lg {
-		i, svg {
+		i,
+		svg {
 			font-size: 1.625rem;
-		}	
+		}
 	}
 
 	&.icon-sm {
-		i, svg {
-			font-size: .875rem;
-		}	
+		i,
+		svg {
+			font-size: 0.875rem;
+		}
 	}
 
 	svg {
 		width: 30px;
 		height: 30px;
 	}
-
 }
 
 @each $color, $value in $theme-colors {
 	.icon-shape-#{$color} {
 		@include icon-shape-variant(theme-color($color));
 	}
-} 
+}