fix(odin): brand mark as bubble avatar + aligned thinking indicator
Assistant bubbles use the animated OdinMark instead of the plain 'O' circle; the 'Pracuji…' row drops its horizontal padding and matches the 28px mark size, so the thinking mark sits exactly in the avatar column. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
@@ -30,29 +30,6 @@ interface OdinThreadProps {
|
||||
threadRef: React.RefObject<HTMLDivElement | null>;
|
||||
}
|
||||
|
||||
/** Small Odin avatar shown to the left of assistant bubbles. */
|
||||
function OdinAvatar({ size = 28 }: { size?: number }) {
|
||||
return (
|
||||
<Box
|
||||
sx={{
|
||||
width: size,
|
||||
height: size,
|
||||
borderRadius: "50%",
|
||||
bgcolor: "primary.main",
|
||||
color: "common.white",
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
fontWeight: 700,
|
||||
fontSize: size * 0.5,
|
||||
flexShrink: 0,
|
||||
}}
|
||||
>
|
||||
O
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default function OdinThread({
|
||||
turns,
|
||||
busy,
|
||||
@@ -188,7 +165,7 @@ export default function OdinThread({
|
||||
maxWidth: "80%",
|
||||
}}
|
||||
>
|
||||
{!isUser && <OdinAvatar size={28} />}
|
||||
{!isUser && <OdinMark size={28} />}
|
||||
<Box
|
||||
sx={{
|
||||
px: 1.5,
|
||||
@@ -241,7 +218,8 @@ export default function OdinThread({
|
||||
);
|
||||
})}
|
||||
|
||||
{/* Busy indicator */}
|
||||
{/* Busy indicator — same 28px mark and zero row padding as the bubble
|
||||
rows, so the thinking mark sits exactly in the avatar column. */}
|
||||
{busy && (
|
||||
<Box
|
||||
sx={{
|
||||
@@ -249,12 +227,11 @@ export default function OdinThread({
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
gap: 1,
|
||||
px: 1.5,
|
||||
py: 1,
|
||||
color: "text.secondary",
|
||||
}}
|
||||
>
|
||||
<OdinMark size={22} state="thinking" />
|
||||
<OdinMark size={28} state="thinking" />
|
||||
<Typography variant="caption" sx={{ color: "inherit" }}>
|
||||
Pracuji…
|
||||
</Typography>
|
||||
|
||||
Reference in New Issue
Block a user