From d087d0f0b37d9bfbbc9de3934f490aea8fde858a Mon Sep 17 00:00:00 2001
From: Sebin Nyshkim <sebin.nyshkim@icloud.com>
Date: Fri, 4 Sep 2020 00:31:35 +0200
Subject: [PATCH] feat: :lipstick: limit width of gallery and increase height
 on desktop

---
 src/components/Gallery.vue | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/Gallery.vue b/src/components/Gallery.vue
index b42d625..5328132 100644
--- a/src/components/Gallery.vue
+++ b/src/components/Gallery.vue
@@ -44,14 +44,21 @@ export default {
 
 <style lang="scss">
 @import "@scss/_variables.scss";
+@import "@scss/_mixins.scss";
 
 .gallery {
+  margin: auto;
+
+  @include mq-desktop {
+    max-width: 70em;
+  }
+
   &__bigimage {
     width: 100%;
     height: 40vh;
 
-    @media (min-width: 35em) {
-      height: 30em;
+    @include mq-desktop {
+      height: 80vh;
     }
 
     display: flex;