From e4cc947ca2ecee0896804d7e665a90f1b596c747 Mon Sep 17 00:00:00 2001
From: Nathachai Thongniran <inid3a@gmail.com>
Date: Mon, 16 Nov 2015 21:56:14 +0700
Subject: [PATCH 1/3] Add transition into toggle left menu

---
 src/assets/fabricator/styles/partials/_layout.scss    |  1 +
 src/assets/fabricator/styles/partials/_menu.scss      |  1 +
 src/assets/fabricator/styles/partials/_variables.scss | 11 +++++++++++
 3 files changed, 13 insertions(+)

diff --git a/src/assets/fabricator/styles/partials/_layout.scss b/src/assets/fabricator/styles/partials/_layout.scss
index 6a0cc4c8..de580516 100644
--- a/src/assets/fabricator/styles/partials/_layout.scss
+++ b/src/assets/fabricator/styles/partials/_layout.scss
@@ -29,6 +29,7 @@ body {
 .f-container {
 	@include clearfix;
 	@include border-box;
+	@include transition;
 	position: relative;
 	padding: 0 1em;
 	z-index: 0;
diff --git a/src/assets/fabricator/styles/partials/_menu.scss b/src/assets/fabricator/styles/partials/_menu.scss
index 0109f0e2..71e90c63 100644
--- a/src/assets/fabricator/styles/partials/_menu.scss
+++ b/src/assets/fabricator/styles/partials/_menu.scss
@@ -1,6 +1,7 @@
 // menu
 .f-menu {
 	@include border-box;
+	@include transition;
 	position: fixed;
 	top: 0;
 	left: 0;
diff --git a/src/assets/fabricator/styles/partials/_variables.scss b/src/assets/fabricator/styles/partials/_variables.scss
index 46238109..969681b0 100644
--- a/src/assets/fabricator/styles/partials/_variables.scss
+++ b/src/assets/fabricator/styles/partials/_variables.scss
@@ -50,3 +50,14 @@ $menu-width: map-get($settings, menu-width);
 @mixin border-box {
 	box-sizing: border-box;
 }
+
+@mixin transition($transition...) {
+	@if length($transition) < 1 {
+		$transition: all 0.3s ease;
+	}
+
+	-moz-transition: $transition;
+	-o-transition: $transition;
+	-webkit-transition: $transition;
+	transition: $transition;
+}

From 055981bc5b4049b00f692857b856793bdfd8e9e6 Mon Sep 17 00:00:00 2001
From: Nathachai Thongniran <inid3a@gmail.com>
Date: Mon, 16 Nov 2015 22:19:46 +0700
Subject: [PATCH 2/3] Fix code style

---
 src/assets/fabricator/styles/partials/_variables.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/assets/fabricator/styles/partials/_variables.scss b/src/assets/fabricator/styles/partials/_variables.scss
index 969681b0..4eba4452 100644
--- a/src/assets/fabricator/styles/partials/_variables.scss
+++ b/src/assets/fabricator/styles/partials/_variables.scss
@@ -30,7 +30,7 @@ $menu-width: map-get($settings, menu-width);
 
 // functions
 @function color($color) {
-    @return map-get($colors, $color);
+	@return map-get($colors, $color);
 }
 
 

From b63202ce28f28198e2a570548d5f9dceb2b078c0 Mon Sep 17 00:00:00 2001
From: Nathachai Thongniran <inid3a@gmail.com>
Date: Tue, 17 Nov 2015 00:39:01 +0700
Subject: [PATCH 3/3] Fix layout - color's section is overflowing on small
 screen

---
 src/assets/fabricator/styles/partials/_color-chips.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/assets/fabricator/styles/partials/_color-chips.scss b/src/assets/fabricator/styles/partials/_color-chips.scss
index 06fff600..84d6291d 100644
--- a/src/assets/fabricator/styles/partials/_color-chips.scss
+++ b/src/assets/fabricator/styles/partials/_color-chips.scss
@@ -5,7 +5,7 @@
 
 .f-color-chip {
 	flex-grow: 1;
-	flex-shrink: 0;
+	flex-shrink: 1;
 	flex-basis: 100%;
 	border-top-width: 8em;
 	border-top-style: solid;