setup tailwind & content

Signed-off-by: nurRiyad <asadnurriyad@gmail.com>

.gitignore

@@ -1,17 +1,7 @@
-*.log
+# Nuxt dev/build outputs
-nuxt.d.ts
-
-# private config
-.env
-
-# deps
-node_modules
-
-# build or generate
-.nuxt
-dist
 .output
-
+.nuxt
-# IDE
+# Node dependencies
-.idea
+node_modules
-.vercel
+# System files
+*.log

app.vue

@@ -1,5 +1,7 @@
 <template>
   <div>
-    <NuxtWelcome />
+    <NuxtLayout>
+      <NuxtPage/>
+    </NuxtLayout>
   </div>
 </template>

components/page/footer.vue

@@ -0,0 +1,3 @@
+<template>
+  <div>This is a page footer</div>
+</template>

components/page/header.vue

@@ -0,0 +1,3 @@
+<template>
+  <div>This is a page header</div>
+</template>

content/blogs/1. hello-world.md

@@ -0,0 +1 @@
+# Hello world

content/blogs/2. hello-man.md

@@ -0,0 +1 @@
+# Hello man

layouts/default.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>
+    <PageHeader/>
+    <div class="h-full bg-slate-600">
+      <slot />
+    </div>
+    <PageFooter/>
+  </div>
+</template>

nuxt.config.ts

@@ -1,4 +1,19 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
 
-})
+  app: {
+    head: {
+      charset: "utf-16",
+      viewport: "width=device-width,initial-scale=1",
+      title: "Elon's Blog",
+      titleTemplate: "%s - Elon's Blog",
+      meta: [{ name: "description", content: "Elon's awesome blog" }],
+    },
+  },
+  
+  typescript: {
+    strict: true,
+  },
+
+  modules: ["@nuxt/content", "@nuxtjs/tailwindcss"],
+});

package.json

@@ -8,6 +8,8 @@
     "postinstall": "nuxt prepare"
   },
   "devDependencies": {
+    "@nuxt/content": "^2.3.0",
+    "@nuxtjs/tailwindcss": "^6.1.3",
     "nuxt": "3.0.0"
   }
 }

pages/blogs/[blog].vue

@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <ContentDoc/>
+  </div>
+</template>

pages/blogs/index.vue

@@ -0,0 +1,5 @@
+<template>
+  <div>
+    There will be all blogs
+  </div>
+</template>

pages/categories/[category].vue

@@ -0,0 +1,5 @@
+<template>
+  <div>
+    {{ $route.params }}
+  </div>
+</template>

pages/categories/index.vue

@@ -0,0 +1,3 @@
+<template>
+  <div>All categories will be here</div>
+</template>

pages/index.vue

@@ -0,0 +1,22 @@
+<script lang="ts" setup>
+
+
+useHead({
+  title: "Home",
+  meta: [
+    {
+      name: "description",
+      content: "Home",
+    },
+  ],
+  titleTemplate: "Elon's Blog - %s",
+});
+
+</script>
+<template>
+  <main>
+    
+   <h1>This ia main section</h1>
+  </main>
+</template>
+