Desktop version

1 files changed, 40 insertions, 0 deletions

diff --git a/sass/components/_contact-form.scss b/sass/components/_contact-form.scss
new file mode 100644
index 0000000..a2a9c40
--- /dev/null
+++ b/sass/components/_contact-form.scss
@@ -0,0 +1,40 @@
+@use "../abstracts/" as *;
+
+.messenger-form {
+  @include standard-grid;
+  gap: 2rem;
+  width: 50%;
+
+  // container for each label & input
+  div {
+    display: flex;
+    align-items: flex-start;
+    justify-content: center;
+    flex-direction: column;
+    gap: 1rem;
+
+    // div container with textarea input spans entire column, pushes button to next row
+    &.text-area {
+      grid-column: 1 / 3;
+    }
+  }
+
+  label {
+    font-weight: bold;
+  }
+
+  input,
+  textarea {
+    background-color: $text-main;
+    border: none;
+    border-radius: 10px;
+    padding: 0.5rem;
+    width: 100%;
+
+    &:focus {
+      color: $text-main;
+      background-color: $bg-text-container;
+      outline: 3px solid $text-special-dark;
+    }
+  }
+}