chore: update styles and blog permalinks

src/assets/styles/tailwind.css

@@ -39,13 +39,12 @@
 }
 
 #header.scroll > div:first-child {
-  @apply bg-page md:bg-white/90 md:backdrop-blur-md;
   box-shadow: 0 0.375rem 1.5rem 0 rgb(140 152 164 / 13%);
 }
 .dark #header.scroll > div:first-child,
 #header.scroll.dark > div:first-child {
-  @apply bg-page md:bg-[#030621e6] border-b border-gray-500/20;
-  box-shadow: none;
+  @apply border-b border-gray-500/20;
+  @apply shadow-lg shadow-black/10;
 }
 /* #header.scroll > div:last-child {
   @apply py-3;

src/components/blog/ListItem.astro

@@ -1,6 +1,7 @@
 ---
 import type { ImageMetadata } from 'astro';
 import { Icon } from 'astro-icon/components';
+
 import Image from '~/components/common/Image.astro';
 import PostTags from '~/components/blog/Tags.astro';
 

src/components/widgets/Header.astro

@@ -52,7 +52,7 @@ const currentPath = `/${trimSlash(new URL(Astro.url).pathname)}`;
 <header
   class:list={[
     { sticky: isSticky, relative: !isSticky, dark: isDark },
-    'top-0 z-40 flex-none mx-auto w-full border-b border-gray-50/0 transition-[opacity] ease-in-out',
+    'top-0 z-40 flex-none mx-auto w-full border-b border-gray-50/0 transition-[opacity] ease-in-out bg-light dark:bg-dark md:bg-white/90 dark:md:bg-[#030621e6] md:backdrop-blur-md',
   ]}
   {...isSticky ? { 'data-aw-sticky-header': true } : {}}
   {...id ? { id } : {}}
@@ -99,7 +99,7 @@ const currentPath = `/${trimSlash(new URL(Astro.url).pathname)}`;
                     {text}{' '}
                     <Icon name="tabler:chevron-down" class="w-3.5 h-3.5 ml-0.5 rtl:ml-0 rtl:mr-0.5 hidden md:inline" />
                   </button>
-                  <ul class="dropdown-menu md:backdrop-blur-md dark:md:bg-dark rounded md:absolute pl-4 md:pl-0 md:hidden font-medium md:bg-white/90 md:min-w-[200px] drop-shadow-xl">
+                  <ul class="dropdown-menu md:backdrop-blur-md dark:md:bg-[#11132b] rounded md:absolute pl-4 md:pl-0 md:hidden font-medium md:bg-white/90 md:min-w-[200px] drop-shadow-xl dark:md:shadow-md dark:md:shadow-black/50">
                     {links.map(({ text: text2, href: href2 }) => (
                       <li>
                         <a
@@ -108,6 +108,7 @@ const currentPath = `/${trimSlash(new URL(Astro.url).pathname)}`;
                             { 'aw-link-active': href2 === currentPath },
                           ]}
                           href={href2}
+                          target={href2?.startsWith('http') ? '_blank' : undefined}
                         >
                           {text2}
                         </a>
@@ -122,6 +123,7 @@ const currentPath = `/${trimSlash(new URL(Astro.url).pathname)}`;
                     { 'aw-link-active': href === currentPath },
                   ]}
                   href={href}
+                  target={href?.startsWith('http') ? '_blank' : undefined}
                 >
                   {text}
                 </a>

src/config.yaml

@@ -38,7 +38,7 @@ apps:
 
     post:
       isEnabled: true
-      permalink: '/%slug%' # Variables: %slug%, %year%, %month%, %day%, %hour%, %minute%, %second%, %category%
+      permalink: '/blog/%year%-%month%-%day%-%slug%' # Variables: %slug%, %year%, %month%, %day%, %hour%, %minute%, %second%, %category%
       robots:
         index: true
 
@@ -50,18 +50,18 @@ apps:
 
     category:
       isEnabled: true
-      pathname: 'category' # Category main path /category/some-category, you can change this to "group" (/group/some-category)
+      pathname: 'blog/category' # Category main path /category/some-category, you can change this to "group" (/group/some-category)
       robots:
         index: true
 
     tag:
       isEnabled: true
-      pathname: 'tag' # Tag main path /tag/some-tag, you can change this to "topics" (/topics/some-category)
+      pathname: 'blog/tag' # Tag main path /tag/some-tag, you can change this to "topics" (/topics/some-category)
       robots:
         index: false
 
     isRelatedPostsEnabled: true
-    relatedPostsCount: 4
+    relatedPostsCount: 3
 
 analytics:
   vendors:

src/navigation.js

@@ -3,15 +3,28 @@ import { getPermalink, getBlogPermalink } from './utils/permalinks';
 export const headerData = {
   links: [
     {
-      text: 'Shopify Apps',
+      text: 'Apps',
       links: [
         {
-          text: 'Free Shipping Bar',
+          text: 'Free Shipping Bar - Shopify',
           href: '#'
         },
+      ],
+    },
+    {
+      text: 'Projects',
+      links: [
         {
-          text: 'More Coming Soon',
-          href: '#'
+          text: 'shiddy.biz',
+          href: 'https://shiddy.biz/'
+        },
+        {
+          text: 'shiddy.biz',
+          href: 'https://shiddy.biz/'
+        },
+        {
+          text: 'shiddy.biz',
+          href: 'https://shiddy.biz/'
         },
       ],
     },