Implement #1

2023-04-02 20:47:31 +02:00
parent 5f208ec074
commit 1066ea51a9
4 changed files with 88 additions and 0 deletions
--- a/src/lib/components/FooterComponent.svelte
+++ b/src/lib/components/FooterComponent.svelte
@ -0,0 +1,43 @@
+<script>
+  import git from '$lib/assets/git-branch-fill.svg';
+</script>
+
+<div class="footer">
+    <div>
+        <span>Made with &#x1F918; by&nbsp;</span>
+        <a href="https://metalhead.club/@aymm" rel="me">@aymm@metalhead.club</a>
+    </div>
+    |
+    <div>
+        <a href="https://phlaym.net/git/phlaym/moshing-mammut">Source Code&nbsp;<img alt="Git branch" src={git} class="icon" /></a>
+    </div>
+</div>
+
+<style>
+  .footer {
+    position: sticky;
+    bottom: 0px;
+    display: flex;
+    justify-content: flex-start;
+    align-items: baseline;
+    gap: 10px;
+    backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
+    background-color: #54546788;
+    padding: 0.3em 1em;
+    margin: 0 -8px;
+  }
+  .icon {
+    position: relative;
+    top: 0.5em;
+    color: white;
+  }
+  @media (prefers-color-scheme: dark) {
+    .icon {
+      filter: invert();
+    }
+    .footer {
+      background-color: #6364FF88;
+    }
+  }
+</style>