feat: major rewrite

the application is now rewritten in next.js. this commit also adds the ability to see trailers, did you know, more like this, etc. on title page.

BREAKING CHANGE: the whole application is rewritten from scratch.

src/styles/abstracts/variables/_themes.scss

@@ -0,0 +1,62 @@
+$_light: (
+  // 1. text
+  // 1.1 for headings
+  text-accent: hsl(240, 31%, 25%),
+  // 1.2 for base text
+  text: hsl(0, 0%, 24%),
+  // 1.3 for subtle text like metadata
+  text-muted: hsl(204, 4%, 35%),
+  // 2. bg
+  // 2.1 for cards, headers, footers,
+  bg-accent: hsl(339, 100%, 97%),
+  // 2.2 for base bg
+  bg: hsl(0, 0%, 100%),
+  // 2.3 for hover state of cards
+  bg-muted: rgb(255, 229, 239),
+  // 3. links
+  // 3.1 the default one.
+  link: hsl(219, 100%, 20%),
+  link-muted: hsl(344, 79%, 40%),
+  // 4. for icons, borders
+  fill: hsl(339, 100%, 36%),
+  // 4.2 for borders, primarily
+  fill-muted: hsl(0, 0%, 80%),
+  // shadows on cards
+  shadow: 0 0 1rem hsla(0, 0%, 0%, 0.2),
+  // keyboard, focus hightlight
+  highlight: hsl(176, 43%, 46%),
+  // for gradient behind hero text on about page.
+  gradient:
+    (
+      radial-gradient(
+        at 23% 32%,
+        hsla(344, 79%, 40%, 0.15) 0px,
+        transparent 70%
+      ),
+      radial-gradient(at 72% 55%, hsla(344, 79%, 40%, 0.2) 0px, transparent 50%)
+    )
+);
+
+$_dark: (
+  text-accent: hsl(0, 0%, 100%),
+  text: hsl(0, 0%, 96%),
+  text-muted: hsl(0, 0%, 80%),
+  bg-accent: hsl(221, 39%, 15%),
+  bg: hsl(221, 39%, 11%),
+  bg-muted: rgb(20, 28, 46),
+  link: hsl(339, 95%, 80%),
+  link-muted: hsl(344, 79%, 80%),
+  fill: hsl(339, 75%, 64%),
+  fill-muted: hsl(0, 0, 35%),
+  shadow: hsla(0, 0%, 0%, 1),
+  highlight: hsl(176, 43%, 46%),
+  gradient: (
+    radial-gradient(at 23% 32%, hsla(344, 79%, 40%, 0.04) 0px, transparent 70%),
+    radial-gradient(at 72% 55%, hsla(344, 79%, 40%, 0.05) 0px, transparent 50%),
+  ),
+);
+
+$themes: (
+  light: $_light,
+  dark: $_dark,
+);