add new

package.json

@@ -30,7 +30,10 @@
     "@types/node": "^20.12.5",
     "@vitejs/plugin-vue": "^5.0.4",
     "@vue/tsconfig": "^0.5.1",
+    "autoprefixer": "^10.4.20",
     "npm-run-all2": "^6.1.2",
+    "postcss": "^8.4.41",
+    "tailwindcss": "^3.4.9",
     "typescript": "~5.4.0",
     "vite": "^5.2.8",
     "vue-tsc": "^2.0.11"

postcss.config.js

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

src/components/blogs/ceshi.vue

@@ -1,29 +1,11 @@
 <template>
-  <a-row :gutter="16">
-    <a-col :xl="24" :xs="12">
-      <div class="responsive-box">Content 1</div>
-    </a-col>
-    <a-col :xs="12">
-      <div class="responsive-box">Content 2</div>
-    </a-col>
-    <a-col  :xs="12">
-      <div class="responsive-box">Content 3</div>
-    </a-col>
-    <!-- <a-col :xl="4">
-      <div class="responsive-box">Content 2</div>
-    </a-col>
-    <a-col  :xl="4">
-      <div class="responsive-box">Content 2</div>
-    </a-col>
-    <a-col :xl="4">
-      <div class="responsive-box">Content 2</div>
-    </a-col> -->
-  </a-row>
+    <div>ceshi</div>
 </template>
   
+<script setup lang='ts'>
+  
+</script>
+  
 <style>
-.responsive-box {
-  background-color: #f0f0f0;
-  text-align: center;
-}
+  
 </style>

src/components/blogs/header/CarouselImg.vue

@@ -22,5 +22,6 @@ const imgdatas: string[] = [
 .carousel img {
     height: 100vh;
     width: 100vw;
+    object-fit: cover;
 }
 </style>

src/stores/index.ts

@@ -3,6 +3,30 @@ import { defineStore } from 'pinia'
 import type { homePageInterface } from '@/api'
 import dayjs from 'dayjs';
 import { get } from '@/tools/request'
+// 后台admin的store
+
+
+// 前台blog的store
+export const blogHeaderStore=defineStore('blogheader',()=>{
+  const show_author=ref(true)
+  const show_menu=ref(false)
+  const searchValue=ref("")
+  return {show_author,show_menu,searchValue}
+})
+
+export const blogContentStore=defineStore('blogcontent',()=>{
+  const isEmpty=ref(false)
+  const isDisabled=ref(false)
+  const getTitle = ref("")
+  const titles = ref<{ title: string; lineIndex: string; indent: number }[]>([]);
+  const setTitles=(newTitles: { title: string; lineIndex: string; indent: number }[])=> {
+    titles.value = newTitles;
+  }
+  return {getTitle,setTitles,isEmpty,isDisabled}
+})
+
+
+
 export const mainWrapperStore = defineStore("mainWrapper", () => {
 })
 export const homePageStore = defineStore("homePage", () => {
@@ -30,8 +54,6 @@ export const homePageStore = defineStore("homePage", () => {
         isEmpty.value=false
       }
     })
-
-
   };
   const fetchHomeLabelPageList= async (query:any) => {
     // const response = await get(`/statistics/searchtitle?title=${query}`);

src/style.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

tailwind.config.js

@@ -0,0 +1,16 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: [
+    "./index.html",
+    "./src/**/*.{vue,js,ts,jsx,tsx}",
+  ],
+  theme: {
+    screens: {
+      '3xl': '1920px',
+      // => @media (min-width: 640px) { ... }
+    },
+    extend: {},
+  },
+  plugins: [],
+}
+