add: category, date sorting

Add category layouts and date sorting

app/components/Blog/Category.vue

@@ -0,0 +1,24 @@
+<template>
+  <Icon :name="icon" mode="svg"/>
+  {{ name }}
+</template>
+
+<script setup lang="ts">
+import type { Category } from './types'
+
+type Props = {
+  name: Category
+}
+
+const { name } = defineProps<Props>()
+
+const icons: Record<Category, string> = {
+  'story': 'ph:chat-circle-dots-duotone',
+  'snippet': 'ph:code-duotone',
+  'tutorial': 'ph:lightbulb-duotone',
+  'news': 'ph:newspaper-duotone',
+  'freelancing': 'ph:laptop-duotone',
+}
+
+const icon = computed(() => name ? icons[name] : 'ph:question-mark-duotone')
+</script>