From eb459cc248a5940a14193b20d263ffee3d345026 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Thu, 16 Dec 2021 13:40:12 +0100
Subject: chore: create contact page

---
 src/components/Buttons/Buttons.module.scss | 34 ++++++++++++++++++++++++++++++
 1 file changed, 34 insertions(+)
 create mode 100644 src/components/Buttons/Buttons.module.scss

(limited to 'src/components/Buttons/Buttons.module.scss')

diff --git a/src/components/Buttons/Buttons.module.scss b/src/components/Buttons/Buttons.module.scss
new file mode 100644
index 0000000..93dfb9d
--- /dev/null
+++ b/src/components/Buttons/Buttons.module.scss
@@ -0,0 +1,34 @@
+@use "@styles/abstracts/functions" as fun;
+
+.btn {
+  display: block;
+  padding: var(--spacing-2xs) var(--spacing-md);
+  border: none;
+  font-size: var(--font-size-md);
+}
+
+.submit {
+  margin: auto;
+  background: var(--color-primary);
+  border-radius: fun.convert-px(3);
+  box-shadow: fun.convert-px(3) fun.convert-px(3) 0 0 var(--color-primary-dark);
+  color: var(--color-fg-inverted);
+  font-weight: 600;
+  text-shadow: fun.convert-px(2) fun.convert-px(2) 0 var(--color-shadow);
+  transition: all 0.3s ease-in-out 0s;
+
+  &:hover,
+  &:focus {
+    background: var(--color-primary-light);
+    box-shadow: fun.convert-px(7) fun.convert-px(7) 0 0
+      var(--color-primary-dark);
+    transform: translateX(#{fun.convert-px(-4)})
+      translateY(#{fun.convert-px(-4)});
+  }
+
+  &:active {
+    background: var(--color-primary-dark);
+    box-shadow: 0 0 0 0 var(--color-primary-dark);
+    transform: translateX(#{fun.convert-px(3)}) translateY(#{fun.convert-px(3)});
+  }
+}
-- 
cgit v1.2.3