3 files changed, 49 insertions, 0 deletions
diff --git a/src/lib/styles/contact.scss b/src/lib/styles/contact.scss
new file mode 100644
index 0000000..910cac6
--- /dev/null
+++ b/src/lib/styles/contact.scss
@@ -0,0 +1,38 @@
+@use "sass:color";
+@use "sass:meta";
+
+@mixin contact($color, $text-color: $color) {
+  cursor: pointer;
+  color: $text-color;
+  background-color: color.adjust($color, $alpha: -0.1);
+  padding: 7px 25px;
+  min-width: 70px;
+  max-width: 70vw;
+  overflow-wrap: break-word;
+  border-radius: 10px;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 1px 4px 1px color.change(black, $alpha: 0.10),
+	      0 1px 10px 5px color.change(black, $alpha: 0.09),
+	      0 3px 16px 8px color.change(black, $alpha: 0.04),
+	      0 0 0 1px color.change(black, $alpha: 0.05);
+  transition: box-shadow 0.3s ease-in-out;
+
+  &:hover {
+    box-shadow: 0 1px 4px 1px color.change($color, $alpha: 0.10),
+	      0 1px 10px 5px color.change($color, $alpha: 0.09),
+	      0 3px 16px 8px color.change($color, $alpha: 0.04),
+	      0 0 0 1px color.change($color, $alpha: 0.05);
+  }
+  & h3 {
+    text-align: center;
+  }
+
+  & p {
+    user-select: none;
+  }
+
+  & noscript {
+    text-overflow: ellipsis;
+  }
+}
diff --git a/src/lib/styles/index.scss b/src/lib/styles/index.scss
new file mode 100644
index 0000000..f8b00dd
--- /dev/null
+++ b/src/lib/styles/index.scss
@@ -0,0 +1,2 @@
+@forward "$lib/styles/shadow.scss";
+@forward "$lib/styles/contact.scss";
diff --git a/src/lib/styles/shadow.scss b/src/lib/styles/shadow.scss
new file mode 100644
index 0000000..382c337
--- /dev/null
+++ b/src/lib/styles/shadow.scss
@@ -0,0 +1,9 @@
+@use "sass:color";
+@use "sass:meta";
+
+@mixin shadow($color: black) {
+  box-shadow: 0 1px 4px 1px color.change($color, $alpha: 0.13),
+	      0 1px 10px 5px color.change($color, $alpha: 0.09),
+	      0 3px 16px 8px color.change($color, $alpha: 0.04),
+	      0 0 0 1px color.change($color, $alpha: 0.05);
+}