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

Toggle

المان Toggle یک دکمه خروجی می‌دهد که برای باز و بستن رابط‌های دیگر—اغلب منوی Offcanvas—استفاده می‌شود. می‌توانید از یک آیکون سفارشی یا نوارهای انیمیشن‌دار داخلی “hamburger” (با پیش‌تنظیم‌های Animation اختیاری) استفاده کنید.

Bricks یک راهنمای inline نمایش می‌دهد: element ID (یا یک CSS selector معتبر) هدف را در فیلد CSS selector وارد کنید—برای مثال .brxe-offcanvas برای یک Offcanvas.

تنظیمات

آیکون (Icon) — اختیاری

اگر یک Icon اضافه کنید، انیمیشن نوار مخفی شده و به‌جای آن آیکون نمایش داده می‌شود.

  • Icon (icon) — آیکون سفارشی.
  • Color (color) — رنگ/fill آیکون.
  • Size (number with units) — اندازه آیکون.

Toggle

  • CSS selector (text) — گره هدف برای toggle کردن (مثلاً .brxe-offcanvas). Placeholder: .brxe-offcanvas.
  • Attribute (text) — attribute HTML برای تغییر (رفتار پیش‌فرض از class استفاده می‌کند). Placeholder: class.
  • Value (text) — مقدار اعمال‌شده هنگام toggle کردن (مثلاً کلاس حالت باز). Placeholder: brx-open.

نوار (Bar) — وقتی آیکون سفارشی وجود ندارد

  • Animation (select) — انیمیشن hamburger پیش‌تنظیم: close (x)، arrow، arrow-r، arrowalt، arrowalt-r، arrowturn، arrowturn-r، minus، spin، spring، squeeze، vortex یا هیچ‌کدام.
  • Scale (number) — مقیاس نوار از طریق --brxe-toggle-scale.
  • Height، Radius (number with units) — ابعاد نوار.
  • Color (color) — رنگ نوار.

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

  • aria-label (text) — پیش‌فرض: «Open» (یا «Close» وقتی به‌عنوان کنترل بستن تودرتو در ساختارهایی مثل Nav استفاده می‌شود).

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