diff --git a/README-EN.md b/README-EN.md index c19113f..e4d0c42 100644 --- a/README-EN.md +++ b/README-EN.md @@ -29,6 +29,12 @@
A modern Vue 3 Gantt chart component library providing complete solutions for project management and task scheduling
+
+
+
+
+
📱 Live Demo
diff --git a/README.md b/README.md
index b188d6f..d972dc4 100644
--- a/README.md
+++ b/README.md
@@ -29,6 +29,12 @@
现代化的 Vue 3 甘特图组件库,为项目管理和任务调度提供完整解决方案
+
+
📱 在线演示
diff --git a/demo/App.vue b/demo/App.vue
index 6902cbe..f0cfaa9 100644
--- a/demo/App.vue
+++ b/demo/App.vue
@@ -756,7 +756,17 @@ const handleTaskRowMoved = async (payload: {
packageInfo.version
}}
-
+
+
@@ -1968,6 +1978,106 @@ const handleTaskRowMoved = async (payload: {
display: flex;
align-items: center;
gap: 12px;
+ flex: 1;
+}
+
+.title-center {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex: 0 0 auto;
+}
+
+.title-right {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ flex: 1;
+ justify-content: flex-end;
+}
+
+.gitee-award-badge {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ background: linear-gradient(135deg, rgba(199, 29, 35, 0.08) 0%, rgba(255, 107, 53, 0.08) 100%);
+ color: #C71D23;
+ padding: 8px 18px;
+ border-radius: 20px;
+ font-size: 0.8rem;
+ font-weight: 600;
+ text-decoration: none;
+ border: 1.5px solid rgba(199, 29, 35, 0.2);
+ backdrop-filter: blur(10px);
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+ white-space: nowrap;
+ position: relative;
+ overflow: hidden;
+}
+
+.gitee-award-badge::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: -100%;
+ width: 100%;
+ height: 100%;
+ background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.15), transparent);
+ transition: left 0.5s ease;
+}
+
+.gitee-award-badge:hover {
+ transform: translateY(-1px);
+ background: linear-gradient(135deg, rgba(199, 29, 35, 0.12) 0%, rgba(255, 107, 53, 0.12) 100%);
+ border-color: rgba(199, 29, 35, 0.4);
+ box-shadow: 0 4px 16px rgba(199, 29, 35, 0.15);
+ color: #E32329;
+}
+
+.gitee-award-badge:hover::before {
+ left: 100%;
+}
+
+@keyframes pulse-glow {
+ 0%, 100% {
+ border-color: rgba(199, 29, 35, 0.2);
+ }
+ 50% {
+ border-color: rgba(255, 215, 0, 0.4);
+ }
+}
+
+/* 响应式设计 */
+@media (max-width: 1400px) {
+ .gitee-award-badge {
+ font-size: 0.75rem;
+ padding: 7px 16px;
+ }
+}
+
+@media (max-width: 1200px) {
+ .page-title {
+ flex-wrap: wrap;
+ }
+
+ .title-center {
+ order: 3;
+ flex: 1 0 100%;
+ margin-top: 10px;
+ justify-content: center;
+ }
+
+ .gitee-award-badge {
+ width: auto;
+ max-width: 100%;
+ }
+}
+
+@media (max-width: 768px) {
+ .gitee-award-badge {
+ font-size: 0.7rem;
+ padding: 6px 14px;
+ }
}
.gantt-icon {
diff --git a/demo/locales/en-US.json b/demo/locales/en-US.json
index f34f1ad..6766e7e 100644
--- a/demo/locales/en-US.json
+++ b/demo/locales/en-US.json
@@ -1,4 +1,8 @@
{
+ "giteeBadge": {
+ "text": "🥇 Gitee 2025 Open Source Awards 👉 Thanks for Your Vote",
+ "url": "https://gitee.com/activity/2025opensource?ident=IOUNZP"
+ },
"taskMoveConfirm": {
"title": "Confirm Task Move",
"confirmText": "Confirm",
diff --git a/demo/locales/zh-CN.json b/demo/locales/zh-CN.json
index 205d91c..fc8692e 100644
--- a/demo/locales/zh-CN.json
+++ b/demo/locales/zh-CN.json
@@ -1,4 +1,8 @@
{
+ "giteeBadge": {
+ "text": "🥇 Gitee 2025年度开源项目评选 👉 感谢您的参与投票",
+ "url": "https://gitee.com/activity/2025opensource?ident=IOUNZP"
+ },
"taskMoveConfirm": {
"title": "确认移动任务",
"confirmText": "确认",