From da53306a2c124e5c8896bcdb6eeb145630d9f6ca Mon Sep 17 00:00:00 2001 From: gwok Date: Mon, 28 Oct 2024 18:21:20 +0800 Subject: [PATCH] =?UTF-8?q?style:=20=E6=8E=A8=E5=B9=BF=E9=A1=B5=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/site/css/ad.css | 48 ++- public/site/en/ad.html | 692 ++++++++++--------------------------- public/site/img/ad/tag.png | Bin 0 -> 3056 bytes public/site/js/ad.js | 35 +- public/site/zh/ad.html | 691 ++++++++++-------------------------- 5 files changed, 427 insertions(+), 1039 deletions(-) create mode 100644 public/site/img/ad/tag.png diff --git a/public/site/css/ad.css b/public/site/css/ad.css index 08785c73b..754618d5a 100644 --- a/public/site/css/ad.css +++ b/public/site/css/ad.css @@ -139,6 +139,8 @@ footer.ad-footer .footer-layout { .ad-wrapper .topics .topics-btn { gap: 16px; + + margin-bottom: 240px; } .ad-wrapper .topics .topics-btn .btn { @@ -169,10 +171,15 @@ footer.ad-footer .footer-layout { } .ad-wrapper main { - background-image: url(../img/ad/plan.png); + /* background-image: url(../img/ad/plan.png); background-size: cover; background-position: center; - background-repeat: no-repeat; + background-repeat: no-repeat; */ + position: relative; +} + +.ad-plan { + margin-top: -240px; } .ad-plan, @@ -183,7 +190,7 @@ footer.ad-footer .footer-layout { .section-wrapper { max-width: 1280px; margin: 0 auto; - padding: 96px 0 64px; + padding: 0 0 96px 64px; display: flex; @@ -210,8 +217,8 @@ footer.ad-footer .footer-layout { .ad-plan .section-content { width: 100%; display: grid; - grid-template-columns: repeat(4, 1fr); - gap: 24px; + grid-template-columns: repeat(3, 1fr); + gap: 32px; } .ad-plan .section-content .plan-item { @@ -222,6 +229,8 @@ footer.ad-footer .footer-layout { min-height: 360px; padding: 32px 24px; border: 2px solid transparent; + + position: relative; } .ad-plan .section-content .plan-item:hover, @@ -230,6 +239,24 @@ footer.ad-footer .footer-layout { box-shadow: 0px 24px 32px 16px #0000001f; } +.ad-plan .section-content .plan-item .plan-item-tag { + position: absolute; + top: -12px; + right: -12px; + width: 88px; + height: 32px; + background-image: url(../img/ad/tag.png); + background-size: cover; + background-position: center; + background-repeat: no-repeat; + display: flex; + justify-content: center; + align-items: center; + font-size: 14px; + font-weight: 500; + color: #fff; +} + .ad-plan .section-content .plan-item .plan-item-title { font-size: 18px; font-weight: 600; @@ -245,10 +272,18 @@ footer.ad-footer .footer-layout { } .ad-plan .section-content .plan-item .plan-item-price .plan-item-price-current { - font-size: 24px; + font-size: 32px; font-weight: 900; } +.ad-plan + .section-content + .plan-item + .plan-item-price + .plan-item-price-current.price { + color: #f3474c; +} + .ad-plan .section-content .plan-item .plan-item-price .plan-item-price-payment { font-size: 14px; font-weight: 500; @@ -269,7 +304,6 @@ footer.ad-footer .footer-layout { .plan-item .plan-item-price .plan-item-price-original.price { - color: #f3474c; text-decoration: line-through; } diff --git a/public/site/en/ad.html b/public/site/en/ad.html index aeae39608..2de93181c 100644 --- a/public/site/en/ad.html +++ b/public/site/en/ad.html @@ -16,7 +16,7 @@ - + @@ -27,7 +27,6 @@ -
@@ -35,10 +34,13 @@
- Please scan the QR code to add our WeChat customer service representative for purchase + Please scan the QR code to add our WeChat customer service + representative for purchase
- +
@@ -278,7 +280,7 @@
-
+
-
-
- Unlimited Pro -
-
- - ¥16,800 - - - - - - ¥18,888 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Custom logo design - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- 50-License Pro -
-
- - ¥13,800 - - - - - - ￥16,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Custom logo design - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- 30-License Pro -
-
- - ¥11,800 - - - - - - ￥15,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Custom logo design - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- 10-License Pro -
-
- - ￥5,800 - - - - - - ¥8,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- 5-License Pro -
-
- - ¥3,800 - - - - - - ¥6,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- Annual Pro -
-
- - ¥200 - - /per/year - - - - ¥288 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- Supported Pro -
-
- - ¥600 - - /per/year - - - - ¥680 - -
-
- - - -
-
-
    -
  • - - undefined - - - For businesses established within 1 year - -
    • -
  • - - undefined - - - Free for 5 or fewer people - -
    • -
  • - - undefined - - - Valid for 1 year - -
    • -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Custom logo design - -
    • -
-
-
-
+
Free
- + 0 /month - + Up to 3 People
- + @@ -808,39 +317,198 @@
  • - undefined + undefined - + Support private deployment
    • +
  • - undefined + undefined - + Technical Advisory Services
    • +
  • - undefined + undefined - - Dedicated operations customer service + + Dedicated operations customer + service
    • +
  • - undefined + undefined - + 12-Hour service response
+
+
Popular
+
+ 10-License Pro +
+
+ + ￥5,800 + + + + + ¥8,800 + +
+
+ + + +
+
+
    +
  • + + undefined + + + Support private deployment + +
    • + +
  • + + undefined + + + Technical Advisory Services + +
    • + +
  • + + undefined + + + Dedicated operations customer + service + +
    • + +
  • + + undefined + + + 12-Hour service response + +
    • + +
  • + + undefined + + + Free 1-Year Technical + Maintenance Included + +
    • +
+
+
+
+
Hot
+
+ Unlimited Pro +
+
+ + ¥16,800 + + + + + ¥18,888 + +
+
+ + + +
+
+
    +
  • + + undefined + + + Support private deployment + +
    • + +
  • + + undefined + + + Technical Advisory Services + +
    • + +
  • + + undefined + + + Custom logo design + +
    • + +
  • + + undefined + + + Dedicated operations customer + service + +
    • + +
  • + + undefined + + + 12-Hour service response + +
    • + +
  • + + undefined + + + Free 1-Year Technical + Maintenance Included + +
    • +
+
+
diff --git a/public/site/img/ad/tag.png b/public/site/img/ad/tag.png new file mode 100644 index 0000000000000000000000000000000000000000..29062aca66e3c4c48fe28bbfd36dd67a62564d45 GIT binary patch literal 3056 zcmV(P)H8{ORr&I#s=LSIy<0!iU0q$>{qohzm(@e`)Apk`xxT)<|HG#*?|=W>>&Nu}f9>CX z9_gp;QJZ{zeR=opgKK7beqZPr6_TIboqoR8zX5zW*Zzf`^LzffHobln*z)4~$=GsH z|J~7c+hfkxe`b3DiUjNq*|NYhL)`zzquY!9?{K50O+os90 zI&!;?=`maG+xGii(zR_D%@2=L|1j;1BmV5ev+3CVWc^PH`bqtJ))TFFzpUseedN3^ ztfLnlSkKk1Fs^IkF!!^<|EkB|)!nDH?P*-oMyh=Zy*b~%`}pcsgR%lp{`}dW>W^3T z-z9AWY1hf{GhSL&#(P5{9hVDRQx z>)Dcn#bl?q0x9GVkih{vxd8!y*_ql|&21k+P!<9}y++3y&-Z`;NWtT@Aqx6PzgOJ9 z%>t$`GtdJF^5WB%_1Rz1%qV*?CLMHHbi@FEOJZaKZY?j5m8BVMlYxt8QjJ_V-`>!ykFi4rTyzYa6z{As{sW2C2)v|bUOH+f=-5?r6Q;2}Lhy1owJN0J>A zFr&D10VFl-YC6UQZomth_gBLpmfSfSWe4q%*%n+{6(#F7vwGsP%N$-XQ;E6i;I(R8blWT{9Bw5^ByDf7a zm(XlgC{K<~sCrMstrykSRFrbm3jiw#(*?-M#8f z{UJ?v$sGa5Y8jCyvjWDomn|8DD63`AWOE0e;FLKk4F+zm>X?VsxPj63=9agj9q%$H zI-R1Lv+>ikIlC!jSbP*{^KdCf4a(g|{_-Oqvjd zht)Id8QgIU0*B3HGiNQI-VmLo$szOd{DJxMb*n9*`f{jx;5Lp%B44 zku!^o9oP?GwA@PeEY^y>oE~%(Q(Fa?t-y$Y46OHr$pBca8Y~6gIkPR}Oo1=}b%{-V zICZ0yEC|t7CX4gPu;_cBeXuFt$k%lBWhB00AQ2VVHFpEvS8de@bU(JFX?9P?qL3aW z!3YR@)h1Z2>-o04&xrMjRR)93GcT@sSz6p{1AU^M1lf^3LvQmmmnbqiDn)a9TLp_R z9Yp!7h{}Uxy`{;znLUHk5E*0%>_rus6E6*k$mMrzx18t9qnYhcO!fvPw>v9GjzO7l z8cM(JC3^ni1>P0?4B+}M2U@<}1e;DYRBwZ(CYuJ301#Lq`8qg5)o5SrF$SkHJic%w ziOQ>P8sJG-0g#yANh@wK`(w$IWz1<792+vco0*l?zkO)%wGR)hRga`MFvnui;w)vY z=`6gno?U2=1tc_10Gdt{rKL#m0FBHAPywQUm1Yk}DQte39bmE~I3;XKwUgy7a$twq zpVth$w0-6mx>bCqZ_-_gZf354EA=-T$`1KG}4YozF((UqDJY1s!|k zabe{UjJD>XK|u~I$Rr_8loyP&x6Syp`hX7(lH3BU{`|VgwkQa^DkRs2T!eT>iVD!Q zc;!ea9*2-R#Q@IgCUSdud$TPgFrCN=AC@m>hB=bA<=y=*s}=0iIL(uDkOZ_PJh62RUu5^PJXM&9(Rs}_ zSheVy2dov|MC^srQkv_hYqklc$+wl+?M~SS613WGoHhrHLVlR$1gbqVnd5qBn0Q>? z(qZ}a)qlrd%2|Vb=CnYcfoAqZ7|WKkM&no{z8`9=`@HLJYC%;3*VnmM%vQupgDSqd zZ63~!6+4#1KDT@!3BsnW9N^Cto+K+`^js|+F|R6<2ofjIm#^t?|HrGHq&R?G&bX7y z2a_jEXS63qcOOR$%=jB+hIi1FHlI|lI3r)xRPA56kt555`{?vKQWB)7pxR0mf#=H>k+pg`+ yhlB4QsohtilC1p?tZn`rr_-CZ`$KZEw|x)I-C+3Ov5DXS0000 - - `; + if (href === "#") { + selfHostButtonEl.innerHTML = ` + + + `; + function showDialog(e) { + e.preventDefault(); + e.stopPropagation(); + + const dialogEl = document.querySelector(".ad-dialog"); + if (!dialogEl) return; + dialogEl.classList.add("show"); + lockBodyScroll(true); + handleDialogAnimate(true) + } + selfHostButtonEl.addEventListener("click", showDialog); + } else { + selfHostButtonEl.innerHTML = ` + + + `; + } selfHostButtonEl.style = getStyle(style); } } @@ -373,11 +393,12 @@ async function handleAdPlanPlans(plans) { planItemEl.className = `plan-item ${plan.activated ? "active" : "" }`; planItemEl.innerHTML = ` + ${plan.tag ? `
${plan.tag}
` : ""}
${plan.title}
- + ${plan.price.current} ${plan.price.payment ?? ""} diff --git a/public/site/zh/ad.html b/public/site/zh/ad.html index 2fddc1c54..9e6b4c6ef 100644 --- a/public/site/zh/ad.html +++ b/public/site/zh/ad.html @@ -14,7 +14,7 @@ - + @@ -25,7 +25,6 @@ -
@@ -36,7 +35,9 @@ 如需购买请扫码添加微信客服专员
- +
@@ -274,523 +275,30 @@
-
+
-
-
- 无限专业版 -
-
- - ¥16,800 - - - - - - ¥18,888 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - LOGO定制 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 50人专业版 -
-
- - ¥13,800 - - - - - - ￥16,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - LOGO定制 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 30人专业版 -
-
- - ¥11,800 - - - - - - ￥15,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - LOGO定制 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 10人专业版 -
-
- - ￥5,800 - - - - - - ¥8,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 5人专业版 -
-
- - ¥3,800 - - - - - - ¥6,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 年度专业版 -
-
- - ¥200 - - /人/年 - - - - ¥288 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 扶持专业版 -
-
- - ¥600 - - /人/年 - - - - ¥680 - -
-
- - - -
-
-
    -
  • - - undefined - - - 适用于成立1年内企业 - -
    • -
  • - - undefined - - - 限5人内（含）免费 - -
    • -
  • - - undefined - - - 有效期一年 - -
    • -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
-
-
-
+
免费版
- + 0 /月 - + 最多3人
- + @@ -800,39 +308,193 @@
  • - undefined + undefined - + 支持私有化部署
    • +
  • - undefined + undefined - + 技术咨询服务
    • +
  • - undefined + undefined - + 专属运营客服
    • +
  • - undefined + undefined - + 12小时服务响应
+
+
最受欢迎
+
+ 10人专业版 +
+
+ + ￥5,800 + + + + + ¥8,800 + +
+
+ + + +
+
+
    +
  • + + undefined + + + 支持私有化部署 + +
    • + +
  • + + undefined + + + 技术咨询服务 + +
    • + +
  • + + undefined + + + 专属运营客服 + +
    • + +
  • + + undefined + + + 12小时服务响应 + +
    • + +
  • + + undefined + + + 赠1年免费技术维护 + +
    • +
+
+
+
+
热销
+
+ 无限专业版 +
+
+ + ¥16,800 + + + + + ¥18,888 + +
+
+ + + +
+
+
    +
  • + + undefined + + + 支持私有化部署 + +
    • + +
  • + + undefined + + + 技术咨询服务 + +
    • + +
  • + + undefined + + + LOGO定制 + +
    • + +
  • + + undefined + + + 专属运营客服 + +
    • + +
  • + + undefined + + + 12小时服务响应 + +
    • + +
  • + + undefined + + + 赠1年免费技术维护 + +
    • +
+
+
@@ -856,7 +518,8 @@ 项目管理
- 支持多种项目管理模式，如敏捷开发、水晶计划、看板等，适用于各种规模和类型的项目管理。用户可以使用DooTask里的项目管理工具，例如任务分配、进度跟踪、资源分配等来管理整个项目。 + 支持多种项目管理模式，如敏捷开发、水晶计划、看板等，适用于各种规模和类型的项目管理。用户可以使用DooTask里的项目管理工具，例如任务分配、进度跟踪、资源分配等来管理整个项目。 +
@@ -870,7 +533,8 @@ 团队协作
- DooTask的丰富实用的工具可以方便团队成员之间的沟通和协作，提高工作效率。例如，团队成员可以使用DooTask里的文档协作工具、在线思维导图、流程图等工具进行协作。 + DooTask的丰富实用的工具可以方便团队成员之间的沟通和协作，提高工作效率。例如，团队成员可以使用DooTask里的文档协作工具、在线思维导图、流程图等工具进行协作。 +
@@ -899,7 +563,8 @@ 自由定制
- DooTask是一款完全开源的工具，用户可以自由修改和定制，避免了商业软件订阅费用带来的额外成本。 + DooTask是一款完全开源的工具，用户可以自由修改和定制，避免了商业软件订阅费用带来的额外成本。 +