From 469c52eb978afc00a79e174ba8c4ce35b8659a1b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Paul=20Nicou=C3=A9?= <contact@paulnicoue.com>
Date: Thu, 2 Feb 2023 17:17:44 +0100
Subject: [PATCH] Remove ContactDecoration component

---
 components/ContactDecoration.vue | 61 --------------------------------
 components/ContactSection.vue    | 15 +++-----
 2 files changed, 5 insertions(+), 71 deletions(-)
 delete mode 100644 components/ContactDecoration.vue

diff --git a/components/ContactDecoration.vue b/components/ContactDecoration.vue
deleted file mode 100644
index 1d9cae8..0000000
--- a/components/ContactDecoration.vue
+++ /dev/null
@@ -1,61 +0,0 @@
-<template>
-
-    <div class="contact-decoration" aria-hidden="true">
-        <div class="contact-decoration__icon">
-            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
-                <path d="M 3.2 3.2 L 20.8 3.2 C 22.01 3.2 23 4.19 23 5.4 L 23 18.6 C 23 19.81 22.01 20.8 20.8 20.8 L 3.2 20.8 C 1.99 20.8 1 19.81 1 18.6 L 1 5.4 C 1 4.19 1.99 3.2 3.2 3.2 Z"/>
-                <polyline points="23 5.4 12 13.1 1 5.4"/>
-            </svg>
-        </div>
-        <div class="contact-decoration__separator"></div>
-    </div>
-
-</template>
-
-<script setup>
-</script>
-
-<style lang="scss" scoped>
-
-    // --------------------------------------------------
-    // STYLE
-    // --------------------------------------------------
-
-    .contact-decoration {
-        display: none;
-
-        @media screen and (min-width: $tablet-media-query) {
-            display: flex;
-            flex-direction: column;
-            justify-content: flex-start;
-            align-items: center;
-            height: 100%;
-            margin: 0 -1rem;
-
-            &__icon {
-                width: calc(var(--regular-icon-size) + 1rem);
-                height: calc(var(--regular-icon-size) + 1rem);
-                display: flex;
-                justify-content: center;
-                align-items: center;
-                background-color: var(--primary-color);
-                border: 1px solid var(--accent-color);
-                border-radius: 50%;
-
-                svg {
-                    stroke: var(--secondary-color);
-                    width: var(--regular-icon-size);
-                    height: var(--regular-icon-size);
-                }
-            }
-
-            &__separator {
-                width: 1px;
-                height: 0;
-                background-color: var(--accent-color);
-                animation: expand-height 600ms ease-in-out 600ms forwards;
-            }
-        }
-    }
-
-</style>
diff --git a/components/ContactSection.vue b/components/ContactSection.vue
index a21e47d..805187b 100644
--- a/components/ContactSection.vue
+++ b/components/ContactSection.vue
@@ -1,7 +1,6 @@
 <template>
 
     <section id="contact" class="contact">
-        <ContactDecoration class="contact__decoration" />
         <ContactHeader class="contact__header" />
         <ContactForm class="contact__form" />
     </section>
@@ -21,17 +20,13 @@
         max-width: var(--regular-content-max-width);
         display: grid;
         grid:
-            'decoration header' auto
-            'decoration form' auto
-            / auto 1fr;
+            'header' auto
+            'form' auto
+            / 1fr;
         place-content: start stretch;
         place-items: start stretch;
         row-gap: 4rem;
 
-        &__decoration {
-            grid-area: decoration;
-        }
-
         &__header {
             grid-area: header;
         }
@@ -46,8 +41,8 @@
 
         @media screen and (min-width: $desktop-media-query) {
             grid:
-                'decoration header form' auto
-                / auto 1fr 2fr;
+                'header form' auto
+                / 1fr 2fr;
             column-gap: 6rem;
         }
     }