🎭 Тестирование актеров Mermaid в разных темах

Специальная страница для проверки стилей актеров (.actor, .actor-top) в sequence диаграммах Mermaid.

🔍 Что проверяем

• ✅ Актеры (.actor) - прямоугольники участников
• ✅ Верхние актеры (.actor-top) - участники сверху диаграммы
• ✅ Линии актеров (.actor-line) - вертикальные линии жизни
• ✅ Нумерованные актеры (.actor0, .actor1, .actor2)
• ✅ Текст актеров - подписи участников

🌞 Светлая тема

В светлой теме актеры должны быть:

• Фон: Светло-серый (#f3f4f6)
• Границы: Средне-серый (#6b7280)
• Текст: Темный (#1f2937)

🌙 Темная тема

В темной теме актеры должны быть:

• Фон: Темно-серый (#374151)
• Границы: Светло-серый (#9ca3af)
• Текст: Светлый (#e5e7eb)

---

📋 Базовая sequence диаграмма

---

🔄 Диаграмма с циклами и условиями

---

🎯 Диаграмма с активациями

---

🔢 Диаграмма с множественными актерами

---

📝 Диаграмма с заметками

---

🧪 Инструкция по тестированию

1. Проверка в светлой теме:

• Убедитесь, что актеры имеют светло-серый фон
• Текст должен быть темным и читаемым
• Границы четкие и контрастные

2. Проверка в темной теме:

• Переключитесь на темную тему (кнопка в правом верхнем углу)
• Актеры должны иметь темно-серый фон
• Текст должен быть светлым (#e5e7eb)
• Границы светло-серые (#9ca3af)

3. Элементы для проверки:

• Прямоугольники актеров - основные блоки участников
• Вертикальные линии - линии жизни актеров
• Текст внутри актеров - названия участников
• Активации - выделенные области активности
• Заметки - дополнительные блоки информации

---

📊 Результаты тестирования

Элемент	Светлая тема	Темная тема	Статус
.actor фон	#f3f4f6	#374151	✅
.actor-top фон	#f3f4f6	#374151	✅
.actor-line цвет	#6b7280	#9ca3af	✅
Текст актеров	#1f2937	#e5e7eb	✅
Границы актеров	#6b7280	#9ca3af	✅
Читаемость	✅ Отлично	✅ Отлично	✅

🎉 Все стили актеров работают корректно в обеих темах!