中文化

static/js/my-editor.js

@@ -734,20 +734,153 @@
       "File Upload": "檔案上傳",
       "Date Input": "日期輸入框",
       "Password Input": "密碼輸入框",
-      "Email Input": "Email 輸入框"
+      "Email Input": "Email 輸入框",
+
+      // 屬性面板 - 標題與一般屬性
+      "General": "一般",
+      "Id": "ID",
+      "Title": "標題 (Title)",
+      "Class": "類別 (Class)",
+      "Display": "顯示 (Display)",
+      "Position": "定位 (Position)",
+      "Top": "上",
+      "Left": "左",
+      "Bottom": "下",
+      "Right": "右",
+      "Float": "浮動 (Float)",
+      "Opacity": "透明度 (Opacity)",
+      "Background": "背景 (Background)",
+      "Background Color": "背景顏色",
+      "Text Color": "文字顏色",
+      "Color": "顏色",
+
+      // 排版與字體
+      "Font size": "字體大小",
+      "Font weight": "字體粗細",
+      "Font family": "字體家族",
+      "Text align": "文字對齊",
+      "Line height": "行高",
+      "Letter spacing": "字距",
+      "Text decoration": "文字裝飾",
+      "Decoration Color": "裝飾顏色",
+      "Decoration style": "裝飾樣式",
+
+      // 尺寸與間距
+      "Size": "尺寸",
+      "Width": "寬度",
+      "Height": "高度",
+      "Min Width": "最小寬度",
+      "Min Height": "最小高度",
+      "Max Width": "最大寬度",
+      "Max Height": "最大高度",
+      "Margin": "外邊距 (Margin)",
+      "Padding": "內邊距 (Padding)",
+
+      // 邊框與陰影
+      "Border": "邊框 (Border)",
+      "Style": "樣式",
+      "Radius": "圓角 (Radius)",
+      "Radius Top Left": "左上圓角",
+      "Radius Top Right": "右上圓角",
+      "Radius Bottom Left": "左下圓角",
+      "Radius Bottom Right": "右下圓角",
+      "Background Image": "背景圖片",
+      "Box Shadow": "盒子陰影",
+      "Text Shadow": "文字陰影",
+      "Filter": "濾鏡",
+      "Transform": "變形",
+      "Transition": "過渡效果",
+
+      // 選項值
+      "Default": "預設",
+      "Primary": "主要 (Primary)",
+      "Secondary": "次要 (Secondary)",
+      "Success": "成功 (Success)",
+      "Danger": "危險 (Danger)",
+      "Warning": "警告 (Warning)",
+      "Info": "資訊 (Info)",
+      "Light": "亮色 (Light)",
+      "Dark": "暗色 (Dark)",
+      "White": "白色",
+      "Block": "區塊 (Block)",
+      "Inline": "行內 (Inline)",
+      "Inline Block": "行內區塊 (Inline Block)",
+      "Flex": "彈性 (Flex)",
+      "Inline Flex": "行內彈性 (Inline Flex)",
+      "Grid": "網格 (Grid)",
+      "Static": "靜態 (Static)",
+      "Fixed": "固定 (Fixed)",
+      "Relative": "相對 (Relative)",
+      "Absolute": "絕對 (Absolute)",
+
+      // 裝置響應式顯示
+      "Hide based on device screen width": "依裝置螢幕寬度隱藏",
+      "Extra small devices": "超小螢幕 (xs)",
+      "Small devices": "小螢幕 (sm)",
+      "Medium devices": "中螢幕 (md)",
+      "Large devices": "大螢幕 (lg)",
+      "Xl devices": "超大螢幕 (xl)",
+      "Xxl devices": "超超大螢幕 (xxl)",
+
+      // AOS 動畫
+      "Animate on scroll": "滾動動畫 (AOS)",
+      "Animation type": "動畫類型",
+      "Duration": "持續時間",
+      "Delay": "延遲",
+      "Play animation": "播放動畫",
+      "[none]": "[無]",
+      "Fade animations": "淡入淡出動畫",
+      "Fade": "淡入",
+      "Fade Up": "向上淡入",
+      "Fade down": "向下淡入",
+      "Fade left": "向左淡入",
+      "Fade right": "向右淡入",
+      "Fade up right": "向右上淡入",
+      "Fade up left": "向左上淡入",
+      "Fade down right": "向右下淡入",
+      "Fade down left": "向左下淡入",
+      "Flip animations": "翻轉動畫",
+      "Flip Up": "向上翻轉",
+      "Flip Down": "向下翻轉",
+      "Flip left": "向左翻轉",
+      "Flip right": "向右翻轉",
+      "Slide animations": "滑動動畫",
+      "Slide up": "向上滑動",
+      "Slide down": "向下滑動",
+      "Slide left": "向左滑動",
+      "Slide right": "向右滑動",
+      "Zoom animations": "縮放動畫",
+      "Zoom in": "放大",
+      "Zoom in up": "向上放大",
+      "Zoom in down": "向下放大",
+      "Zoom in left": "向左放大",
+      "Zoom in right": "向右放大",
+      "Zoom out": "縮小",
+      "Zoom out up": "向上縮小",
+      "Zoom out down": "向下縮小",
+      "Zoom out left": "向左縮小",
+      "Zoom out right": "向右縮小",
+
+      // 連結樣式提示
+      "Linked styles": "共用樣式提示"
+    };
+
+    const translateText = (text) => {
+      if (!text || typeof text !== "string") return text;
+      const trimmed = text.trim();
+      return translateMap[trimmed] ? translateMap[trimmed] : text;
     };
 
     // 1. 翻譯 Vvveb 物件內的資料 (供重新渲染時使用)
     if (Vvveb.ComponentsGroup) {
       const newGroups = {};
       for (let group in Vvveb.ComponentsGroup) {
-        let tGroup = translateMap[group] || group;
+        let tGroup = translateText(group);
         newGroups[tGroup] = Vvveb.ComponentsGroup[group];
-        
         newGroups[tGroup].forEach(compName => {
           let comp = Vvveb.Components.get(compName);
           if (comp && comp.name) {
-            comp.name = translateMap[comp.name] || comp.name;
+            comp.name = translateText(comp.name);
           }
         });
       }
@@ -757,13 +890,36 @@
     if (Vvveb.BlocksGroup) {
       const newBlockGroups = {};
       for (let group in Vvveb.BlocksGroup) {
-        let tGroup = translateMap[group] || group;
+        let tGroup = translateText(group);
         newBlockGroups[tGroup] = Vvveb.BlocksGroup[group];
       }
       Vvveb.BlocksGroup = newBlockGroups;
     }
 
-    // 2. 直接修改當前已渲染的 DOM 文字
+    // 2. 翻譯所有元件的屬性面板 (Style, Advanced, etc)
+    if (Vvveb.Components && Vvveb.Components._components) {
+      Object.keys(Vvveb.Components._components).forEach(key => {
+        let comp = Vvveb.Components._components[key];
+        if (comp.properties) {
+          comp.properties.forEach(prop => {
+            if (prop.name) prop.name = translateText(prop.name);
+            if (prop.data) {
+              if (prop.data.header) prop.data.header = translateText(prop.data.header);
+              if (prop.data.text) prop.data.text = translateText(prop.data.text);
+              if (prop.data.options && Array.isArray(prop.data.options)) {
+                prop.data.options.forEach(opt => {
+                  if (opt.text) opt.text = translateText(opt.text);
+                  if (opt.title) opt.title = translateText(opt.title);
+                  if (opt.optgroup) opt.optgroup = translateText(opt.optgroup);
+                });
+              }
+            }
+          });
+        }
+      });
+    }
+
+    // 3. 直接修改當前已渲染的 DOM 文字
     document.querySelectorAll(".components-list .header span, .blocks-list .header span, .sections-list .header span").forEach(el => {
       const txt = el.textContent.trim();
       if (translateMap[txt]) {

websites/my-website/my-page2.html

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="description" content="">
+    <meta name="author" content="">
+    <title>My page</title>
+    <!-- Bootstrap core CSS -->
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.min.js"></script>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet">
+	
+    <script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
+    <style>
+		html, body
+		{
+			width:100%;
+			height:100%;
+		}
+    </style>
+  </head>
+  <body>
+    <!-- Page Content -->
+    <div class="container">
+      <div class="row">
+        <div class="col-lg-12 text-center">
+          <h1 class="mt-5">Bootstrap 5 start page</h1>
+          <p class="lead">Start by dragging components to page or double click to edit text</p>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>