feat: add back to top, services, about

2022-08-09 19:13:22 -04:00
parent 3c7d81fd36
commit 58131e5a3e
15 changed files with 327 additions and 20 deletions
--- a/components/ButtonToTop.vue
+++ b/components/ButtonToTop.vue
@@ -0,0 +1,33 @@
+<template>
+  <a href="#" class="go-top"></a>
+</template>
+
+<style scoped>
+.go-top {
+  --offset: 20rem;
+  position: sticky;
+  bottom: 1rem;
+  margin-right: 1rem;
+  place-self: end;
+  margin-top: calc(100vh + var(--offset));
+
+  width: 2rem;
+  aspect-ratio: 1;
+  background: #ff8b24;
+  border-radius: 1rem;
+  box-shadow: 0 0.1rem 0.5rem 0 gray;
+}
+
+html.dark .go-top {
+  box-shadow: 0 0.1rem 0.5rem 0 black;
+}
+
+.go-top:before {
+  content: "";
+  position: absolute;
+  inset: 30%;
+  transform: translateY(20%) rotate(-45deg);
+  border-top: 0.35rem solid #fff;
+  border-right: 0.35rem solid #fff;
+}
+</style>