diff --git a/src/app/molecules/message/Message.jsx b/src/app/molecules/message/Message.jsx index 1e169bd..6b332c6 100644 --- a/src/app/molecules/message/Message.jsx +++ b/src/app/molecules/message/Message.jsx @@ -72,6 +72,7 @@ function MessageHeader({
{name} + {userId}
{time} diff --git a/src/app/molecules/message/Message.scss b/src/app/molecules/message/Message.scss index 73484cf..2ee04c6 100644 --- a/src/app/molecules/message/Message.scss +++ b/src/app/molecules/message/Message.scss @@ -104,7 +104,6 @@ align-items: baseline; & .message__profile { - flex: 1; min-width: 0; color: var(--tc-surface-high); margin-right: var(--sp-tight); @@ -121,10 +120,19 @@ white-space: nowrap; text-overflow: ellipsis; } + & > .text:last-child { display: none; } + &:hover { + & > .text:first-child { display: none; } + & > .text:last-child { display: block; } + } } & .message__time { + flex: 1; + display: flex; + justify-content: flex-end; & > .text { + white-space: nowrap; color: var(--tc-surface-low); } }