create-comate-pagebuilder 1.0.6 → 1.0.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-comate-pagebuilder",
-  "version": "1.0.6",
+  "version": "1.0.8",
   "description": "Create a modern, minimalist React + Vite + Tailwind CSS project",
   "type": "commonjs",
   "bin": {

package/template/package-lock.json

@@ -1,12 +1,12 @@
 {
-  "name": "PageBuilder-react-template",
-  "version": "1.0.6",
+  "name": "pagebuilder-react-template",
+  "version": "1.0.8",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
-      "name": "PageBuilder-react-template",
-      "version": "1.0.6",
+      "name": "pagebuilder-react-template",
+      "version": "1.0.8",
       "dependencies": {
         "clsx": "^2.1.0",
         "framer-motion": "^12.23.24",

package/template/package.json

@@ -1,6 +1,6 @@
 {
-  "name": "PageBuilder-react-template",
-  "version": "1.0.6",
+  "name": "pagebuilder-react-template",
+  "version": "1.0.8",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/template/src/index.css

@@ -2,14 +2,26 @@
 @tailwind components;
 @tailwind utilities;
 
-/* PageBuilder 全局样式基础 */
+/*
+ * TODO: 本文件使用了自定义颜色，需要在 tailwind.config.js 中定义：
+ * - primary (主要按钮背景)
+ * - secondary (次要按钮背景)
+ * - foreground (主要文本)
+ * - muted-foreground (次要文本)
+ * - border (边框)
+ * - muted (浅色背景)
+ */
+
+/* pagebuilder 全局样式基础 */
 @layer base {
   * {
-    @apply border-neutral-200;
+    /* 需要定义 border */
+    @apply border-border;
   }
 
   body {
-    @apply bg-white text-neutral-900 antialiased;
+    /* 需要定义 foreground */
+    @apply bg-white text-foreground antialiased;
   }
 
   h1, h2, h3, h4, h5, h6 {
@@ -20,14 +32,16 @@
 @layer components {
   /* 标准按钮样式 */
   .btn-primary {
-    @apply px-6 py-3 bg-primary-600 text-white rounded-lg font-medium
-           hover:bg-primary-700 active:scale-95 transition-all duration-200
+    /* 需要定义 primary */
+    @apply px-6 py-3 bg-primary text-white rounded-lg font-medium
+           hover:brightness-90 active:scale-95 transition-all duration-200
            shadow-sm hover:shadow-md;
   }
 
   .btn-secondary {
-    @apply px-6 py-3 bg-neutral-100 text-neutral-900 rounded-lg font-medium
-           hover:bg-neutral-200 active:scale-95 transition-all duration-200;
+    /* 需要定义 secondary, foreground */
+    @apply px-6 py-3 bg-secondary text-foreground rounded-lg font-medium
+           hover:brightness-95 active:scale-95 transition-all duration-200;
   }
 }
 

package/template/src/pages/Home.jsx

@@ -1,5 +1,9 @@
 import { Link } from 'react-router'
 
+/**
+ * TODO: 本组件使用了自定义颜色 muted-foreground
+ * 需要在 tailwind.config.js 中定义
+ */
 export default function Home() {
   return (
     <main className="min-h-screen flex items-center justify-center px-6 py-20">
@@ -7,7 +11,8 @@ export default function Home() {
         <h1 className="text-6xl font-bold mb-6">
           Welcome
         </h1>
-        <p className="text-xl text-neutral-600">
+        {/* 需要定义 muted-foreground */}
+        <p className="text-xl text-muted-foreground">
           Start building your application here
         </p>
       </div>

package/template/tailwind.config.js

@@ -7,43 +7,24 @@ export default {
   theme: {
     extend: {
       colors: {
-        // PageBuilder 标准配色系统，请务必按需进行调整修改
-        primary: {
-          50: '#f0f9ff',
-          100: '#e0f2fe',
-          200: '#bae6fd',
-          300: '#7dd3fc',
-          400: '#38bdf8',
-          500: '#0ea5e9',
-          600: '#0284c7',
-          700: '#0369a1',
-          800: '#075985',
-          900: '#0c4a6e',
-        },
-        accent: {
-          50: '#f0fdf4',
-          100: '#dcfce7',
-          200: '#bbf7d0',
-          300: '#86efac',
-          400: '#4ade80',
-          500: '#22c55e',
-          600: '#16a34a',
-          700: '#15803d',
-          800: '#166534',
-          900: '#14532d',
-        },
-        neutral: {
-          50: '#fafafa',
-          100: '#f5f5f5',
-          200: '#e5e5e5',
-          300: '#d4d4d4',
-          400: '#a3a3a3',
-          500: '#737373',
-          600: '#525252',
-          700: '#404040',
-          800: '#262626',
-          900: '#171717',
-        }
+        // TODO: 请根据项目需求定义配色方案（只需填写单个颜色值即可）
+      
+        // 使用场景说明：
+        // - primary: 主色，用于主要按钮背景 (bg-primary)
+        // - secondary: 次要色，用于次要按钮背景 (bg-secondary)
+        // - accent: 强调色，用于高亮、提示等（可选）
+        // - foreground: 深色，用于主要文本 (text-foreground)
+        // - muted-foreground: 中等色，用于次要文本 (text-muted-foreground)
+        // - border: 用于边框 (border-border)
+        // - muted: 浅色，用于背景 (bg-muted)
+
+        // primary: '',
+        // secondary: '',
+        // accent: '',
+        // foreground: '',
+        // 'muted-foreground': '',
+        // border: '',
+        // muted: '',
       },
       fontFamily: {
         sans: ['Inter', 'system-ui', 'sans-serif'],