feat: add footer links and fal logo

web/index.html

@@ -51,7 +51,15 @@ <h2>infinite lo-fi music in the background</h2>
 		</div>
 
 		<footer>
-			<span>made by kennethnym &lt;3 ·&nbsp;</span>
+			made by&nbsp<a href="https://kennethnym.com">kennethnym</a>&nbsp;&lt;3 · powered by
+			<a class="fal-link" href="https://fal.ai">
+				<picture>
+					<source srcset="./images/fal-logo-light.svg" media="(prefers-color-scheme: light)" />
+					<source srcset="./images/fal-logo-dark.svg" media="(prefers-color-scheme: dark)" />
+					<img class="fal-logo" fill="none" src="./images/fal-logo-dark.svg">
+				</picture>
+			</a>
+      ·
 			<a target="_blank" rel="noopener noreferrer" href="https://github.com/kennethnym/infinifi">github</a>
 		</footer>
 

web/style.css

@@ -72,21 +72,19 @@ main {
 
 footer {
   padding: 1rem 0;
-  display: flex;
   align-items: center;
   justify-content: center;
+  color: var(--text);
+  text-align: center;
+  text-wrap: nowrap;
+  overflow: auto;
 }
 @media (min-width: 768px) {
   footer {
     padding: 2rem 0;
   }
 }
 
-footer > span {
-  color: var(--text);
-  opacity: 0.5;
-}
-
 a {
   color: var(--link-accent);
 }
@@ -378,3 +376,12 @@ aside#notification > #notification-title {
     opacity: 0;
   }
 }
+
+.fal-logo {
+  vertical-align: bottom;
+  height: 1rem;
+}
+
+.fal-link {
+  text-decoration: none;
+}