From 2be771cbccfd4d17f1616df9673c357b1ca48cdf Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandro@alejandrocelaya.com>
Date: Mon, 7 Jan 2019 13:45:16 +0100
Subject: [PATCH] Improved styles

---
 src/common/AsideMenu.scss             |  4 +---
 src/utils/mixins/border-radius.scss   |  4 ----
 src/utils/mixins/box-shadow.scss      |  4 ----
 src/utils/mixins/fit-with-margin.scss |  8 ++++++++
 src/visits/helpers/MapModal.scss      | 13 +++----------
 5 files changed, 12 insertions(+), 21 deletions(-)
 delete mode 100644 src/utils/mixins/border-radius.scss
 delete mode 100644 src/utils/mixins/box-shadow.scss
 create mode 100644 src/utils/mixins/fit-with-margin.scss

diff --git a/src/common/AsideMenu.scss b/src/common/AsideMenu.scss
index 0319f1fb..43bb7682 100644
--- a/src/common/AsideMenu.scss
+++ b/src/common/AsideMenu.scss
@@ -1,5 +1,4 @@
 @import '../utils/base';
-@import '../utils/mixins/box-shadow';
 @import '../utils/mixins/vertical-align';
 
 $asideMenuMobileWidth: 280px;
@@ -26,8 +25,7 @@ $asideMenuMobileWidth: 280px;
     width: $asideMenuMobileWidth !important;
     transition: left 300ms;
     top: $headerHeight - 3px;
-
-    @include box-shadow(-10px 0 50px 11px rgba(0, 0, 0, .55));
+    box-shadow: -10px 0 50px 11px rgba(0, 0, 0, .55);
   }
 }
 
diff --git a/src/utils/mixins/border-radius.scss b/src/utils/mixins/border-radius.scss
deleted file mode 100644
index 7523e870..00000000
--- a/src/utils/mixins/border-radius.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-@mixin border-radius($radius) {
-  border-radius: $radius;
-  -webkit-border-radius: $radius;
-}
diff --git a/src/utils/mixins/box-shadow.scss b/src/utils/mixins/box-shadow.scss
deleted file mode 100644
index 464f8ece..00000000
--- a/src/utils/mixins/box-shadow.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-@mixin box-shadow($shadow) {
-  -webkit-box-shadow: $shadow;
-  box-shadow: $shadow;
-}
diff --git a/src/utils/mixins/fit-with-margin.scss b/src/utils/mixins/fit-with-margin.scss
new file mode 100644
index 00000000..ec124dec
--- /dev/null
+++ b/src/utils/mixins/fit-with-margin.scss
@@ -0,0 +1,8 @@
+@mixin fit-with-margin($margin) {
+  $offset: $margin * 2;
+
+  width: calc(100% - #{$offset});
+  max-width: calc(100% - #{$offset});
+  height: calc(100% - #{$offset});
+  margin: $margin;
+}
diff --git a/src/visits/helpers/MapModal.scss b/src/visits/helpers/MapModal.scss
index 642bf797..7b2aed55 100644
--- a/src/visits/helpers/MapModal.scss
+++ b/src/visits/helpers/MapModal.scss
@@ -1,24 +1,17 @@
 @import '../../utils/base';
+@import '../../utils/mixins/fit-with-margin';
 
 .map-modal__modal {
   @media (min-width: $mdMin) {
     $margin: 20px;
-    $offset: $margin * 2;
 
-    width: calc(100% - #{$offset});
-    max-width: calc(100% - #{$offset});
-    height: calc(100% - #{$offset});
-    margin: $margin;
+    @include fit-with-margin($margin);
   }
 
   @media (max-width: $smMax) {
     $margin: 10px;
-    $offset: $margin * 2;
 
-    width: calc(100% - #{$offset});
-    max-width: calc(100% - #{$offset});
-    height: calc(100% - #{$offset});
-    margin: $margin;
+    @include fit-with-margin($margin);
   }
 }