پرش به محتویات

Toggle - Mode

المان Toggle - Mode به بازدیدکنندگان اجازه می‌دهد در front end بین حالت‌های رنگی light و dark جابه‌جا شوند. این المان به dark variant های تعریف‌شده در color manager Bricks وابسته است؛ اگر رنگ‌های dark وجود نداشته باشند، کنترل خورشید/ماه نوار ابزار سازنده ظاهر نمی‌شود و همین اصل برای رفتار front end نیز صدق می‌کند.

المان یک button شامل دو ناحیه آیکون (.toggle.light و .toggle.dark) رندر می‌کند؛ CSS آیکون مناسب برای حالت فعال را نمایش می‌دهد.

تنظیمات

یک کنترل info توضیح می‌دهد که در سازنده، هنگامی‌که رنگ‌های dark پیکربندی شده‌اند، با آیکون نوار ابزار بین light/dark جابه‌جا می‌شوید.

حالت: روشن (Mode: Light)

  • Icon (icon) — اختیاری؛ پیش‌فرض گرافیک داخلی حالت light است.
  • Color (color) — رنگ/fill آیکون برای آیکون light.
  • Size (number with units) — اندازه آیکون برای آیکون light.

حالت: تاریک (Mode: Dark)

  • Icon Dark (icon) — اختیاری؛ پیش‌فرض گرافیک داخلی حالت dark است.
  • Color (color) — رنگ/fill آیکون برای آیکون dark.
  • Size (number with units) — اندازه آیکون برای آیکون dark.

دسترسی‌پذیری (Accessibility)

  • aria-label (text) — اگر خالی باشد پیش‌فرض «Toggle mode» است.

!!! tip “مرجع توسعه‌دهنده” JSON schema کامل: toggle-mode Schema