feat(chat): show playful teacher introductions on hover
This commit is contained in:
1 parent
b26e25c9ed
commit
772da4f8e4
16 files changed
+433
-62
No files matched your search
@@ -70,6 +70,17 @@
|
||||
/* The teacher speaks from the title bar without taking the student's focus. */
|
||||
.classroom-composer-view[hidden] { display: none; }
|
||||
.teacher-companion { position: relative; min-width: 0; max-width: 65%; }
|
||||
.teacher-introduction { z-index: 200; width: min(304px, calc(100vw - 24px)); max-height: var(--radix-tooltip-content-available-height); padding: 18px; border: 2px solid #ead6af; border-radius: 22px; background: #fff9ed; color: #30465f; box-shadow: 0 5px 0 #ecdcc1, 0 12px 30px #354d6c18; transform-origin: var(--radix-tooltip-content-transform-origin); animation: teacher-introduction-in 150ms ease-out; }
|
||||
.teacher-introduction-heading { display: flex; align-items: center; gap: 11px; }
|
||||
.teacher-introduction-avatar { width: 48px; height: 48px; flex-shrink: 0; border: 2px solid #fff; border-radius: 15px; background: #e8f1fb; box-shadow: 0 3px 0 #d6e3ee; }
|
||||
.teacher-introduction-eyebrow { display: block; margin-bottom: 3px; color: #856637; font-size: 11px; font-weight: 500; }
|
||||
.teacher-introduction-name { overflow-wrap: anywhere; font-size: 15px; line-height: 1.5; font-weight: 600; }
|
||||
.teacher-introduction-sparkles { align-self: flex-start; width: 19px; height: 19px; flex-shrink: 0; color: #b9842f; }
|
||||
.teacher-introduction-description { max-height: min(240px, calc(var(--radix-tooltip-content-available-height) - 152px)); overflow-y: auto; overflow-wrap: anywhere; white-space: pre-wrap; margin-top: 16px; padding: 12px 13px; border: 1px solid #eee1c9; border-radius: 14px; background: #fffdf8; color: #48596e; font-size: 13px; line-height: 1.8; }
|
||||
.teacher-introduction-hint { margin-top: 12px; color: #776649; font-size: 11px; text-align: center; }
|
||||
.teacher-introduction-arrow { fill: #ead6af; }
|
||||
@keyframes teacher-introduction-in { from { opacity: 0; } to { opacity: 1; } }
|
||||
@media (prefers-reduced-motion: reduce) { .teacher-introduction { animation: none; } }
|
||||
.consultation-agent-tabs { display: flex; align-items: center; gap: 4px; max-width: 100%; overflow-x: auto; scrollbar-width: thin; }
|
||||
.consultation-agent-tabs .teacher-companion-person { flex-shrink: 0; }
|
||||
.teacher-companion-person { display: flex; align-items: center; gap: 6px; height: 36px; padding: 0 8px; border-radius: 8px; color: #747d6c; transition: background 150ms; }
|
||||
|
||||
Reference in new issue
Block a user