WindowBird/ct
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

item3卡片瘦身

Browse Source
This commit is contained in:
WindowBird 2025-09-30 18:02:35 +08:00
parent 4716b6c3a9
commit be383c19c7
2 changed files with 4 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/components/index/item3.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div class="bg-gray-50 dark:bg-gray-900 py-16"> <div class="bg-gray-50 dark:bg-gray-900 py-16">
<div class="container mx-auto px-4 max-w-8xl"> <div class="container mx-auto px-4 max-w-6xl">
<!-- 页面标题 --> <!-- 页面标题 -->
<div class="text-center mb-12 px-4"> <div class="text-center mb-12 px-4">
<h1 class="text-3xl lg:text-4xl font-bold text-gray-900 dark:text-white mb-4"> <h1 class="text-3xl lg:text-4xl font-bold text-gray-900 dark:text-white mb-4">
@ -22,7 +22,7 @@
> >
<!-- 默认卡片 --> <!-- 默认卡片 -->
<div <div
class="bg-white dark:bg-gray-800 rounded-xl p-6 shadow-sm border border-gray-200 dark:border-gray-700 transition-all duration-300 group-hover:shadow-lg h-full mx-2"> class="bg-white dark:bg-gray-800 rounded-xl p-6 shadow-sm border border-gray-200 dark:border-gray-700 transition-all duration-300 group-hover:shadow-lg h-full flex flex-col items-center">
<!-- 图标区域 --> <!-- 图标区域 -->
<div :class="scene.bgColor" class="w-16 h-16 rounded-lg flex items-center justify-center mb-4 mx-auto"> <div :class="scene.bgColor" class="w-16 h-16 rounded-lg flex items-center justify-center mb-4 mx-auto">
<UIcon :class="scene.iconColor" :name="scene.icon" class="w-8 h-8"/> <UIcon :class="scene.iconColor" :name="scene.icon" class="w-8 h-8"/>
@ -33,7 +33,7 @@
</h3> </h3>
<!-- 设备列表 --> <!-- 设备列表 -->
<ul class="space-y-2 text-center"> <ul class="space-y-2 text-center ">
<li <li
v-for="(device, deviceIndex) in scene.devices" :key="deviceIndex" v-for="(device, deviceIndex) in scene.devices" :key="deviceIndex"
class="text-gray-600 dark:text-gray-400 text-sm" class="text-gray-600 dark:text-gray-400 text-sm"
@ -45,7 +45,7 @@
</div> </div>
<!-- 悬浮详情卡片 --> <!-- 悬浮详情卡片 -->
<div v-if="activeScene === index" class="absolute top-0 left-0 w-full h-full z-10 mx-2"> <div v-if="activeScene === index" class="absolute top-0 left-0 h-full z-10 flex flex-col items-center">
<div :class="scene.hoverBgColor" class="rounded-xl p-6 h-full text-white shadow-xl flex flex-col"> <div :class="scene.hoverBgColor" class="rounded-xl p-6 h-full text-white shadow-xl flex flex-col">
<h3 class="text-xl font-semibold mb-4">{{ scene.title }}</h3> <h3 class="text-xl font-semibold mb-4">{{ scene.title }}</h3>
<p class="text-sm opacity-90 mb-6 leading-relaxed"> <p class="text-sm opacity-90 mb-6 leading-relaxed">

18
tailwind.config.js
View File

@ -1,18 +0,0 @@
// tailwind.config.js
/** @type {import('tailwindcss').Config} */
export default {
content: [
'./components/**/*.{js,vue,ts}',
'./layouts/**/*.vue',
'./pages/**/*.vue',
'./plugins/**/*.{js,ts}',
'./app.vue',
'./error.vue'
],
theme: {
extend: {
// 自定义主题配置
}
},
plugins: []
}