fix: More misc fixed, schema cleanup

kiosion · Sep 18, 2023 · 0cf34bd · 0cf34bd
1 parent 949e1bf
commit 0cf34bd
Show file tree

Hide file tree

Showing 10 changed files with 88 additions and 138 deletions.
diff --git a/elixir-api/lib/routes/api/v1/about.ex b/elixir-api/lib/routes/api/v1/about.ex
@@ -32,13 +32,9 @@ defmodule Router.Api.V1.About do
           ["'objectID'", "_id"],
           "_rev",
           "_type",
-          "at",
           "bio",
           "body",
-          "now",
-          "location",
           "contact",
-          "fullname",
           %{
             "timeline[]" => [
               "title",

diff --git a/elixir-api/lib/routes/api/v1/project.ex b/elixir-api/lib/routes/api/v1/project.ex
@@ -76,20 +76,26 @@ defmodule Router.Api.V1.Project do
             _ -> 1
           end
 
-        case params["lang"] do
-          "en" -> result
-          "fr" -> Translate.translate(:project, result, "fr", "en")
-          _ -> conn |> error_res(400, "Invalid request", "Invalid language") |> halt()
-        end
-        |> case do
-          {:error, message} ->
-            Logger.error("Error translating post: #{inspect(message)}")
-            result
+        translated_result =
+          case params["lang"] do
+            "en" -> result
+            "fr" -> Translate.translate(:project, result, "fr", "en")
+            _ -> conn |> error_res(400, "Invalid request", "Invalid language") |> halt()
+          end
+          |> case do
+            {:error, message} ->
+              Logger.error("Error translating post: #{inspect(message)}")
+              result
+
+            translated_result ->
+              translated_result
+          end
 
-          translated_result ->
-            translated_result
-        end
-        |> Kernel.put_in(["result", "headings"], PT.build_summary(& &1["result"]["body"]))
+        Kernel.put_in(
+          translated_result,
+          ["result", "headings"],
+          PT.build_summary(translated_result["result"]["body"])
+        )
         |> Map.put("meta", %{
           "total" => count,
           "count" => count,

diff --git a/sanity-cms/schemas/author.ts b/sanity-cms/schemas/author.ts
@@ -14,18 +14,6 @@ export default {
       type: 'string',
       validation: (Rule: Rule) => Rule.required()
     },
-    {
-      name: 'fullname',
-      title: 'Full name',
-      type: 'string',
-      validation: (Rule: Rule) => Rule.required()
-    },
-    {
-      name: 'at',
-      title: '@username',
-      type: 'string',
-      validation: (Rule: Rule) => Rule.required()
-    },
     {
       name: 'image',
       title: 'Image',
@@ -41,13 +29,6 @@ export default {
       of: BodyBlocks,
       validation: (Rule: Rule) => Rule.required()
     },
-    {
-      name: 'now',
-      title: 'Now',
-      type: 'array',
-      of: BodyBlocks,
-      validation: (Rule: Rule) => Rule.required()
-    },
     Body,
     {
       name: 'contact',

diff --git a/sanity-cms/schemas/settings.ts b/sanity-cms/schemas/settings.ts
@@ -9,10 +9,6 @@ export default {
       name: 'pages',
       title: 'Pages'
     },
-    {
-      name: 'experiments',
-      title: 'Experiments'
-    },
     {
       name: 'links',
       title: 'Links'

diff --git a/svelte-app/src/app.scss b/svelte-app/src/app.scss
@@ -30,7 +30,7 @@ img {
 body {
   @apply h-full w-full overflow-x-hidden;
 
-    background-color: $dark;
+  background-color: $dark;
   --textColour: $light;
 
   &.light {

diff --git a/svelte-app/src/components/nav.svelte b/svelte-app/src/components/nav.svelte
@@ -3,75 +3,72 @@
   import { slide } from 'svelte/transition';
 
   import { linkTo } from '$i18n';
-  import { BASE_ANIMATION_DURATION, TOP_LEVEL_ROUTES } from '$lib/consts';
+  import { BASE_ANIMATION_DURATION, NAV_LINKS } from '$lib/consts';
   import { navOpen } from '$stores/navigation';
 
   import LanguageControls from '$components/controls/language-toggle.svelte';
   import MenuToggle from '$components/controls/menu-toggle.svelte';
   import ThemeToggle from '$components/controls/theme-toggle.svelte';
+  import Hoverable from '$components/hoverable.svelte';
   import NavLink from '$components/nav/nav-link.svelte';
 
-  const navLinks = TOP_LEVEL_ROUTES.filter((route) => !route.hidden)?.map((route) => ({
-    name: route.name,
-    url: route.path
-  }));
+  let hovered = false;
 </script>
 
 <div class="fixed left-6 right-6 top-4 z-10 flex items-center justify-center">
-  <nav
-    class="flex w-full max-w-6xl flex-col items-center justify-center rounded-lg border border-dark/40 bg-light/40 px-6 py-2 backdrop-blur-lg transition-[background-color,border-color] hover:border-dark/60 hover:bg-light/60
-    focus-visible:border-dark/60 focus-visible:bg-light/60 dark:border-light/40 dark:bg-dark/50 dark:hover:border-light/60 dark:hover:bg-dark/70 dark:focus-visible:border-light/60 dark:focus-visible:bg-dark/70"
-    aria-label="Main navigation"
-    role="group"
-    data-test-id="navBar"
-  >
-    <div class="flex w-full flex-row items-center justify-between">
-      <div class="hidden flex-row items-center justify-start gap-5 md:flex">
-        <a
-          class="focusOutline no-select h-12 w-fit rounded-sm py-3 font-code text-xl font-black leading-none"
-          href={$linkTo('/')}
-          aria-label="Home"
-        >
-          kio.dev
-        </a>
-        <span class="block h-[24px] w-[2px] bg-accent-light/60 dark:bg-accent-dark/60" />
+  <Hoverable bind:hovered>
+    <nav
+      class="flex w-full max-w-6xl flex-col items-center justify-center rounded-lg border px-6 py-2 backdrop-blur-lg transition-[background-color,border-color] {hovered
+        ? 'border-dark/60 bg-light/60 dark:border-light/60 dark:bg-dark/70'
+        : 'border-dark/40 bg-light/40 dark:border-light/40 dark:bg-dark/50'}"
+      aria-label="Main navigation"
+      role="group"
+      data-test-id="navBar"
+    >
+      <div class="flex w-full flex-row items-center justify-between">
         <div class="flex flex-row items-center justify-start gap-5">
-          {#each navLinks as link}
-            <NavLink {link} />
-          {/each}
+          <MenuToggle class="block md:hidden" />
+          <span
+            class="block h-[24px] w-[2px] transition-[background-color] md:hidden {hovered
+              ? 'bg-accent-light dark:bg-accent-dark'
+              : 'bg-accent-light/60 dark:bg-accent-dark/60'}"
+          />
+          <a
+            class="focusOutline no-select h-12 w-fit rounded-sm py-3 font-code text-xl font-black leading-none"
+            href={$linkTo('/')}
+            aria-label="Home"
+          >
+            kio.dev
+          </a>
+          <span
+            class="hidden h-[24px] w-[2px] transition-[background-color] md:block {hovered
+              ? 'bg-accent-light dark:bg-accent-dark'
+              : 'bg-accent-light/60 dark:bg-accent-dark/60'}"
+          />
+          <div class="hidden flex-row items-center justify-start gap-5 md:flex">
+            {#each NAV_LINKS as link}
+              <NavLink {link} />
+            {/each}
+          </div>
+        </div>
+        <div class="flex flex-row items-center justify-end gap-4">
+          <ThemeToggle />
+          <LanguageControls />
         </div>
       </div>
-      <div class="relative flex flex-row items-center justify-start gap-4 md:hidden">
-        <MenuToggle />
-        <span class="block h-[24px] w-[2px] bg-accent-light/60 dark:bg-accent-dark/60" />
-        <a
-          class="focusOutline no-select h-12 w-fit rounded-sm py-3 font-code text-xl font-black leading-none"
-          href={$linkTo('/')}
-          aria-label="Home"
-          on:click={() => {
-            navOpen.set(false);
+      {#if $navOpen}
+        <div
+          class="my-2 flex w-full flex-col items-start justify-start gap-y-2 text-2xl"
+          transition:slide|local={{
+            duration: BASE_ANIMATION_DURATION,
+            easing: circInOut
           }}
         >
-          kio.dev
-        </a>
-      </div>
-      <div class="flex flex-row items-center justify-end gap-4">
-        <ThemeToggle />
-        <LanguageControls />
-      </div>
-    </div>
-    {#if $navOpen}
-      <div
-        class="my-2 flex w-full flex-col items-start justify-start gap-y-2 text-2xl"
-        transition:slide|local={{
-          duration: BASE_ANIMATION_DURATION,
-          easing: circInOut
-        }}
-      >
-        {#each navLinks as link}
-          <NavLink {link} mobile />
-        {/each}
-      </div>
-    {/if}
-  </nav>
+          {#each NAV_LINKS as link}
+            <NavLink {link} mobile />
+          {/each}
+        </div>
+      {/if}
+    </nav>
+  </Hoverable>
 </div>
diff --git a/svelte-app/src/components/nav/nav-link.svelte b/svelte-app/src/components/nav/nav-link.svelte
@@ -70,7 +70,7 @@
       <span
         class="absolute block rounded-md {isHovered
           ? 'bg-accent-light/60 dark:bg-accent-dark/60'
-          : 'bg-accent-light dark:bg-accent-dark'} bottom-1 left-0 right-0 h-[2px] transition-[background-color]"
+          : 'bg-accent-light dark:bg-accent-dark'} bottom-2 left-0 right-0 h-[2px] transition-[background-color]"
         transition:fade={{ duration: BASE_ANIMATION_DURATION / 3 }}
       />
     {/if}

diff --git a/svelte-app/src/components/portable-text/serializers/custom-link.svelte b/svelte-app/src/components/portable-text/serializers/custom-link.svelte
@@ -20,36 +20,11 @@
     href={href ? $linkTo(href) : '#'}
     target={newtab ? '_blank' : undefined}
     rel={newtab ? 'noopener noreferrer' : ''}
-    class="focusOutline-sm rounded-sm from-accent-light px-[2px] text-dark/90 no-underline dark:from-accent-dark dark:text-light"
-    class:active={hovered}
+    class="focusOutline-sm rounded-sm from-accent-light text-dark/90 underline decoration-accent-light underline-offset-[2px] dark:text-light dark:decoration-accent-dark {hovered
+      ? 'decoration-[3px]'
+      : 'decoration-2'}"
     tabindex="0"
   >
     {plainTextContent}
   </a>
 </Hoverable>
-
-<style lang="scss">
-  a {
-    background-image: linear-gradient(
-      to right,
-      var(--tw-gradient-from) 0%,
-      var(--tw-gradient-from) 100%
-    );
-    background-position: bottom center;
-    background-repeat: no-repeat;
-    background-size: calc(100% - 4px) 2px;
-    transition: background-size 50ms ease, color 50ms ease !important;
-
-    &.active {
-      @apply text-light;
-
-      background-size: calc(100% - 4px) 100%;
-    }
-  }
-
-  :global(.dark) {
-    a.active {
-      @apply text-dark;
-    }
-  }
-</style>
diff --git a/svelte-app/src/lib/consts.ts b/svelte-app/src/lib/consts.ts
@@ -72,6 +72,13 @@ export const ROUTE_ORDER = [
   'etc'
 ];
 
+export const NAV_LINKS = TOP_LEVEL_ROUTES.filter((route) => !route.hidden)?.map(
+  (route) => ({
+    name: route.name,
+    url: route.path
+  })
+);
+
 export const BASE_TRANSITION_DURATION = 200 as const;
 export const BASE_ANIMATION_DURATION = 300 as const;
 

diff --git a/svelte-app/types/app/documents/author.d.ts b/svelte-app/types/app/documents/author.d.ts
@@ -1,14 +1,11 @@
+import type { Document } from '$types/documents';
 import type {
-  SanityImageObject,
-  InputValue,
-  SanityAsset,
-  PTBlock,
   ArbitraryTypedObject,
-  PortableTextBlock
+  PortableTextBlock,
+  SanityAsset,
+  SanityImageObject
 } from '$types/sanity';
 
-import type { Document } from '$types/documents';
-
 export type AuthorTimelineItem = SanityAsset & {
   title: string;
   subtitle?: string;
@@ -25,13 +22,8 @@ export type AuthorTimelineItem = SanityAsset & {
 };
 
 export interface AuthorDocument extends Omit<Document, 'slug' | 'date'> {
-  at: string;
   bio: (PortableTextBlock | ArbitraryTypedObject)[];
-  now: (PortableTextBlock | ArbitraryTypedObject)[];
   name: string;
-  fullname: string;
-  at: string;
-  location: string;
   image: SanityImageObject;
   timeline: AuthorTimelineItem[];
   contact: (PortableTextBlock | ArbitraryTypedObject)[];