From df3014e2a59378e24091203d12a784eb55179b22 Mon Sep 17 00:00:00 2001
From: Sebin Nyshkim <sebin.nyshkim@icloud.com>
Date: Thu, 23 Mar 2023 13:41:08 +0100
Subject: [PATCH] refactor: use shorthand property for navigation positioning

---
 src/components/SiteNavigation.vue |  5 +----
 src/scss/base.scss                | 10 ++--------
 2 files changed, 3 insertions(+), 12 deletions(-)

diff --git a/src/components/SiteNavigation.vue b/src/components/SiteNavigation.vue
index 4493120..890ac5d 100644
--- a/src/components/SiteNavigation.vue
+++ b/src/components/SiteNavigation.vue
@@ -27,10 +27,7 @@ import { RouterLink } from "vue-router";
 <style lang="scss">
 .navigation {
   position: fixed;
-  top: var(--navigation-position-top);
-  right: var(--navigation-position-right);
-  bottom: var(--navigation-position-bottom);
-  left: var(--navigation-position-left);
+  inset: var(--navigation-position);
   overflow: hidden;
 
   width: var(--navigation-width);
diff --git a/src/scss/base.scss b/src/scss/base.scss
index b5ad241..088c971 100644
--- a/src/scss/base.scss
+++ b/src/scss/base.scss
@@ -64,10 +64,7 @@
   --navigation-flow: row nowrap;
   --navigation-justify: space-evenly;
   --navigation-align: center;
-  --navigation-position-top: auto;
-  --navigation-position-right: 0;
-  --navigation-position-bottom: 0;
-  --navigation-position-left: 0;
+  --navigation-position: auto 0 0 0;
 
   --navigation-size: 4rem;
   --navigation-width: 100%;
@@ -224,10 +221,7 @@
     --navigation-flow: column nowrap;
     --navigation-justify: flex-start;
     --navigation-align: stretch;
-    --navigation-position-top: 0;
-    --navigation-position-right: auto;
-    --navigation-position-bottom: 0;
-    --navigation-position-left: 0;
+    --navigation-position: 0 auto 0 0;
 
     --navigation-width: calc(
       var(--navigation-size) + env(safe-area-inset-left)