fix: Tiny divider fix

kiosion · Oct 3, 2023 · a4875cc · a4875cc
1 parent d021955
commit a4875cc
Show file tree

Hide file tree

Showing 2 changed files with 68 additions and 81 deletions.
diff --git a/svelte-app/src/routes/[[lang=lang]]/+page.svelte b/svelte-app/src/routes/[[lang=lang]]/+page.svelte
@@ -4,7 +4,7 @@
   import { linkTo, t } from '$i18n';
 
   import ArrowButton from '$components/controls/arrow-button.svelte';
-  import EmptyContent from '$components/empty-content.svelte';
+  import Divider from '$components/divider.svelte';
   import HeadedBlock from '$components/headings/headed-block.svelte';
   import ContentWrapper from '$components/layouts/content-wrapper.svelte';
   import ListItem from '$components/lists/list-item.svelte';
@@ -32,64 +32,57 @@
 </svelte:head>
 
 <ContentWrapper>
-  {#if data.about}
-    <HeadedBlock icon="User" heading={$t('About me')}>
-      <PortableText text={data.about.bio} />
-    </HeadedBlock>
+  <HeadedBlock icon="User" heading={$t('About me')}>
+    <PortableText text={data.about.bio} />
+  </HeadedBlock>
 
-    <div class="align-center flex flex-col justify-start gap-4">
-      <HeadedBlock icon="list" heading={$t('Recent posts')} class="flex-[1]">
-        {#if data.posts?.length}
-          <div
-            class="flex w-full flex-col gap-y-5 pt-4"
-            role="group"
-            aria-label={$t('Posts')}
-          >
-            {#each data.posts as post}
-              <ListItem document={post} small />
-            {/each}
-            <div class="flex w-full flex-row items-start justify-start gap-2">
-              <span class="block w-[72px] flex-shrink-0" />
-              <ArrowButton class="w-full" href={$linkTo('/blog')} preload>
-                {$t('See more')} &rarr;
-              </ArrowButton>
-            </div>
-          </div>
-        {:else}
-          <div class="flex flex-col gap-y-5 pt-4">
-            <p class="p-4 font-code">
-              {$t('No content')}
-            </p>
-          </div>
-        {/if}
-      </HeadedBlock>
-      <HeadedBlock icon="list" heading={$t('Recent projects')} class="flex-[1]">
-        {#if data.projects?.length}
-          <div
-            class="flex flex-col gap-y-5 pt-4"
-            role="group"
-            aria-label={$t('Projects')}
-          >
-            {#each data.projects as project}
-              <ListItem document={project} small />
-            {/each}
-            <div class="flex w-full flex-row items-start justify-start gap-2">
-              <span class="block w-[72px] flex-shrink-0" />
-              <ArrowButton class="w-full" href={$linkTo('/work')} preload>
-                {$t('See more')} &rarr;
-              </ArrowButton>
-            </div>
-          </div>
-        {:else}
-          <div class="flex flex-col gap-y-5 pt-4">
-            <p class="p-4 font-code">
-              {$t('No content')}
-            </p>
-          </div>
-        {/if}
-      </HeadedBlock>
-    </div>
-  {:else}
-    <EmptyContent />
-  {/if}
+  <Divider />
+
+  <HeadedBlock icon="list" heading={$t('Recent posts')} class="flex-[1]">
+    {#if data.posts?.length}
+      <div
+        class="flex w-full flex-col gap-y-5 pt-4"
+        role="group"
+        aria-label={$t('Posts')}
+      >
+        {#each data.posts as post}
+          <ListItem document={post} small />
+        {/each}
+        <div class="flex w-full flex-row items-start justify-start gap-2">
+          <span class="block w-[72px] flex-shrink-0" />
+          <ArrowButton class="w-full" href={$linkTo('/blog')} preload>
+            {$t('See more')} &rarr;
+          </ArrowButton>
+        </div>
+      </div>
+    {:else}
+      <div class="flex flex-col gap-y-5 pt-4">
+        <p class="p-4 font-code">
+          {$t('No content')}
+        </p>
+      </div>
+    {/if}
+  </HeadedBlock>
+
+  <HeadedBlock icon="list" heading={$t('Recent projects')} class="flex-[1]">
+    {#if data.projects?.length}
+      <div class="flex flex-col gap-y-5 pt-4" role="group" aria-label={$t('Projects')}>
+        {#each data.projects as project}
+          <ListItem document={project} small />
+        {/each}
+        <div class="flex w-full flex-row items-start justify-start gap-2">
+          <span class="block w-[72px] flex-shrink-0" />
+          <ArrowButton class="w-full" href={$linkTo('/work')} preload>
+            {$t('See more')} &rarr;
+          </ArrowButton>
+        </div>
+      </div>
+    {:else}
+      <div class="flex flex-col gap-y-5 pt-4">
+        <p class="p-4 font-code">
+          {$t('No content')}
+        </p>
+      </div>
+    {/if}
+  </HeadedBlock>
 </ContentWrapper>
diff --git a/svelte-app/src/routes/[[lang=lang]]/etc/+page.svelte b/svelte-app/src/routes/[[lang=lang]]/etc/+page.svelte
@@ -6,7 +6,6 @@
   import { t } from '$i18n';
 
   import Divider from '$components/divider.svelte';
-  import EmptyContent from '$components/empty-content.svelte';
   import HeadedBlock from '$components/headings/headed-block.svelte';
   import ContentWrapper from '$components/layouts/content-wrapper.svelte';
   import Link from '$components/link.svelte';
@@ -35,30 +34,25 @@
 </svelte:head>
 
 <ContentWrapper>
-  {#if data.about}
-    <HeadedBlock icon="Message" heading={$t('Say hello')}>
-      <PortableText text={data.about.contact} />
-    </HeadedBlock>
+  <HeadedBlock icon="Message" heading={$t('Say hello')}>
+    <PortableText text={data.about.contact} />
+  </HeadedBlock>
 
-    <Divider />
+  <Divider />
 
-    <HeadedBlock icon="LockOpen" heading={$t('PGP')}>
-      <p>
-        {$t("Want to send a secure message my way? Here's my main PGP key:")}
-        <Link href="/pgp.txt" newtab
-          >D1FD DE24 BB72 BFEF E045 ECE0 8A2C 67E2 2184 F162</Link
-        >
-      </p>
-    </HeadedBlock>
+  <HeadedBlock icon="LockOpen" heading={$t('PGP')}>
+    <p class="my-4">
+      {$t("Want to send a secure message my way? Here's my main PGP key:")}
+      <Link href="/pgp.txt" newtab>D1FD DE24 BB72 BFEF E045 ECE0 8A2C 67E2 2184 F162</Link
+      >
+    </p>
+  </HeadedBlock>
 
-    <Divider />
+  <Divider />
 
-    <HeadedBlock icon="InfoBox" heading={$t('Meta')}>
-      <PortableText text={data.about.body} />
-    </HeadedBlock>
-  {:else}
-    <EmptyContent />
-  {/if}
+  <HeadedBlock icon="InfoBox" heading={$t('Meta')}>
+    <PortableText text={data.about.body} />
+  </HeadedBlock>
 </ContentWrapper>
 
 <style lang="scss">