ساعت داک — عقربهای و هویت تمها
ساعت داک دو شکل دارد: عددی و عقربهای. بنیان (ساختار، زاویهٔ عقربهها، برچسب دسترسی، ARIA) در TUK ثابت است. هر تم فقط توکنهای ظاهر و زمان و منحنی حرکت را میدهد؛ جای عقربه، شکل و معنا تغییر نمیکند.
وضعیت: beta · لایه: ۳ (کپی کد) · کد: کپی کد · هویتها: کپی کد
import { DockClock } from '@tokapps/tuk/dock';<DockClock calendar="jalali" face="analog" />هویت هر تم
Tokapps Core
Ideation
Funding
Product Hunt
Stories
Enterprise
| تم | ظاهر | حرکت عقربهها |
|---|---|---|
| Tokapps Core | صفحهٔ اکسنتدار، عقربهٔ ساعت پرتر، تیکهای فرعی نیمهشفاف | فنر کوتاه (کپی کد، کپی کد) |
| Ideation | صفحهٔ شفاف با حاشیهٔ اکسنت، عقربههای نازک، فقط تیکهای اصلی | خطی و آرام (کپی کد) |
| Funding | صفحهٔ اکسنت ملایم، بدون تیک فرعی | نرم (کپی کد، کپی کد) |
| Product Hunt | عقربههای ضخیم با اکسنت | کوتاه و تیز (کپی کد) |
| Stories | صفحهٔ شفاف، فقط تیکهای اصلی | نرم (کپی کد) |
| Enterprise | ساده؛ تیکهای فرعی کمرنگ | کوتاه و ساده (کپی کد) |
توکنهایی که تم تنظیم میکند
| توکن | نقش |
|---|---|
| کپی کد · کپی کد | پسزمینه و حاشیهٔ صفحه |
| کپی کد | رنگ تیکها |
| کپی کد · کپی کد | دیدهشدن تیکهای فرعی و اصلی (۰ یعنی پنهان) |
| کپی کد · کپی کد | ضخامت عقربهها (واحد viewBox ۴۰) |
| کپی کد · کپی کد | رنگ عقربهٔ ساعت و عقربهٔ دقیقه و نقطهٔ مرکز |
| کپی کد · کپی کد | مدت و منحنی حرکت عقربهها |
کاهش حرکت (کپی کد یا کپی کد) انتقال عقربهها را حذف میکند؛ زمان نمایش همچنان درست است.
نمونه: تعریف هویت برای تم جدید
/* packages/theme-<id>/src/dock-clock.css */[data-theme="<id>"] [data-tds="dock-clock"] { --tds-dock-clock-face-bg: var(--tds-accent-subtle); --tds-dock-clock-minor-tick-opacity: 0; --tds-dock-clock-hour-stroke: 2.4; --tds-dock-clock-hand-duration: var(--tds-dur-base); --tds-dock-clock-hand-ease: var(--tds-ease-out);}فقط از توکنهای معنایی استفاده کنید؛ رنگ خام و گرادیان در این فایل مجاز نیست. فایل را در کپی کد همان تم import کنید.
نمونه: نمایش زمان مشخص
<DockClock calendar="gregorian" face="analog" at={new Date(2026, 9, 10, 10, 10)} />کپی کد برای مستندات و تست است؛ در داک زنده حذف کنید.