switched to guider

.docs/components/Logo.module.css

@@ -0,0 +1,18 @@
+.logo {
+  border-radius: 5px;
+  margin-left: -0.5rem;
+  padding: 0.5rem;
+  transition: transform 100ms ease-in-out, background-color 100ms ease-in-out;
+}
+
+.logo > img {
+  height: 1.5rem;
+}
+
+.logo:hover {
+  background-color: rgba(var(--colors-bgLightest));
+}
+
+.logo:active {
+  transform: scale(1.05);
+}

.docs/components/Logo.tsx

@@ -0,0 +1,11 @@
+import Link from 'next/link';
+import classes from './Logo.module.css';
+import logoUrl from '../public/icon-light.png';
+
+export function Logo() {
+  return (
+    <Link href="/" className={classes.logo}>
+      <img src={logoUrl.src} alt="Logo of movie-web" />
+    </Link>
+  );
+}