@cyberskill/design 1.2.0 → 1.3.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (232) hide show
  1. package/DESIGN.md +11 -9
  2. package/README.md +28 -24
  3. package/SKILL.md +18 -9
  4. package/THIRD-PARTY-NOTICES.md +35 -0
  5. package/VERSION +1 -1
  6. package/_ds_bundle.js +701 -1342
  7. package/_esm/cs.mjs +2 -2
  8. package/_esm/react.mjs +6 -1
  9. package/_vendor/NOTICE.md +16 -0
  10. package/_vendor/babel/README.md +7 -0
  11. package/_vendor/babel/babel.min.js +4 -0
  12. package/_vendor/react/README.md +3 -0
  13. package/_vendor/react/react-dom.production.min.js +1 -0
  14. package/_vendor/react/react.production.min.js +1 -0
  15. package/assets/aurora-hoa.webp +0 -0
  16. package/assets/aurora-kim.webp +0 -0
  17. package/assets/aurora-moc.webp +0 -0
  18. package/assets/aurora-tho.webp +0 -0
  19. package/assets/aurora-thuy.webp +0 -0
  20. package/base/ai.css +8 -3
  21. package/base/collections.css +10 -4
  22. package/base/components.css +5 -2
  23. package/base/controls.css +58 -21
  24. package/base/data.css +1 -1
  25. package/base/feedback.css +9 -2
  26. package/base/forms.css +1 -1
  27. package/base/glass.css +1 -1
  28. package/base/interaction.css +6 -2
  29. package/base/navigation.css +1 -1
  30. package/base/reset.css +7 -1
  31. package/base/responsive.css +13 -12
  32. package/base/shell.css +8 -2
  33. package/components/_i18n/i18n.js +28 -3
  34. package/components/_i18n/strings.js +42 -24
  35. package/components/ai/ChatMessage.d.ts +2 -0
  36. package/components/ai/ChatMessage.jsx +8 -4
  37. package/components/ai/ConfidenceMeter.d.ts +2 -0
  38. package/components/ai/HumanReviewGate.d.ts +2 -0
  39. package/components/ai/PromptInput.d.ts +2 -0
  40. package/components/ai/TypingIndicator.d.ts +2 -0
  41. package/components/ai/ai-conversation.card.html +3 -3
  42. package/components/ai/ai-lumi.card.html +3 -3
  43. package/components/ai/ai.card.html +3 -3
  44. package/components/brand/brand.card.html +3 -3
  45. package/components/button/buttons.card.html +3 -3
  46. package/components/data/Image.jsx +18 -2
  47. package/components/data/Sortable.d.ts +5 -1
  48. package/components/data/Sortable.jsx +42 -9
  49. package/components/data/Sortable.prompt.md +4 -2
  50. package/components/data/Terminal.jsx +3 -2
  51. package/components/data/Tooltip.d.ts +2 -0
  52. package/components/data/Tooltip.jsx +6 -3
  53. package/components/data/Tree.d.ts +2 -1
  54. package/components/data/Tree.jsx +137 -16
  55. package/components/data/Tree.prompt.md +1 -1
  56. package/components/data/collections.card.html +3 -3
  57. package/components/data/data.card.html +3 -3
  58. package/components/datatable/DataTable.d.ts +24 -1
  59. package/components/datatable/DataTable.jsx +78 -5
  60. package/components/datatable/DataTable.prompt.md +2 -1
  61. package/components/datatable/datatable.card.html +20 -16
  62. package/components/dialog/dialog.card.html +3 -3
  63. package/components/feedback/Alert.d.ts +2 -0
  64. package/components/feedback/Alert.jsx +8 -2
  65. package/components/feedback/EmptyState.d.ts +2 -0
  66. package/components/feedback/EmptyState.jsx +6 -3
  67. package/components/feedback/ProgressBar.d.ts +2 -0
  68. package/components/feedback/ProgressBar.jsx +6 -3
  69. package/components/feedback/Toast.jsx +15 -1
  70. package/components/feedback/Toast.prompt.md +2 -1
  71. package/components/feedback/feedback-2.card.html +3 -3
  72. package/components/feedback/feedback.card.html +3 -3
  73. package/components/forms/Cascader.jsx +7 -2
  74. package/components/forms/FileUpload.d.ts +2 -0
  75. package/components/forms/Form.d.ts +3 -1
  76. package/components/forms/Form.jsx +9 -1
  77. package/components/forms/Form.prompt.md +1 -1
  78. package/components/forms/Mentions.d.ts +1 -1
  79. package/components/forms/Mentions.jsx +59 -7
  80. package/components/forms/Mentions.prompt.md +3 -1
  81. package/components/forms/Rating.d.ts +3 -2
  82. package/components/forms/Rating.jsx +34 -3
  83. package/components/forms/Rating.prompt.md +1 -1
  84. package/components/forms/Select.d.ts +2 -0
  85. package/components/forms/Select.jsx +6 -2
  86. package/components/forms/Slider.d.ts +2 -0
  87. package/components/forms/Slider.jsx +5 -2
  88. package/components/forms/Switch.d.ts +2 -0
  89. package/components/forms/Switch.jsx +7 -9
  90. package/components/forms/Toggle.d.ts +2 -0
  91. package/components/forms/Toggle.jsx +14 -2
  92. package/components/forms/forms-2.card.html +3 -3
  93. package/components/forms/forms.card.html +3 -3
  94. package/components/icon/Icon.d.ts +1 -1
  95. package/components/icon/Icon.prompt.md +1 -1
  96. package/components/icon/icon.card.html +3 -3
  97. package/components/logo/logo.card.html +3 -3
  98. package/components/navigation/CommandPalette.d.ts +2 -0
  99. package/components/navigation/Menu.d.ts +2 -0
  100. package/components/navigation/Menu.jsx +60 -6
  101. package/components/navigation/Steps.d.ts +2 -0
  102. package/components/navigation/Steps.jsx +6 -3
  103. package/components/navigation/Tabs.d.ts +2 -0
  104. package/components/navigation/Tabs.jsx +6 -3
  105. package/components/navigation/Toolbar.d.ts +3 -2
  106. package/components/navigation/Toolbar.jsx +117 -11
  107. package/components/navigation/Toolbar.prompt.md +1 -1
  108. package/components/navigation/navigation.card.html +3 -3
  109. package/components/navigation/shell.card.html +3 -3
  110. package/components/overlays/ContextMenu.d.ts +2 -0
  111. package/components/overlays/ContextMenu.jsx +6 -3
  112. package/components/overlays/Drawer.d.ts +2 -0
  113. package/components/overlays/alertdialog.card.html +3 -3
  114. package/components/overlays/overlays.card.html +3 -3
  115. package/components/textfield/textfield.card.html +3 -3
  116. package/dist/styles.min.css +312 -64
  117. package/docs/benchmark-rubric.md +2 -2
  118. package/docs/ci-cd.md +18 -13
  119. package/docs/consumer-grant.md +4 -1
  120. package/docs/consuming.md +16 -12
  121. package/docs/contrast-report.md +81 -1
  122. package/docs/conventions.md +18 -5
  123. package/docs/decisions.md +41 -3
  124. package/docs/deploy.md +19 -6
  125. package/docs/design-styles.md +2 -2
  126. package/docs/doctrine.md +51 -0
  127. package/docs/figma.md +2 -0
  128. package/docs/live-hub.md +3 -1
  129. package/docs/products.md +1 -1
  130. package/docs/quality-gates.md +24 -12
  131. package/docs/release-notes.md +1 -1
  132. package/docs/release-runbook.md +78 -0
  133. package/docs/storybook.md +3 -3
  134. package/docs/sync.md +8 -8
  135. package/docs/template-schema-v2.md +1 -1
  136. package/docs/vi/benchmark-rubric.md +2 -2
  137. package/docs/vi/ci-cd.md +17 -14
  138. package/docs/vi/consumer-grant.md +4 -1
  139. package/docs/vi/consuming.md +16 -12
  140. package/docs/vi/contrast-report.md +81 -1
  141. package/docs/vi/conventions.md +19 -6
  142. package/docs/vi/decisions.md +40 -3
  143. package/docs/vi/deploy.md +19 -6
  144. package/docs/vi/design-styles.md +1 -1
  145. package/docs/vi/doctrine.md +51 -0
  146. package/docs/vi/figma.md +2 -0
  147. package/docs/vi/live-hub.md +3 -1
  148. package/docs/vi/products.md +1 -1
  149. package/docs/vi/quality-gates.md +23 -12
  150. package/docs/vi/release-notes.md +1 -1
  151. package/docs/vi/release-runbook.md +78 -0
  152. package/docs/vi/storybook.md +3 -3
  153. package/docs/vi/sync.md +7 -7
  154. package/docs/vi/template-schema-v2.md +1 -1
  155. package/docs/viewer.html +16 -5
  156. package/fonts/OFL.txt +98 -0
  157. package/guidelines/atomic-view.html +2 -2
  158. package/guidelines/brand-imagery.html +1 -1
  159. package/guidelines/elements-variants.html +5 -5
  160. package/guidelines/spacing-breakpoints.html +2 -1
  161. package/guidelines/surfaces-glass.html +1 -1
  162. package/llms.txt +18 -11
  163. package/package.json +28 -8
  164. package/templates/app-shell/AppShell.dc.html +3 -3
  165. package/templates/app-shell/content-schema.json +7 -0
  166. package/templates/article/Article.dc.html +3 -3
  167. package/templates/article/content-schema.json +7 -0
  168. package/templates/auth/Auth.dc.html +26 -10
  169. package/templates/auth/content-schema.json +25 -0
  170. package/templates/dashboard/Dashboard.dc.html +4 -4
  171. package/templates/dashboard/content-schema.json +7 -0
  172. package/templates/delivery-change-note/DeliveryChangeNote.dc.html +2 -2
  173. package/templates/delivery-runbook/DeliveryRunbook.dc.html +2 -2
  174. package/templates/email-safe/email-announcement.html +2 -2
  175. package/templates/email-safe/email-dunning.html +2 -2
  176. package/templates/email-safe/email-investor.html +2 -2
  177. package/templates/email-safe/email-launch.html +2 -2
  178. package/templates/email-safe/email-newsletter.html +2 -2
  179. package/templates/email-safe/email-status.html +2 -2
  180. package/templates/email-safe/email-transactional.html +2 -2
  181. package/templates/finance-dunning-email/FinanceDunningEmail.dc.html +2 -2
  182. package/templates/finance-expense-report/FinanceExpenseReport.dc.html +2 -2
  183. package/templates/finance-invoice/FinanceInvoice.dc.html +2 -2
  184. package/templates/finance-quote/FinanceQuote.dc.html +4 -4
  185. package/templates/hr-interview-kit/HrInterviewKit.dc.html +1 -1
  186. package/templates/marketing-case-study/MarketingCaseStudy.dc.html +1 -1
  187. package/templates/marketing-page/MarketingPage.dc.html +3 -3
  188. package/templates/marketing-page/content-schema.json +1 -0
  189. package/templates/settings/Settings.dc.html +3 -3
  190. package/templates/settings/content-schema.json +7 -0
  191. package/tokens/element-seeds.json +2 -2
  192. package/tokens/elements.css +193 -19
  193. package/tokens/native/CSTokens.kt +3 -2
  194. package/tokens/native/CSTokens.swift +3 -2
  195. package/tokens/native/cs_tokens.dart +3 -2
  196. package/tokens/provenance.json +8 -8
  197. package/tokens/spacing.css +2 -1
  198. package/tokens/tokens.dtcg.json +19 -14
  199. package/tokens/tokens.js +16 -15
  200. package/tokens/tokens.json +15 -14
  201. package/ui_kits/deck/index.html +1 -1
  202. package/ui_kits/status-hub/StatusHub.jsx +1 -1
  203. package/ui_kits/status-hub/login.html +52 -10
  204. package/ui_kits/status-hub/project.html +1 -1
  205. package/ui_kits/status-hub/settings.html +1 -1
  206. package/ui_kits/website/Website.jsx +1 -1
  207. package/ui_kits/website/careers.html +2 -2
  208. package/ui_kits/website/chat.html +1 -1
  209. package/ui_kits/website/site.css +1 -1
  210. package/ui_kits/website/work.html +2 -2
  211. package/assets/aurora-hoa.png +0 -0
  212. package/assets/aurora-kim.png +0 -0
  213. package/assets/aurora-moc.png +0 -0
  214. package/assets/aurora-thuy.png +0 -0
  215. package/docs/decisions/container-query-migration.md +0 -18
  216. package/docs/decisions/overlay-manager-design.md +0 -101
  217. package/docs/plans/cyberskill-design-system-audit-and-12-month-evolution-plan.md +0 -1490
  218. package/docs/status/assets/favicon.svg +0 -5
  219. package/docs/status/assets/status-legacy.css +0 -399
  220. package/docs/status/assets/status-legacy.js +0 -505
  221. package/docs/status/assets/status.css +0 -644
  222. package/docs/status/assets/status.js +0 -1308
  223. package/docs/status/data/status-feed.json +0 -1
  224. package/docs/status/data/task/TASK-REL-001.js +0 -1
  225. package/docs/status/data/task/TASK-REL-002.js +0 -1
  226. package/docs/status/index.html +0 -46
  227. package/docs/status/roadmap.html +0 -4
  228. package/docs/status/status-legacy.html +0 -122
  229. package/docs/tasks/BACKLOG.md +0 -26
  230. package/docs/tasks/_state/commit-links.yaml +0 -14
  231. package/docs/tasks/release/TASK-REL-001-launch-1-1-0/spec.md +0 -55
  232. package/docs/tasks/release/TASK-REL-002-republish-1-1-1/spec.md +0 -54
package/templates/email-safe/email-newsletter.html CHANGED
@@ -1,5 +1,5 @@
1
1
  <!DOCTYPE html>
2
- <html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
2
+ <html lang="vi" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
3
3
  <head>
4
4
  <meta charset="utf-8">
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1">
@@ -54,7 +54,7 @@
54
54
  <!-- Footer -->
55
55
  <tr><td class="px raise" bgcolor="#fbf4e9" style="background:#fbf4e9;padding:22px 32px;border-top:1px solid #e7d9c6;">
56
56
  <p class="muted" style="margin:0 0 6px;font-family:Arial,Helvetica,sans-serif;font-size:13px;color:#6e5a4c;">Hiện Thực Hoá Ý Chí · Turn Your Will Into Real</p>
57
- <p class="muted" style="margin:0;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.5;color:#6e5a4c;">CyberSkill Co., Ltd · 12 Nguyễn Huệ, Quận 1, Sài Gòn, Việt Nam<br><a href="https://cyberskill.world/unsubscribe" style="color:#6E3B0E;">Unsubscribe / Huỷ đăng ký</a></p>
57
+ <p class="muted" style="margin:0;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.5;color:#6e5a4c;">CyberSkill Co., Ltd · 12 Nguyễn Huệ, Quận 1, Sài Gòn, Việt Nam<br><a href="https://cyberskill.world/unsubscribe" style="color:#6E3B0E;"><span lang="en">Unsubscribe</span> · <span lang="vi">Huỷ đăng ký</span></a></p>
58
58
  </td></tr>
59
59
  </table>
60
60
  </td></tr></table>
package/templates/email-safe/email-status.html CHANGED
@@ -1,5 +1,5 @@
1
1
  <!DOCTYPE html>
2
- <html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
2
+ <html lang="vi" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
3
3
  <head>
4
4
  <meta charset="utf-8">
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1">
@@ -77,7 +77,7 @@
77
77
  <tr>
78
78
  <td class="px" bgcolor="#fbf4e9" style="background:#fbf4e9;padding:22px 32px;border-top:1px solid #e7d9c6;">
79
79
  <p class="muted" style="margin:0 0 6px;font-family:Arial,Helvetica,sans-serif;font-size:13px;color:#6e5a4c;">Hiện Thực Hoá Ý Chí · Turn Your Will Into Real</p>
80
- <p class="muted" style="margin:0;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.5;color:#6e5a4c;">CyberSkill Co., Ltd · 12 Nguyễn Huệ, Quận 1, Sài Gòn, Việt Nam<br><a href="https://cyberskill.world/unsubscribe" style="color:#6E3B0E;">Unsubscribe / Huỷ đăng ký</a> · <a href="https://cyberskill.world/preferences" style="color:#6E3B0E;">Preferences / Tuỳ chọn</a></p>
80
+ <p class="muted" style="margin:0;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.5;color:#6e5a4c;">CyberSkill Co., Ltd · 12 Nguyễn Huệ, Quận 1, Sài Gòn, Việt Nam<br><a href="https://cyberskill.world/unsubscribe" style="color:#6E3B0E;"><span lang="en">Unsubscribe</span> · <span lang="vi">Huỷ đăng ký</span></a> · <a href="https://cyberskill.world/preferences" style="color:#6E3B0E;"><span lang="en">Preferences</span> · <span lang="vi">Tuỳ chọn</span></a></p>
81
81
  </td>
82
82
  </tr>
83
83
  </table>
package/templates/email-safe/email-transactional.html CHANGED
@@ -1,5 +1,5 @@
1
1
  <!DOCTYPE html>
2
- <html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
2
+ <html lang="vi" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
3
3
  <head>
4
4
  <meta charset="utf-8">
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1">
@@ -77,7 +77,7 @@
77
77
  <tr>
78
78
  <td class="px" bgcolor="#fbf4e9" style="background:#fbf4e9;padding:22px 32px;border-top:1px solid #e7d9c6;">
79
79
  <p class="muted" style="margin:0 0 6px;font-family:Arial,Helvetica,sans-serif;font-size:13px;color:#6e5a4c;">Hiện Thực Hoá Ý Chí · Turn Your Will Into Real</p>
80
- <p class="muted" style="margin:0;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.5;color:#6e5a4c;">CyberSkill Co., Ltd · 12 Nguyễn Huệ, Quận 1, Sài Gòn, Việt Nam<br><a href="https://cyberskill.world/unsubscribe" style="color:#6E3B0E;">Unsubscribe / Huỷ đăng ký</a> · <a href="https://cyberskill.world/preferences" style="color:#6E3B0E;">Preferences / Tuỳ chọn</a></p>
80
+ <p class="muted" style="margin:0;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.5;color:#6e5a4c;">CyberSkill Co., Ltd · 12 Nguyễn Huệ, Quận 1, Sài Gòn, Việt Nam<br><a href="https://cyberskill.world/unsubscribe" style="color:#6E3B0E;"><span lang="en">Unsubscribe</span> · <span lang="vi">Huỷ đăng ký</span></a> · <a href="https://cyberskill.world/preferences" style="color:#6E3B0E;"><span lang="en">Preferences</span> · <span lang="vi">Tuỳ chọn</span></a></p>
81
81
  </td>
82
82
  </tr>
83
83
  </table>
package/templates/finance-dunning-email/FinanceDunningEmail.dc.html CHANGED
@@ -24,7 +24,7 @@
24
24
  <div style="font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:var(--cs-color-text-accent)">A gentle reminder</div>
25
25
  <h1 style="font-size:24px;font-weight:800;letter-spacing:-0.02em;line-height:1.2;margin:8px 0 14px">Invoice INV-2026-0142 is 7 days past due</h1>
26
26
  <p style="font-size:14.5px;line-height:1.6;margin:0 0 18px">Just a nudge — these things slip, no drama. If it's already on its way, thank you and please ignore this. If something about the invoice doesn't look right, reply and a real person will sort it within one business day.</p>
27
- <div style="border:1px solid var(--cs-color-border-default);border-radius:var(--cs-radius-md);padding:16px 20px;margin-bottom:20px;font-size:13.5px;line-height:1.8"><b>Amount due</b> <span style="font-family:var(--cs-font-family-mono);font-weight:800;color:var(--cs-color-text-accent)">₫1,423,400,000</span><br><b>Was due</b> 02 Aug 2026 · <b>Ref</b> INV-2026-0142<br><b>Pay to</b> Vietcombank HCMC · CyberSkill Co., Ltd · <span style="font-family:var(--cs-font-family-mono);font-size:12.5px">0071 0000 xxxxxx</span></div>
27
+ <div style="border:1px solid var(--cs-color-border-default);border-radius:var(--cs-radius-md);padding:16px 20px;margin-bottom:20px;font-size:13.5px;line-height:1.8"><b>Currency</b> VND <span style="color:var(--cs-color-text-muted)">(transaction — independent of Language)</span><br><b>Amount due</b> <span style="font-family:var(--cs-font-family-mono);font-weight:800;color:var(--cs-color-text-accent)">₫1,423,400,000</span><br><b>Was due</b> 02 Aug 2026 · <b>Ref</b> INV-2026-0142<br><b>Pay to</b> Vietcombank HCMC · CyberSkill Co., Ltd · <span style="font-family:var(--cs-font-family-mono);font-size:12.5px">0071 0000 xxxxxx</span></div>
28
28
  <a href="#" style="display:inline-block;background:var(--cs-accent-bright);color:var(--cs-accent-on);font-weight:700;font-size:14.5px;text-decoration:none;padding:13px 24px;border-radius:var(--cs-radius-full)">View the invoice →</a>
29
29
  <p style="font-size:12.5px;line-height:1.6;margin:18px 0 0;color:var(--cs-color-text-muted)">Per our MSA, undisputed amounts accrue 1%/month after the due date — we'd genuinely rather not. A quick transfer or a quick reply keeps everything warm.</p>
30
30
  </sc-if>
@@ -33,7 +33,7 @@
33
33
  <div style="font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:var(--cs-color-text-accent)">Một lời nhắc nhẹ</div>
34
34
  <h1 style="font-size:24px;font-weight:800;letter-spacing:-0.02em;line-height:1.3;margin:8px 0 14px">Hóa đơn INV-2026-0142 đã quá hạn 7 ngày</h1>
35
35
  <p style="font-size:14.5px;line-height:1.65;margin:0 0 18px">Chỉ là một lời nhắc — việc này ai cũng có lúc quên, không sao cả. Nếu khoản thanh toán đã trên đường đi, cảm ơn bạn và hãy bỏ qua email này. Nếu hóa đơn có điểm nào chưa đúng, trả lời thư và một người thật sẽ xử lý trong vòng một ngày làm việc.</p>
36
- <div style="border:1px solid var(--cs-color-border-default);border-radius:var(--cs-radius-md);padding:16px 20px;margin-bottom:20px;font-size:13.5px;line-height:1.85"><b>Số tiền phải trả</b> <span style="font-family:var(--cs-font-family-mono);font-weight:800;color:var(--cs-color-text-accent)">₫1.423.400.000</span><br><b>Hạn</b> 02/08/2026 · <b>Nội dung</b> INV-2026-0142<br><b>Chuyển đến</b> Vietcombank TP.HCM · Công ty TNHH CyberSkill · <span style="font-family:var(--cs-font-family-mono);font-size:12.5px">0071 0000 xxxxxx</span></div>
36
+ <div style="border:1px solid var(--cs-color-border-default);border-radius:var(--cs-radius-md);padding:16px 20px;margin-bottom:20px;font-size:13.5px;line-height:1.85"><b>Tiền tệ</b> VND <span style="color:var(--cs-color-text-muted)">(giao dịch — độc lập với Language)</span><br><b>Số tiền phải trả</b> <span style="font-family:var(--cs-font-family-mono);font-weight:800;color:var(--cs-color-text-accent)">₫1.423.400.000</span><br><b>Hạn</b> 02/08/2026 · <b>Nội dung</b> INV-2026-0142<br><b>Chuyển đến</b> Vietcombank TP.HCM · Công ty TNHH CyberSkill · <span style="font-family:var(--cs-font-family-mono);font-size:12.5px">0071 0000 xxxxxx</span></div>
37
37
  <a href="#" style="display:inline-block;background:var(--cs-accent-bright);color:var(--cs-accent-on);font-weight:700;font-size:14.5px;text-decoration:none;padding:13px 24px;border-radius:var(--cs-radius-full)">Xem hóa đơn →</a>
38
38
  <p style="font-size:12.5px;line-height:1.65;margin:18px 0 0;color:var(--cs-color-text-muted)">Theo Hợp đồng khung, khoản không tranh chấp chịu lãi 1%/tháng sau ngày đến hạn — chúng tôi thật lòng không muốn vậy. Một lệnh chuyển nhanh, hoặc một hồi âm nhanh, giữ mọi thứ ấm áp.</p>
39
39
  </div></sc-if>
package/templates/finance-expense-report/FinanceExpenseReport.dc.html CHANGED
@@ -32,7 +32,7 @@
32
32
  <tr style="border-bottom:1px solid var(--cs-color-border-default)"><td style="padding:9px 10px;font-family:var(--cs-font-family-mono);font-size:11.5px">15/07</td><td style="padding:9px 10px;font-weight:600">Client lunch (4 people)</td><td style="padding:9px 10px;color:var(--cs-color-text-muted)">Meals</td><td style="padding:9px 10px;text-align:right;font-family:var(--cs-font-family-mono)">980,000</td></tr>
33
33
  </tbody>
34
34
  </table>
35
- <div class="cs-avoid" style="display:flex;justify-content:flex-end;margin-bottom:22px"><div style="display:flex;justify-content:space-between;align-items:center;width:300px;padding:12px 14px;background:var(--cs-accent-strong);color:var(--cs-accent-on-strong);border-radius:var(--cs-radius-md)"><span style="font-weight:700;font-size:13px">Total claimed</span><span style="font-family:var(--cs-font-family-mono);font-weight:800;font-size:15px;color:var(--cs-accent-on-strong)">₫6,030,000</span></div></div>
35
+ <div class="cs-avoid" style="display:flex;justify-content:flex-end;margin-bottom:22px"><div style="display:flex;justify-content:space-between;align-items:center;width:300px;padding:12px 14px;background:var(--cs-accent-strong);color:var(--cs-accent-on-strong);border-radius:var(--cs-radius-md)"><span style="font-weight:700;font-size:13px">Total claimed <span style="font-weight:600;font-size:11px">(VND · transaction currency)</span></span><span style="font-family:var(--cs-font-family-mono);font-weight:800;font-size:15px;color:var(--cs-accent-on-strong)">₫6,030,000</span></div></div>
36
36
  <div class="cs-avoid" style="display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:22px">
37
37
  <div style="background:var(--cs-accent-tint);border-radius:10px;padding:13px 16px;font-size:12.5px;line-height:1.6"><b>Receipts.</b> All three attached (photos in the drive folder linked from the Hub). No receipt, no reimbursement — fair for everyone.</div>
38
38
  <div style="border:1px solid var(--cs-color-border-default);border-radius:10px;padding:13px 16px;font-size:12.5px;line-height:1.6;color:var(--cs-color-text-muted)"><b style="color:var(--cs-color-text-primary)">Policy notes.</b> Within per-diem caps · client meal pre-approved by lead · paid to salary account with next payroll.</div>
@@ -53,7 +53,7 @@
53
53
  <tr style="border-bottom:1px solid var(--cs-color-border-default)"><td style="padding:9px 10px;font-family:var(--cs-font-family-mono);font-size:11.5px">15/07</td><td style="padding:9px 10px;font-weight:600">Ăn trưa với khách (4 người)</td><td style="padding:9px 10px;color:var(--cs-color-text-muted)">Ăn uống</td><td style="padding:9px 10px;text-align:right;font-family:var(--cs-font-family-mono)">980.000</td></tr>
54
54
  </tbody>
55
55
  </table>
56
- <div class="cs-avoid" style="display:flex;justify-content:flex-end;margin-bottom:22px"><div style="display:flex;justify-content:space-between;align-items:center;width:300px;padding:12px 14px;background:var(--cs-accent-strong);color:var(--cs-accent-on-strong);border-radius:var(--cs-radius-md)"><span style="font-weight:700;font-size:13px">Tổng đề nghị</span><span style="font-family:var(--cs-font-family-mono);font-weight:800;font-size:15px;color:var(--cs-accent-on-strong)">₫6.030.000</span></div></div>
56
+ <div class="cs-avoid" style="display:flex;justify-content:flex-end;margin-bottom:22px"><div style="display:flex;justify-content:space-between;align-items:center;width:300px;padding:12px 14px;background:var(--cs-accent-strong);color:var(--cs-accent-on-strong);border-radius:var(--cs-radius-md)"><span style="font-weight:700;font-size:13px">Tổng đề nghị <span style="font-weight:600;font-size:11px">(VND · tiền tệ giao dịch)</span></span><span style="font-family:var(--cs-font-family-mono);font-weight:800;font-size:15px;color:var(--cs-accent-on-strong)">₫6.030.000</span></div></div>
57
57
  <div class="cs-avoid" style="display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:22px">
58
58
  <div style="background:var(--cs-accent-tint);border-radius:10px;padding:13px 16px;font-size:12.5px;line-height:1.65"><b>Hóa đơn.</b> Đủ ba chứng từ (ảnh trong thư mục drive, liên kết từ Hub). Không chứng từ, không hoàn — công bằng cho tất cả.</div>
59
59
  <div style="border:1px solid var(--cs-color-border-default);border-radius:10px;padding:13px 16px;font-size:12.5px;line-height:1.65;color:var(--cs-color-text-muted)"><b style="color:var(--cs-color-text-primary)">Ghi chú chính sách.</b> Trong hạn mức công tác phí · bữa với khách đã được lead duyệt trước · hoàn vào tài khoản lương kỳ gần nhất.</div>
package/templates/finance-invoice/FinanceInvoice.dc.html CHANGED
@@ -27,7 +27,7 @@
27
27
  <div class="cs-avoid" style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-bottom:30px">
28
28
  <div><div style="font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--cs-color-text-muted);margin-bottom:6px">From</div><div style="font-size:13px;line-height:1.6"><b>CyberSkill Co., Ltd</b><br>District 1, Ho Chi Minh City<br>Tax ID 0312xxxxxx</div></div>
29
29
  <div><div style="font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--cs-color-text-muted);margin-bottom:6px">Bill to</div><div style="font-size:13px;line-height:1.6"><b>[Client Ltd]</b><br>[Address line]<br>Tax ID [number]</div></div>
30
- <div><div style="font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--cs-color-text-muted);margin-bottom:6px">Details</div><div style="font-size:13px;line-height:1.7"><span style="color:var(--cs-color-text-muted)">Issued</span> 18 Jul 2026<br><span style="color:var(--cs-color-text-muted)">Due</span> <b>02 Aug 2026</b><br><span style="color:var(--cs-color-text-muted)">Terms</span> Net 15</div></div>
30
+ <div><div style="font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--cs-color-text-muted);margin-bottom:6px">Details</div><div style="font-size:13px;line-height:1.7"><span style="color:var(--cs-color-text-muted)">Issued</span> 18 Jul 2026<br><span style="color:var(--cs-color-text-muted)">Due</span> <b>02 Aug 2026</b><br><span style="color:var(--cs-color-text-muted)">Terms</span> Net 15<br><span style="color:var(--cs-color-text-muted)">Currency</span> <b>VND</b> <span style="color:var(--cs-color-text-muted)">(transaction — independent of Language)</span></div></div>
31
31
  </div>
32
32
  <table style="width:100%;border-collapse:collapse;font-size:13px;margin-bottom:8px">
33
33
  <thead><tr style="border-bottom:2px solid var(--cs-color-brand-umber)"><th style="text-align:left;padding:9px 10px;font-size:10.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted)">Description</th><th style="text-align:right;padding:9px 10px;font-size:10.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted)">Qty</th><th style="text-align:right;padding:9px 10px;font-size:10.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted)">Rate</th><th style="text-align:right;padding:9px 10px;font-size:10.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted)">Amount</th></tr></thead>
@@ -54,7 +54,7 @@
54
54
  <div class="cs-avoid" style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-bottom:30px">
55
55
  <div><div style="font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--cs-color-text-muted);margin-bottom:6px">Đơn vị bán</div><div style="font-size:13px;line-height:1.6"><b>Công ty TNHH CyberSkill</b><br>Quận 1, TP. Hồ Chí Minh<br>MST 0312xxxxxx</div></div>
56
56
  <div><div style="font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--cs-color-text-muted);margin-bottom:6px">Gửi đến</div><div style="font-size:13px;line-height:1.6"><b>[Công ty khách hàng]</b><br>[Địa chỉ]<br>MST [số]</div></div>
57
- <div><div style="font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--cs-color-text-muted);margin-bottom:6px">Chi tiết</div><div style="font-size:13px;line-height:1.7"><span style="color:var(--cs-color-text-muted)">Ngày lập</span> 18/07/2026<br><span style="color:var(--cs-color-text-muted)">Hạn thanh toán</span> <b>02/08/2026</b><br><span style="color:var(--cs-color-text-muted)">Điều khoản</span> Net 15</div></div>
57
+ <div><div style="font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--cs-color-text-muted);margin-bottom:6px">Chi tiết</div><div style="font-size:13px;line-height:1.7"><span style="color:var(--cs-color-text-muted)">Ngày lập</span> 18/07/2026<br><span style="color:var(--cs-color-text-muted)">Hạn thanh toán</span> <b>02/08/2026</b><br><span style="color:var(--cs-color-text-muted)">Điều khoản</span> Net 15<br><span style="color:var(--cs-color-text-muted)">Tiền tệ</span> <b>VND</b> <span style="color:var(--cs-color-text-muted)">(giao dịch — độc lập với Language)</span></div></div>
58
58
  </div>
59
59
  <table style="width:100%;border-collapse:collapse;font-size:13px;margin-bottom:8px">
60
60
  <thead><tr style="border-bottom:2px solid var(--cs-color-brand-umber)"><th style="text-align:left;padding:9px 10px;font-size:10.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted)">Hạng mục</th><th style="text-align:right;padding:9px 10px;font-size:10.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted)">SL</th><th style="text-align:right;padding:9px 10px;font-size:10.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted)">Đơn giá</th><th style="text-align:right;padding:9px 10px;font-size:10.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted)">Thành tiền</th></tr></thead>
package/templates/finance-quote/FinanceQuote.dc.html CHANGED
@@ -37,11 +37,11 @@
37
37
  </tbody>
38
38
  </table>
39
39
  <div class="cs-avoid" style="display:flex;justify-content:space-between;align-items:center;gap:24px;margin:22px 0 26px">
40
- <div style="font-size:12.5px;color:var(--cs-color-text-muted);line-height:1.6;max-width:360px">Prices exclude 10% VAT. Fixed scope; changes handled by a signed change note. This quote is valid for <b style="color:var(--cs-color-text-primary)">30 days</b>.</div>
40
+ <div style="font-size:12.5px;color:var(--cs-color-text-muted);line-height:1.6;max-width:360px">Prices exclude 10% VAT. Fixed scope; changes handled by a signed change note. This quote is valid for <b style="color:var(--cs-color-text-primary)">30 days</b>. <span style="color:var(--cs-color-text-muted)">Currency</span> <b>VND</b> <span style="color:var(--cs-color-text-muted)">(transaction — independent of Language)</span>.</div>
41
41
  <div style="text-align:right"><div style="font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted);font-weight:700">Total (core scope)</div><div style="font-family:var(--cs-font-family-mono);font-weight:800;font-size:26px;color:var(--cs-color-brand-umber);margin-top:2px">₫3,100,000,000</div></div>
42
42
  </div>
43
43
  <div class="cs-avoid" style="display:flex;align-items:center;gap:20px;background:var(--cs-accent-strong);border-radius:12px;padding:20px 26px">
44
- <div style="flex:1"><div style="font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-accent-bright);font-weight:700;margin-bottom:3px">Ready when you are</div><div style="color:var(--cs-accent-on-strong);font-size:14px;line-height:1.55">Say yes and we&rsquo;ll send the SOW and a start date within one business day.</div></div>
44
+ <div style="flex:1"><div style="font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-accent-on-strong);font-weight:700;margin-bottom:3px">Ready when you are</div><div style="color:var(--cs-accent-on-strong);font-size:14px;line-height:1.55">Say yes and we&rsquo;ll send the SOW and a start date within one business day.</div></div>
45
45
  <span style="display:inline-block;background:var(--cs-accent-bright);color:var(--cs-accent-on);font-weight:700;font-size:14px;padding:12px 22px;border-radius:var(--cs-radius-full);white-space:nowrap">Accept this quote →</span>
46
46
  </div>
47
47
  <div style="font-size:12px;color:var(--cs-color-text-muted);margin-top:20px">Prepared by Minh Trần · CyberSkill · Valid until <b style="color:var(--cs-color-text-primary)">17 Aug 2026</b></div>
@@ -61,11 +61,11 @@
61
61
  </tbody>
62
62
  </table>
63
63
  <div class="cs-avoid" style="display:flex;justify-content:space-between;align-items:center;gap:24px;margin:22px 0 26px">
64
- <div style="font-size:12.5px;color:var(--cs-color-text-muted);line-height:1.65;max-width:360px">Giá chưa gồm 10% thuế GTGT. Phạm vi cố định; thay đổi qua văn bản điều chỉnh có chữ ký. Báo giá có hiệu lực <b style="color:var(--cs-color-text-primary)">30 ngày</b>.</div>
64
+ <div style="font-size:12.5px;color:var(--cs-color-text-muted);line-height:1.65;max-width:360px">Giá chưa gồm 10% thuế GTGT. Phạm vi cố định; thay đổi qua văn bản điều chỉnh có chữ ký. Báo giá có hiệu lực <b style="color:var(--cs-color-text-primary)">30 ngày. <span style="color:var(--cs-color-text-muted)">Tiền tệ</span> <b>VND</b> <span style="color:var(--cs-color-text-muted)">(giao dịch — độc lập với Language)</span></b>.</div>
65
65
  <div style="text-align:right"><div style="font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-color-text-muted);font-weight:700">Tổng (phạm vi chính)</div><div style="font-family:var(--cs-font-family-mono);font-weight:800;font-size:26px;color:var(--cs-color-brand-umber);margin-top:2px">₫3.100.000.000</div></div>
66
66
  </div>
67
67
  <div class="cs-avoid" style="display:flex;align-items:center;gap:20px;background:var(--cs-accent-strong);border-radius:12px;padding:20px 26px">
68
- <div style="flex:1"><div style="font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-accent-bright);font-weight:700;margin-bottom:3px">Sẵn sàng khi bạn sẵn sàng</div><div style="color:var(--cs-accent-on-strong);font-size:14px;line-height:1.6">Đồng ý, và chúng tôi sẽ gửi SOW cùng ngày bắt đầu trong vòng một ngày làm việc.</div></div>
68
+ <div style="flex:1"><div style="font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--cs-accent-on-strong);font-weight:700;margin-bottom:3px">Sẵn sàng khi bạn sẵn sàng</div><div style="color:var(--cs-accent-on-strong);font-size:14px;line-height:1.6">Đồng ý, và chúng tôi sẽ gửi SOW cùng ngày bắt đầu trong vòng một ngày làm việc.</div></div>
69
69
  <span style="display:inline-block;background:var(--cs-accent-bright);color:var(--cs-accent-on);font-weight:700;font-size:14px;padding:12px 22px;border-radius:var(--cs-radius-full);white-space:nowrap">Chấp nhận báo giá →</span>
70
70
  </div>
71
71
  <div style="font-size:12px;color:var(--cs-color-text-muted);margin-top:20px">Soạn bởi Minh Trần · CyberSkill · Hiệu lực đến <b style="color:var(--cs-color-text-primary)">17/08/2026</b></div>
package/templates/hr-interview-kit/HrInterviewKit.dc.html CHANGED
@@ -95,7 +95,7 @@ class Component extends DCLogic {
95
95
  const EL = {"Thổ · studio":["tho",""],"Thổ · clay":["tho","clay"],"Thổ · sand":["tho","sand"],"Hỏa · ember":["hoa",""],"Hỏa · lava":["hoa","lava"],"Hỏa · plasma":["hoa","plasma"],"Thủy · river":["thuy",""],"Thủy · ocean":["thuy","ocean"],"Thủy · mist":["thuy","mist"],"Mộc · leaf":["moc",""],"Mộc · bamboo":["moc","bamboo"],"Mộc · forest":["moc","forest"],"Kim · champagne":["kim",""],"Kim · steel":["kim","steel"],"Kim · titanium":["kim","titanium"]};
96
96
  const [elAttr, vaAttr] = EL[this.props.element] || EL["Thổ · studio"];
97
97
  const lang = this.props.language ?? "English";
98
- return { langAttr: (this.props.language ?? "English") === "Tiếng Việt" ? "vi" : "en", elAttr, vaAttr, isEN: lang !== "Tiếng Việt", isVN: lang === "Tiếng Việt", hdrLabel: lang === "Tiếng Việt" ? "Bộ phỏng vấn · Mật" : "Interview kit · Confidential" };
98
+ return { langAttr: (this.props.language ?? "English") === "Tiếng Việt" ? "vi" : "en", elAttr, vaAttr, isEN: lang !== "Tiếng Việt", isVN: lang === "Tiếng Việt", hdrLabel: lang === "Tiếng Việt" ? "Bộ phỏng vấn · Mật" : "Confidential · HR" };
99
99
  }
100
100
  }
101
101
  </script>
package/templates/marketing-case-study/MarketingCaseStudy.dc.html CHANGED
@@ -69,7 +69,7 @@ class Component extends DCLogic {
69
69
  quote:"\u201cWe described the outcome in two sentences. Twelve weeks later it was live — and it still runs itself.\u201d", quoteWho:"Product lead, Retailer A",
70
70
  ctaKicker:"Have a wish like this?", ctaBody:"Tell us the outcome in a sentence. We reply within one business day.", ctaBtn:"Make a wish →"};
71
71
  const vi = {
72
- kicker:"Case study", stat1:"Đơn hoàn tất", stat2:"Thời gian thanh toán", stat3v:"12 tuần", stat3:"Từ điều ước đến ra mắt",
72
+ kicker:"Nghiên cứu tình huống", stat1:"Đơn hoàn tất", stat2:"Thời gian thanh toán", stat3v:"12 tuần", stat3:"Từ điều ước đến ra mắt",
73
73
  h1:"Điều ước", p1:"Cứ ba người mua thì một bỏ giỏ ở bước thanh toán, và bộ phận hỗ trợ không thấy vì sao. Yêu cầu, gói trong một câu: một trang thanh toán cứ thế chạy — và một console để vận hành mỗi ngày.",
74
74
  h2:"Cách chúng tôi định hình", p2:"Một cặp senior dựng lại thanh toán sau một feature flag và kiểm chứng trên 10% lưu lượng trước khi cắt chuyển. Ops console ra song song, nên hỗ trợ thấy được đơn hàng từ tuần thứ ba. Đánh đổi thành thật, nói trước: giữ nguyên nhà cung cấp thanh toán và dồn ngân sách vào nơi phễu rò rỉ.",
75
75
  h3:"Điều còn lại", p3:"Email khôi phục nay kéo về một phần năm số giỏ bị bỏ. Console xử lý hoàn tiền mà không cần đến kỹ thuật. Tài liệu, runbook và analytics được bàn giao gọn gàng — làm để chạy được, làm để bền lâu.",
package/templates/marketing-page/MarketingPage.dc.html CHANGED
@@ -14,7 +14,7 @@
14
14
  <script src="../../image-slot.js"></script>
15
15
  </helmet>
16
16
  <div data-theme="{{ rootTheme }}" lang="{{ langAttr }}" data-cs-element="{{ elAttr }}" data-cs-variant="{{ vaAttr }}" style="font-family:var(--cs-font-family-ui);color:var(--cs-color-text-primary);background:var(--cs-color-surface-page);min-height:100vh">
17
- <a class="cs-skip" href="#main" style="position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden">Skip to content</a>
17
+ <a class="cs-skip" href="#main" style="position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden">{{ skipLabel }}</a>
18
18
  <main id="main">
19
19
  <header style="position:sticky;top:0;z-index:50;display:flex;align-items:center;flex-wrap:wrap;gap:10px 24px;padding:14px 32px;background:color-mix(in oklab,var(--cs-color-surface-panel) 82%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--cs-color-border-default)">
20
20
  <div style="display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;color:var(--cs-color-text-primary);letter-spacing:-0.01em">
@@ -124,8 +124,8 @@ class Component extends DCLogic {
124
124
  const EL = {"Thổ · studio":["tho",""],"Thổ · clay":["tho","clay"],"Thổ · sand":["tho","sand"],"Hỏa · ember":["hoa",""],"Hỏa · lava":["hoa","lava"],"Hỏa · plasma":["hoa","plasma"],"Thủy · river":["thuy",""],"Thủy · ocean":["thuy","ocean"],"Thủy · mist":["thuy","mist"],"Mộc · leaf":["moc",""],"Mộc · bamboo":["moc","bamboo"],"Mộc · forest":["moc","forest"],"Kim · champagne":["kim",""],"Kim · steel":["kim","steel"],"Kim · titanium":["kim","titanium"]};
125
125
  const [elAttr, vaAttr] = EL[this.props.element] || EL["Thổ · studio"];
126
126
  const vn = this.props.language === "Tiếng Việt";
127
- const en = { navServices:"Services", navProcess:"Process", navContact:"Contact", talkBtn:"Talk to Lumi", heroKicker:"A Saigon studio · since 2020", heroH:"Turn Your Will Into Real", heroSub:"Hiện Thực Hoá Ý Chí", heroP:"Tell us a wish in a sentence. Lumi shares plain advice, then hands it to a real team who build software your people actually run — built to ship, built to last.", promptPh:"Make a wish… a faster checkout, an app, a tool", promptSend:"Make a wish", svcKicker:"Services", svcH:"What we build", svcP:"Three focused practices. One team that answers for the result.", c1h:"Web & mobile apps", c1p:"Product apps your customers reach for — fast, accessible, bilingual by default.", c2h:"Internal systems & automation", c2p:"The tools your team runs on: dashboards, workflows, and the automation behind them.", c3h:"Built to last", c3p:"Shipped software that keeps running — tested, documented, handed over cleanly.", ctaH:"Ready to make a wish?", ctaP:"Send a short note. We reply within one business day.", chatHello:"Hello, I’m Lumi. Tell me a wish, and I’ll share plain advice before asking for anything.", chatPh:"Type your wish…", chatSend:"Send", footer:"© 2026 CyberSkill · Saigon · Turn Your Will Into Real", genieLabel:"golden genie" };
128
- const vi = { navServices:"Dịch vụ", navProcess:"Quy trình", navContact:"Liên hệ", talkBtn:"Trò chuyện với Lumi", heroKicker:"Studio Sài Gòn · từ 2020", heroH:"Hiện Thực Hoá Ý Chí", heroSub:"Turn Your Will Into Real", heroP:"Kể cho chúng tôi một điều ước trong một câu. Lumi chia sẻ lời khuyên thẳng thắn, rồi trao cho một đội ngũ thật xây phần mềm mà người của bạn thực sự vận hành — làm để chạy được, làm để bền lâu.", promptPh:"Gửi điều ước… thanh toán nhanh hơn, một app, một công cụ", promptSend:"Gửi điều ước", svcKicker:"Dịch vụ", svcH:"Chúng tôi xây gì", svcP:"Ba mảng tập trung. Một đội ngũ chịu trách nhiệm về kết quả.", c1h:"Ứng dụng web & di động", c1p:"Sản phẩm khách hàng muốn dùng — nhanh, dễ tiếp cận, song ngữ mặc định.", c2h:"Hệ thống nội bộ & tự động hoá", c2p:"Công cụ đội bạn vận hành: dashboard, luồng công việc, và tự động hoá phía sau.", c3h:"Làm để bền lâu", c3p:"Phần mềm đã ra mắt vẫn chạy đều — kiểm thử, tài liệu, bàn giao gọn gàng.", ctaH:"Sẵn sàng gửi điều ước?", ctaP:"Gửi một ghi chú ngắn. Chúng tôi phản hồi trong một ngày làm việc.", chatHello:"Xin chào, tôi là Lumi. Kể cho tôi một điều ước, tôi sẽ chia sẻ lời khuyên thẳng thắn trước khi hỏi bất cứ điều gì.", chatPh:"Nhập điều ước của bạn…", chatSend:"Gửi", footer:"© 2026 CyberSkill · Sài Gòn · Hiện Thực Hoá Ý Chí", genieLabel:"thần đèn vàng" };
127
+ const en = { skipLabel:"Skip to content", navServices:"Services", navProcess:"Process", navContact:"Contact", talkBtn:"Talk to Lumi", heroKicker:"A Saigon studio · since 2020", heroH:"Turn Your Will Into Real", heroSub:"Hiện Thực Hoá Ý Chí", heroP:"Tell us a wish in a sentence. Lumi shares plain advice, then hands it to a real team who build software your people actually run — built to ship, built to last.", promptPh:"Make a wish… a faster checkout, an app, a tool", promptSend:"Make a wish", svcKicker:"Services", svcH:"What we build", svcP:"Three focused practices. One team that answers for the result.", c1h:"Web & mobile apps", c1p:"Product apps your customers reach for — fast, accessible, bilingual by default.", c2h:"Internal systems & automation", c2p:"The tools your team runs on: dashboards, workflows, and the automation behind them.", c3h:"Built to last", c3p:"Shipped software that keeps running — tested, documented, handed over cleanly.", ctaH:"Ready to make a wish?", ctaP:"Send a short note. We reply within one business day.", chatHello:"Hello, I’m Lumi. Tell me a wish, and I’ll share plain advice before asking for anything.", chatPh:"Type your wish…", chatSend:"Send", footer:"© 2026 CyberSkill · Saigon · Turn Your Will Into Real", genieLabel:"golden genie" };
128
+ const vi = { skipLabel:"Bỏ qua nội dung", navServices:"Dịch vụ", navProcess:"Quy trình", navContact:"Liên hệ", talkBtn:"Trò chuyện với Lumi", heroKicker:"Studio Sài Gòn · từ 2020", heroH:"Hiện Thực Hoá Ý Chí", heroSub:"Turn Your Will Into Real", heroP:"Kể cho chúng tôi một điều ước trong một câu. Lumi chia sẻ lời khuyên thẳng thắn, rồi trao cho một đội ngũ thật xây phần mềm mà người của bạn thực sự vận hành — làm để chạy được, làm để bền lâu.", promptPh:"Gửi điều ước… thanh toán nhanh hơn, một app, một công cụ", promptSend:"Gửi điều ước", svcKicker:"Dịch vụ", svcH:"Chúng tôi xây gì", svcP:"Ba mảng tập trung. Một đội ngũ chịu trách nhiệm về kết quả.", c1h:"Ứng dụng web & di động", c1p:"Sản phẩm khách hàng muốn dùng — nhanh, dễ tiếp cận, song ngữ mặc định.", c2h:"Hệ thống nội bộ & tự động hoá", c2p:"Công cụ đội bạn vận hành: dashboard, luồng công việc, và tự động hoá phía sau.", c3h:"Làm để bền lâu", c3p:"Phần mềm đã ra mắt vẫn chạy đều — kiểm thử, tài liệu, bàn giao gọn gàng.", ctaH:"Sẵn sàng gửi điều ước?", ctaP:"Gửi một ghi chú ngắn. Chúng tôi phản hồi trong một ngày làm việc.", chatHello:"Xin chào, tôi là Lumi. Kể cho tôi một điều ước, tôi sẽ chia sẻ lời khuyên thẳng thắn trước khi hỏi bất cứ điều gì.", chatPh:"Nhập điều ước của bạn…", chatSend:"Gửi", footer:"© 2026 CyberSkill · Sài Gòn · Hiện Thực Hoá Ý Chí", genieLabel:"thần đèn vàng" };
129
129
  return Object.assign({ langAttr: (this.props.language ?? "English") === "Tiếng Việt" ? "vi" : "en", elAttr, vaAttr, rootTheme: this.props.theme === "dark" ? "dark" : "",
130
130
  /* FAB omitted — header Talk to Lumi is the single secondary CTA (UX-016). */
131
131
  showLauncher: false, chatOpen: this.state.chatOpen,
package/templates/marketing-page/content-schema.json CHANGED
@@ -2,6 +2,7 @@
2
2
  "$schemaVersion": "2.0",
3
3
  "template": "marketing-page",
4
4
  "slots": [
5
+ { "id": "skipLabel", "type": "text", "label": "Skip-to-content link label", "maxLength": 40, "required": true },
5
6
  { "id": "heroKicker", "type": "text", "label": "Hero eyebrow", "maxLength": 40, "i18n": {"en": "Eyebrow above the headline", "vi": "Nhãn nhỏ phía trên tiêu đề"} },
6
7
  { "id": "heroH", "type": "text", "label": "Hero headline", "maxLength": 70, "required": true },
7
8
  { "id": "heroSub", "type": "text", "label": "Hero subhead", "maxLength": 90 },
package/templates/settings/Settings.dc.html CHANGED
@@ -13,7 +13,7 @@
13
13
  <script src="./ds-base.js"></script>
14
14
  </helmet>
15
15
  <div data-theme="{{ rootTheme }}" lang="{{ langAttr }}" data-cs-element="{{ elAttr }}" data-cs-variant="{{ vaAttr }}" style="font-family:var(--cs-font-family-ui);color:var(--cs-color-text-primary);background:var(--cs-color-surface-page);min-height:100vh">
16
- <a class="cs-skip" href="#main" style="position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden">Skip to content</a>
16
+ <a class="cs-skip" href="#main" style="position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden">{{ skipLabel }}</a>
17
17
  <main id="main">
18
18
  <div style="max-width:840px;margin:0 auto;padding:36px 28px 80px">
19
19
  <h1 style="font-size:30px;font-weight:800;letter-spacing:-0.02em;margin:0 0 4px">{{ title }}</h1>
@@ -83,8 +83,8 @@ class Component extends DCLogic {
83
83
  const [elAttr, vaAttr] = EL[this.props.element] || EL["Thổ · studio"];
84
84
  const tab = this.tab;
85
85
  const vn = this.props.language === "Tiếng Việt";
86
- const en = { title:"Settings", sub:"Workspace & preferences · an@cyberskill.world", pfL:"Profile", ntL:"Notifications", profileH:"Profile", profileP:"This is how you appear across the workspace.", nameL:"Full name", emailL:"Work email", squadL:"Squad", ifaceL:"Interface language", notifH:"Notifications", notifP:"We keep it quiet — only what you ask for.", n1t:"Release notes", n1d:"A summary each time a project ships. Bilingual.", n2t:"Blocked-project alerts", n2d:"Get pinged when a project is blocked.", n3t:"Weekly velocity digest", n3d:"Tasks shipped per week, every Monday morning.", n4t:"Quiet hours", n4d:"No pings between 22:00 and 07:00 local time.", advT:"Advanced preferences", advD:"Digest timing and quiet hours stay here — expand only when you need them.", dangerT:"Delete workspace", dangerD:"Removes every project and release. This cannot be undone.", dangerBtn:"Delete workspace", cancelBtn:"Cancel", saveBtn:"Save changes" };
87
- const vi = { title:"Cài đặt", sub:"Không gian làm việc & tuỳ chọn · an@cyberskill.world", pfL:"Hồ sơ", ntL:"Thông báo", profileH:"Hồ sơ", profileP:"Đây là cách bạn hiển thị trong không gian làm việc.", nameL:"Họ và tên", emailL:"Email công việc", squadL:"Nhóm", ifaceL:"Ngôn ngữ giao diện", notifH:"Thông báo", notifP:"Chúng tôi giữ yên tĩnh — chỉ gửi thứ bạn yêu cầu.", n1t:"Ghi chú phát hành", n1d:"Bản tóm tắt mỗi khi một dự án ra mắt. Song ngữ.", n2t:"Cảnh báo dự án bị chặn", n2d:"Được báo khi một dự án bị chặn.", n3t:"Tóm tắt tốc độ tuần", n3d:"Số task giao mỗi tuần, sáng thứ Hai.", n4t:"Giờ yên tĩnh", n4d:"Không ping từ 22:00 đến 07:00 theo giờ địa phương.", advT:"Tuỳ chọn nâng cao", advD:"Thời gian tóm tắt và giờ yên tĩnh nằm ở đây — chỉ mở khi bạn cần.", dangerT:"Xoá không gian làm việc", dangerD:"Xoá mọi dự án và bản phát hành. Không thể hoàn tác.", dangerBtn:"Xoá không gian làm việc", cancelBtn:"Huỷ", saveBtn:"Lưu thay đổi" };
86
+ const en = { skipLabel:"Skip to content", title:"Settings", sub:"Workspace & preferences · an@cyberskill.world", pfL:"Profile", ntL:"Notifications", profileH:"Profile", profileP:"This is how you appear across the workspace.", nameL:"Full name", emailL:"Work email", squadL:"Squad", ifaceL:"Interface language", notifH:"Notifications", notifP:"We keep it quiet — only what you ask for.", n1t:"Release notes", n1d:"A summary each time a project ships. Bilingual.", n2t:"Blocked-project alerts", n2d:"Get pinged when a project is blocked.", n3t:"Weekly velocity digest", n3d:"Tasks shipped per week, every Monday morning.", n4t:"Quiet hours", n4d:"No pings between 22:00 and 07:00 local time.", advT:"Advanced preferences", advD:"Digest timing and quiet hours stay here — expand only when you need them.", dangerT:"Delete workspace", dangerD:"Removes every project and release. This cannot be undone.", dangerBtn:"Delete workspace", cancelBtn:"Cancel", saveBtn:"Save changes" };
87
+ const vi = { skipLabel:"Bỏ qua nội dung", title:"Cài đặt", sub:"Không gian làm việc & tuỳ chọn · an@cyberskill.world", pfL:"Hồ sơ", ntL:"Thông báo", profileH:"Hồ sơ", profileP:"Đây là cách bạn hiển thị trong không gian làm việc.", nameL:"Họ và tên", emailL:"Email công việc", squadL:"Nhóm", ifaceL:"Ngôn ngữ giao diện", notifH:"Thông báo", notifP:"Chúng tôi giữ yên tĩnh — chỉ gửi thứ bạn yêu cầu.", n1t:"Ghi chú phát hành", n1d:"Bản tóm tắt mỗi khi một dự án ra mắt. Song ngữ.", n2t:"Cảnh báo dự án bị chặn", n2d:"Được báo khi một dự án bị chặn.", n3t:"Tóm tắt tốc độ tuần", n3d:"Số task giao mỗi tuần, sáng thứ Hai.", n4t:"Giờ yên tĩnh", n4d:"Không ping từ 22:00 đến 07:00 theo giờ địa phương.", advT:"Tuỳ chọn nâng cao", advD:"Thời gian tóm tắt và giờ yên tĩnh nằm ở đây — chỉ mở khi bạn cần.", dangerT:"Xoá không gian làm việc", dangerD:"Xoá mọi dự án và bản phát hành. Không thể hoàn tác.", dangerBtn:"Xoá không gian làm việc", cancelBtn:"Huỷ", saveBtn:"Lưu thay đổi" };
88
88
  const t = vn ? vi : en;
89
89
  return Object.assign({ langAttr: (this.props.language ?? "English") === "Tiếng Việt" ? "vi" : "en", elAttr, vaAttr, rootTheme: this.props.theme === "dark" ? "dark" : "", tab, isProfile: tab === "profile", isNotifications: tab === "notifications",
90
90
  tabs: [{ value: "profile", label: t.pfL }, { value: "notifications", label: t.ntL }],
package/templates/settings/content-schema.json CHANGED
@@ -2,6 +2,13 @@
2
2
  "$schemaVersion": "2.0",
3
3
  "template": "settings",
4
4
  "slots": [
5
+ {
6
+ "id": "skipLabel",
7
+ "type": "text",
8
+ "label": "Skip-to-content link label",
9
+ "maxLength": 40,
10
+ "required": true
11
+ },
5
12
  {
6
13
  "id": "title",
7
14
  "type": "text",
package/tokens/element-seeds.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$meta": {
3
3
  "system": "CyberSkill Design System",
4
- "version": "1.0.0",
4
+ "version": "1.3.9",
5
5
  "note": "OKLCH seed contract for the 15 element packs × light/dark (30 sets). SoT for scripts/generate-element-packs.mjs — do not hand-edit tokens/elements.css. Owner bar (Jul 2026): soft/middle/deep clearly distinct; middle intensity synced across elements; harmonious role palettes; light↔dark same-hue identity. Public variant names unchanged."
6
6
  },
7
7
  "intensity": {
@@ -35,7 +35,7 @@
35
35
  "tintCMax": 0.06
36
36
  },
37
37
  "tuongSinh": {
38
- "tho": "hoa",
38
+ "tho": "kim",
39
39
  "hoa": "tho",
40
40
  "thuy": "moc",
41
41
  "moc": "hoa",