This commit is contained in:
X1627315083@163.com
2026-06-05 15:25:37 +08:00
8 changed files with 201 additions and 134 deletions

View File

@@ -10,7 +10,7 @@ export default {
UserStories: '使用者故事',
HelpCentre: '支援中心',
Media: '媒体报道',
ContactUs: '联我们',
ContactUs: '联我们',
MyAccount: '我的账户',
LoginOrSignin: '登入 / 注册'
},
@@ -26,7 +26,7 @@ export default {
PageNotFoundTitle: '该页面不存在',
PageNotFoundDesc: '这里似乎没有任何发现。',
Contact: '联络方法',
GetInTouch: '联系我们',
GetInTouch: '保持联系',
StayUpToDate: '通过我们的电子通讯掌握最新动态',
EmailAddress: '电邮地址',
Submit: '提交',
@@ -64,9 +64,9 @@ export default {
},
Aida: {
description:
'AiDA 3.1 是一项开创性的技术,使时装设计师能够基于自己的创意灵感,借助人工智能创作原创设计。设计师只需点击几下,即可选择或调整方案来开发时装系列,为传统且耗时的设计工作室流程注入敏捷性、高效性和灵活性。',
'AiDA 3.1,一项首次上市的技术,使时装设计师能够根据他们的创意灵感,与AI合作创造原创设计。 只需简单数下点击,设计师便可轻松地在时装系列中进行微调或加入个人化选项,以灵活、高效及别具弹性的方式提升传统而密集的工作室设计流程。',
slogan: '互动性人工智能时装设计助理',
desc: 'AiDA 3.1 是一项开创性的技术,使时装设计师能够基于自己的创意灵感,借助人工智能创作原创设计。设计师只需点击几下,即可选择或调整方案来开发时装系列,为传统且耗时的设计工作室流程注入敏捷性、高效性和灵活性。',
desc: 'AiDA 3.1,一项首次上市的技术,使时装设计师能够根据他们的创意灵感,与AI合作创造原创设计。 只需简单数下点击,设计师便可轻松地在时装系列中进行微调或加入个人化选项,以灵活、高效及别具弹性的方式提升传统而密集的工作室设计流程。',
annual: '年费: $5,000 HKD / 年(50000积分)',
monthly: '月费: $500 HKD / 月 (3500 积分)',
monthlyCheaper: '月费: $100 HKD / 月 (500 积分)',
@@ -98,8 +98,8 @@ export default {
trial: '试用',
days: '7天免费试用',
start: '开始使用',
corporate: '企业',
customised: '定制计划',
corporate: '公司账户',
customised: '客制方案',
contactUs: '联系我们',
termsAndConditions: '条款及细则',
agreement: '订阅协议'

View File

@@ -62,6 +62,48 @@ export default {
EmailInputTitle: '有興趣使用精準時裝屬性及顏色辨識系統 (Mixi)',
EmailInputTip: '請留下電郵地址,以獲取度身訂造的計劃'
},
Aida: {
description:
'AiDA 3.1一項首次上市的技術使時裝設計師能夠根據他們的創意靈感與AI合作創造原創設計。 只需簡單數下點擊,設計師便可輕鬆地在時裝系列中進行微調或加入個人化選項,以靈活、高效及別具彈性的方式提升傳統而密集的工作室設計流程。',
slogan: '互動性人工智能時裝設計助理',
desc: 'AiDA 3.1一項首次上市的技術使時裝設計師能夠根據他們的創意靈感與AI合作創造原創設計。 只需簡單數下點擊,設計師便可輕鬆地在時裝系列中進行微調或加入個人化選項,以靈活、高效及別具彈性的方式提升傳統而密集的工作室設計流程。',
annual: '年費: $5,000 HKD / 年(50000積分)',
monthly: '月費: $500 HKD / 月 (3500 積分)',
monthlyCheaper: '月費: $100 HKD / 月 (500 積分)',
tips: '可提供專屬教育優惠,詳情請聯絡我們',
subscribe: '立即訂閱',
userManual: '用戶手冊',
keyFeatures: '技術特點',
feature1:
'世界上第一個服裝設計領域的人工智能系統,強調用戶控制,確保人工智能生成的設計與設計師的獨特願景和品牌身份無縫結合。',
feature2:
'擅長綜合不同的輸入,如情緒板、織物印花、顏色選擇和草圖,成為一個有凝聚力的集合,快速,和諧,高效。',
feature3: '設計過程顯著加快超過60%,根據用戶輸入快速生成無限的設計。',
feature4: '採用尖端的AIGC技術生成創新設計並在創作過程中提供全面的協助。',
benefits: '對行業的好處',
benefits1:
'加快設計流程: AiDA為個人設計師和時尚品牌提供快速創意構思革新了時裝設計過程讓設計師以靈活、高效及別具彈性的方式提升傳統而密集的工作室設計流程。',
benefits2: '加快產品上市速度: 同時又能確保品牌的標誌性設計元素在新設計中得以體現。',
benefits3:
'更有彈性: 讓沒有繪畫基礎的時裝設計初學者也可以簡易地創作自己的設計。設計師們通過和 AI 一起合作,可以迅速創作多樣化的原創設計產品,並快速把這些產品推向市場。',
demo: '示範影片',
play: '點擊播放',
choosePlan: '選擇你的訂閱方案',
plan1: '根據你的創意靈感及品牌DNA只需要10秒時間去設計一個時裝系列',
plan2: '上載靈感板、顏色、布料印花圖案及草圖等,生成無限設計建議',
plan3: '只需點擊幾下,儲存及取回你的設計',
plan4: '訂閱後只需透過雲端系統就能隨時隨地存取',
plan5: '操作精簡,只需大概十分鐘就能學習使用方法',
plan6: '通過 info\\@code-create.com.hk 聯絡我們了解更多',
trial: '試用',
days: '7天免費試用',
start: '開始使用',
corporate: '公司賬戶',
customised: '客製方案',
contactUs: '聯絡我們',
termsAndConditions: '條款及細則',
agreement: '訂閱協議'
},
helpCentre: {
Title: '支援中心',
FAQ: '常見問題',

View File

@@ -443,12 +443,14 @@
<div class="plans-grid">
<article v-for="plan in plans" :key="plan.name" class="plan-card">
<img
class="plan-icon"
:src="plan.icon"
:alt="`${plan.name} plan icon`"
loading="lazy"
/>
<div class="plan-icon-wrap">
<img
class="plan-icon"
:src="plan.icon"
:alt="`${plan.name} plan icon`"
loading="lazy"
/>
</div>
<h3 class="plan-title">{{ plan.name }}</h3>
<p class="plan-copy">{{ plan.description }}</p>
<a class="plan-button" :href="plan.href">{{ plan.action }}</a>
@@ -816,16 +818,17 @@
margin-bottom: 27px;
font-size: clamp(28px, 3vw, 43px);
line-height: 1.2;
text-align: left;
text-align: center;
}
.subscription-list {
margin: 0 auto 52px;
padding: 0;
list-style: none;
color: #333333;
font-size: 13px;
line-height: 1.48;
color: #555;
font-size: 16px;
font-weight: 400;
// line-height: 1.48;
}
.subscription-list li {
@@ -870,11 +873,21 @@
text-align: center;
}
.plan-icon {
width: 86px;
height: 86px;
object-fit: contain;
.plan-icon-wrap {
display: flex;
align-items: center;
justify-content: center;
width: 100px;
height: 100px;
margin-bottom: 30px;
border: 3px solid #666666;
border-radius: 50%;
}
.plan-icon {
width: 50px;
height: 50px;
object-fit: contain;
}
.plan-title {

View File

@@ -526,8 +526,8 @@
.home-carousel {
.carousel-slide {
aspect-ratio: auto;
height: 365px;
min-height: 365px;
height: 504px;
min-height: 504px;
.carousel-banner {
height: 100%;
@@ -596,4 +596,13 @@
transform: translateX(0);
}
}
// @media (max-width: 768px) and (min-height: 844px) {
// .home-carousel {
// .carousel-slide {
// height: 504px;
// min-height: 504px;
// }
// }
// }
</style>

View File

@@ -30,7 +30,7 @@
:src="backgroundImage"
:alt="backgroundAlt"
loading="lazy"
translate-x-s="-100"
translate-x-s="0"
translate-x="100"
/>
<img
@@ -46,13 +46,8 @@
<div class="product-feature-copy">
<p class="product-feature-name">{{ name }}</p>
<h2 class="product-feature-title">{{ title }}</h2>
<RouterLink
class="product-feature-link"
:to="to"
translate-y-s="100"
translate-y="0"
>
{{$t('Home.viewMore')}}
<RouterLink class="product-feature-link" :to="to">
{{ $t('Home.viewMore') }}
</RouterLink>
</div>
</section>
@@ -63,12 +58,18 @@
display: flex;
align-items: center;
gap: clamp(48px, 5.5vw, 76px);
width: 100%;
max-width: 1440px;
min-width: 0;
min-height: 690px;
margin: 0 auto;
padding: 100px 15px;
justify-content: center;
box-sizing: border-box;
overflow-x: hidden;
& > div {
width: 50%;
// width: 50%;
box-sizing: content-box;
}
}
@@ -89,15 +90,17 @@
.product-feature-art {
position: relative;
width: min(100%, 560px);
width: clamp(320px, 45vw, 560px);
min-width: 0;
min-height: 560px;
justify-self: start;
flex: 0 1 auto;
overflow: hidden;
}
.product-feature-bg {
display: block;
width: min(100%, 480px);
width: clamp(200px, 70%, 400px);
max-width: 100%;
height: auto;
user-select: none;
@@ -105,52 +108,51 @@
.product-feature-panel {
position: absolute;
right: 0;
bottom: 94px;
width: min(72%, 380px);
max-width: 100%;
left: 15%;
top: 53.329%;
max-width: 400px;
width: auto;
height: auto;
user-select: none;
}
.product-feature-reversed .product-feature-bg {
width: min(100%, 460px);
width: 70%;
margin-left: auto;
}
.product-feature-reversed .product-feature-panel {
right: auto;
left: -88px;
bottom: 70px;
width: min(78%, 430px);
left: 0;
top: 53.329%;
}
.product-feature-copy {
position: relative;
z-index: 1;
max-width: 590px;
max-width: 450px;
min-width: 0;
justify-self: start;
padding-bottom: 18px;
flex: 1 1 auto;
}
.product-feature-name {
margin: 0 0 20px;
color: #6e6e6e;
color: #666666;
font-family: Poppins, sans-serif;
font-size: 18px;
font-weight: 700;
font-size: 24px;
font-weight: 600;
line-height: 1;
letter-spacing: 2px;
}
.product-feature-title {
margin: 0 0 28px;
color: #252525;
margin: 0 0 10px;
color: #222222;
font-family: Poppins, sans-serif;
font-size: clamp(30px, 2.8vw, 38px);
font-weight: 700;
line-height: 1.16;
font-size: clamp(24px, 2.8vw, 39px);
font-weight: 600;
line-height: 1.3em;
letter-spacing: 2px;
text-transform: none;
overflow-wrap: break-word;
@@ -160,19 +162,17 @@
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 152px;
min-height: 48px;
padding: 0 28px;
border-radius: 999px;
padding: 20px 40px;
border-radius: 40px;
color: #ffffff;
background: #a72125;
background: #9a2125;
font-family: Poppins, sans-serif;
font-size: 10px;
font-weight: 700;
line-height: 1;
font-size: 14px;
font-weight: 600;
letter-spacing: 2px;
text-decoration: none;
text-transform: uppercase;
margin-top: 12px;
transition:
background-color 0.2s ease,
transform 0.2s ease;
@@ -180,23 +180,23 @@
.product-feature-link:hover,
.product-feature-link:focus-visible {
background: #8e171b;
background: #63504b;
transform: translateY(-1px);
}
.product-feature-link:focus-visible {
outline: 2px solid #a72125;
outline: 2px solid #9a2125;
outline-offset: 4px;
}
@media (max-width: 980px) {
@media (max-width: 1024px) {
.product-feature,
.product-feature-reversed {
flex-direction: column-reverse;
gap: 24px;
width: min(680px, calc(100% - 40px));
min-height: 0;
padding: 70px 0;
padding: 60px 0;
}
.product-feature-reversed .product-feature-art,
@@ -219,17 +219,26 @@
padding-bottom: 0;
}
.product-feature-panel,
.product-feature-reversed .product-feature-panel {
left: 0;
max-width: 60%;
}
.product-feature-title {
font-size: 32px;
}
.product-feature-link {
font-size: 12px;
}
}
@media (max-width: 640px) {
@media (max-width: 767px) {
.product-feature,
.product-feature-reversed {
width: calc(100% - 32px);
gap: 28px;
padding: 0 0 64px;
padding: 20px 0;
}
.product-feature-art {
@@ -244,8 +253,7 @@
}
.product-feature-bg {
width: 72%;
margin-left: 38px;
width: 70%;
border-radius: 10px;
}
@@ -254,7 +262,8 @@
left: auto;
right: 12px;
bottom: 22px;
width: 72%;
top: auto;
max-width: 70%;
}
.product-feature-reversed .product-feature-bg {
@@ -267,31 +276,31 @@
right: auto;
left: 18px;
bottom: 16px;
width: 72%;
top: auto;
max-width: 70%;
}
.product-feature-name {
margin-bottom: 16px;
font-size: 18px;
font-size: 24px;
font-weight: 600;
letter-spacing: 1.5px;
}
.product-feature-title {
width: 100%;
max-width: 100%;
margin-bottom: 26px;
font-size: clamp(22px, 6.1vw, 26px);
margin-bottom: 10px;
font-size: 24px;
font-weight: 600;
line-height: 1.35;
letter-spacing: 1.2px;
overflow-wrap: anywhere;
}
.product-feature-link {
min-width: 100px;
min-height: 40px;
padding: 0 22px;
font-size: 9px;
letter-spacing: 1px;
font-size: 12px;
padding: 16px 32px;
}
}
</style>

View File

@@ -18,16 +18,15 @@
display: flex;
align-items: center;
justify-content: center;
min-height: 435px;
padding: 72px 20px;
background: #473935;
padding: 200px 0;
background: #463A37;
}
.project-cta-inner {
display: flex;
flex-direction: column;
align-items: center;
gap: 38px;
gap: 20px;
text-align: center;
}
@@ -35,9 +34,9 @@
margin: 0;
color: #ffffff;
font-family: Poppins, sans-serif;
font-size: clamp(22px, 2vw, 27px);
font-weight: 700;
line-height: 1.35;
font-size: clamp(22px, 2vw, 29px);
font-weight: 600;
line-height: 1.3em;
letter-spacing: 2px;
text-transform: capitalize;
}
@@ -46,16 +45,14 @@
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 158px;
min-height: 48px;
padding: 0 28px;
border-radius: 999px;
padding: 20px 40px;
border-radius: 40px;
color: #ffffff;
background: #ad2228;
background: #9A2125;
font-family: Poppins, sans-serif;
font-size: 10px;
font-weight: 700;
line-height: 1;
font-size: 14px;
font-weight: 600;
line-height: 1.2em;
letter-spacing: 2px;
text-decoration: none;
text-transform: uppercase;
@@ -66,7 +63,7 @@
.project-cta-link:hover,
.project-cta-link:focus-visible {
background: #93191f;
background: #000000;
transform: translateY(-1px);
}
@@ -75,14 +72,13 @@
outline-offset: 4px;
}
@media (max-width: 640px) {
@media (max-width: 767px) {
.project-cta {
min-height: 288px;
padding: 64px 20px;
padding: 100px 0;
}
.project-cta-inner {
gap: 28px;
gap: 20px;
}
.project-cta-title {
@@ -92,11 +88,8 @@
}
.project-cta-link {
min-width: 100px;
min-height: 40px;
padding: 0 22px;
font-size: 9px;
letter-spacing: 1px;
font-size: 12px;
padding: 16px 32px;
}
}
</style>

View File

@@ -23,7 +23,7 @@
panelImage: `${IMAGE_BASE_URL}/2024/01/new-layout-1.png`,
panelAlt: 'AiDA design workspace preview',
reversed: false,
to:'/aida'
to: '/aida'
},
{
name: 'Mixi',
@@ -33,7 +33,7 @@
panelImage: `${IMAGE_BASE_URL}/2022/11/mixi_intro_01_panel.png`,
panelAlt: 'Mixi visual search interface preview',
reversed: true,
to:'/mixi'
to: '/mixi'
}
]
})
@@ -110,7 +110,7 @@
}
.home-content {
padding: clamp(116px, 10vw, 172px) 0 clamp(92px, 8vw, 126px);
padding: 100px 0;
background: #ffffff;
}
@@ -119,28 +119,29 @@
flex-direction: column;
align-items: center;
justify-content: center;
padding: 0 20px clamp(92px, 10vw, 150px);
padding: 0 0 100px;
text-align: center;
}
.ecosystem-logo {
display: block;
width: clamp(146px, 15vw, 184px);
width: auto;
max-width: 100%;
height: auto;
margin-bottom: 30px;
margin-bottom: 16px;
user-select: none;
}
.ecosystem-title {
width: 100%;
max-width: 100%;
margin: 0 0 9px;
color: #101010;
margin: 0 0 8px;
color: #222222;
font-family: Poppins, sans-serif;
font-size: clamp(18px, 1.65vw, 22px);
font-weight: 700;
line-height: 1.25;
letter-spacing: 4px;
font-size: 24px;
font-weight: 600;
line-height: 1;
letter-spacing: 2px;
text-transform: uppercase;
overflow-wrap: break-word;
}
@@ -148,51 +149,51 @@
.ecosystem-subtitle {
width: 100%;
margin: 0;
color: #101010;
color: #333333;
font-family: Poppins, sans-serif;
font-size: clamp(13px, 1.2vw, 16px);
font-size: 18px;
font-weight: 600;
line-height: 1.35;
letter-spacing: 2.5px;
line-height: 1;
letter-spacing: 2px;
}
@media (max-width: 980px) {
@media (max-width: 1024px) {
.home-content {
padding: 96px 0 64px;
padding: 60px 0;
}
.ecosystem-intro {
padding-bottom: 50px;
padding-bottom: 60px;
}
}
@media (max-width: 640px) {
@media (max-width: 767px) {
.home-content {
padding: 52px 0 0;
padding: 40px 0;
}
.ecosystem-intro {
padding: 0 24px 58px;
padding: 40px 20px 40px 20px;
}
.ecosystem-logo {
width: 76px;
margin-bottom: 26px;
width: 100px;
margin-bottom: 54px;
}
.ecosystem-title {
width: min(100%, 330px);
max-width: none;
margin-bottom: 10px;
font-size: 18px;
letter-spacing: 1px;
line-height: 1.35;
margin-bottom: 20px;
font-size: 24px;
letter-spacing: 2px;
line-height: 1;
overflow-wrap: anywhere;
}
.ecosystem-subtitle {
font-size: 13px;
letter-spacing: 0.8px;
font-size: 18px;
letter-spacing: 2px;
}
}
</style>

View File

@@ -1 +1 @@
{"root":["./src/app.vue","./src/main.ts","./src/routes.ts","./src/vite-env.d.ts","./src/components/back-top.vue","./src/components/down-menu.vue","./src/components/email-box.vue","./src/components/main-footer.vue","./src/components/main-header.vue","./src/components/main-menu-dialog.vue","./src/components/video-model.vue","./src/directives/custom-animation.js","./src/directives/custom-show.js","./src/directives/index.ts","./src/directives/scroll-progress.ts","./src/directives/tween.ts","./src/lang/en.ts","./src/lang/index.ts","./src/lang/zh-cn.ts","./src/lang/zh-tw.ts","./src/pages/aboutview.vue","./src/pages/productsview.vue","./src/pages/about-us/ecosystem.vue","./src/pages/about-us/index.vue","./src/pages/about-us/mission.vue","./src/pages/about-us/our-team.vue","./src/pages/about-us/strategic-partners.vue","./src/pages/about-us/title.vue","./src/pages/aida/index.vue","./src/pages/contact-us/index.vue","./src/pages/events/all-events.vue","./src/pages/events/index.vue","./src/pages/events/list-en.js","./src/pages/events/list-zh-cn.js","./src/pages/events/list-zh-tw.js","./src/pages/events/swiper.vue","./src/pages/events-detail/index.vue","./src/pages/events-detail/list-en.js","./src/pages/events-detail/list-zh-cn.js","./src/pages/events-detail/list-zh-tw.js","./src/pages/help-centre/faq.vue","./src/pages/help-centre/index.vue","./src/pages/help-centre/title.vue","./src/pages/home/index.vue","./src/pages/home/components/carousel.vue","./src/pages/home/components/productfeature.vue","./src/pages/home/components/projectcta.vue","./src/pages/media/index.vue","./src/pages/media/list-en.js","./src/pages/media/list-zh-cn.js","./src/pages/media/list-zh-tw.js","./src/pages/mixi/index.vue","./src/pages/my-account/account-info.vue","./src/pages/my-account/address.vue","./src/pages/my-account/index.vue","./src/pages/my-account/login.vue","./src/pages/my-account/orders.vue","./src/pages/my-account/payment-methods.vue","./src/pages/my-account/register.vue","./src/pages/my-account/subscriptions.vue","./src/pages/my-account/tip-box.vue","./src/pages/my-account/welcome.vue","./src/pages/others/disclaimer.vue","./src/pages/others/not-found-404.vue","./src/pages/others/others-header.vue","./src/pages/others/privacy-policy.vue","./src/pages/others/site-map.vue","./src/pages/others/terms-of-use.vue","./src/pages/user-stories/index.vue","./src/pages/user-stories/user-list.vue","./src/stores/global.ts","./src/stores/index.ts","./src/stores/userinfo.ts","./src/tools/myevents.ts","./src/types/kagol-vue-carousel.d.ts"],"errors":true,"version":"6.0.3"}
{"root":["./src/app.vue","./src/main.ts","./src/routes.ts","./src/vite-env.d.ts","./src/components/back-top.vue","./src/components/down-menu.vue","./src/components/email-box.vue","./src/components/main-footer.vue","./src/components/main-header.vue","./src/components/main-menu-dialog.vue","./src/components/video-model.vue","./src/directives/custom-animation.js","./src/directives/custom-show.js","./src/directives/index.ts","./src/directives/scroll-progress.ts","./src/directives/tween.ts","./src/lang/en.ts","./src/lang/index.ts","./src/lang/zh-cn.ts","./src/lang/zh-tw.ts","./src/pages/aboutview.vue","./src/pages/productsview.vue","./src/pages/about-us/ecosystem.vue","./src/pages/about-us/index.vue","./src/pages/about-us/mission.vue","./src/pages/about-us/our-team.vue","./src/pages/about-us/strategic-partners.vue","./src/pages/about-us/title.vue","./src/pages/aida/index.vue","./src/pages/contact-us/index.vue","./src/pages/events/all-events.vue","./src/pages/events/index.vue","./src/pages/events/list-en.js","./src/pages/events/list-zh-cn.js","./src/pages/events/list-zh-tw.js","./src/pages/events/swiper.vue","./src/pages/events-detail/index.vue","./src/pages/events-detail/list-en.js","./src/pages/events-detail/list-zh-cn.js","./src/pages/events-detail/list-zh-tw.js","./src/pages/help-centre/faq.vue","./src/pages/help-centre/index.vue","./src/pages/help-centre/title.vue","./src/pages/home/index.vue","./src/pages/home/components/carousel.vue","./src/pages/home/components/productfeature.vue","./src/pages/home/components/projectcta.vue","./src/pages/media/index.vue","./src/pages/media/list-en.js","./src/pages/media/list-zh-cn.js","./src/pages/media/list-zh-tw.js","./src/pages/mixi/index.vue","./src/pages/my-account/account-info.vue","./src/pages/my-account/address.vue","./src/pages/my-account/index.vue","./src/pages/my-account/login.vue","./src/pages/my-account/orders.vue","./src/pages/my-account/payment-methods.vue","./src/pages/my-account/register.vue","./src/pages/my-account/subscriptions.vue","./src/pages/my-account/tip-box.vue","./src/pages/my-account/welcome.vue","./src/pages/others/disclaimer.vue","./src/pages/others/not-found-404.vue","./src/pages/others/others-header.vue","./src/pages/others/privacy-policy.vue","./src/pages/others/site-map.vue","./src/pages/others/terms-of-use.vue","./src/pages/user-stories/index.vue","./src/pages/user-stories/user-list.vue","./src/stores/global.ts","./src/stores/index.ts","./src/stores/userinfo.ts","./src/tools/config.ts","./src/tools/myevents.ts","./src/types/kagol-vue-carousel.d.ts"],"errors":true,"version":"6.0.3"}