Add i18n to replies.

Add Fluent design category button.
Update Account page with new design.
This commit is contained in:
Paul
2021-08-04 16:03:38 +01:00
parent 8cc92e0c42
commit fe75f5a6ca
9 changed files with 229 additions and 222 deletions

View File

@@ -187,12 +187,18 @@ export const MessageReply = observer(({ index, channel, id }: Props) => {
);
}
}}>
{message.attachments && (
{message.attachments &&
message.attachments.length > 0 && (
<>
<File size={16} />
<em>{message.attachments.length > 1 ?
"Sent multiple attachments" :
"Sent an attachment"}</em>
<em>
{message.attachments.length >
0 ? (
<Text id="app.main.channel.misc.sent_multiple_files" />
) : (
<Text id="app.main.channel.misc.sent_file" />
)}
</em>
</>
)}
<Markdown

View File

@@ -32,25 +32,12 @@ const Base = styled.div`
user-select: none;
align-items: center;
background: var(--message-box);
.username {
display: flex;
align-items: center;
gap: 6px;
font-weight: 600;
}
}
> div {
flex-grow: 1;
margin-bottom: 0;
}
.actions {
gap: 12px;
display: flex;
}
.toggle {
gap: 4px;
display: flex;
@@ -59,6 +46,22 @@ const Base = styled.div`
font-weight: 600;
}
.username {
display: flex;
align-items: center;
gap: 6px;
font-weight: 600;
}
.message {
display: flex;
}
.actions {
gap: 12px;
display: flex;
}
/*@media (pointer: coarse) { //FIXME: Make action buttons bigger on pointer coarse
.actions > svg {
height: 25px;
@@ -109,14 +112,20 @@ export default observer(({ channel, replies, setReplies }: Props) => {
<UserShort user={message.author} size={16} />
</div>
<div class="message">
{message.attachments && (
<>
<File size={16} />
<em>{message.attachments.length > 1 ?
"Sent multiple attachments" :
"Sent an attachment"}</em>
</>
)}
{message.attachments &&
message.attachments.length > 0 && (
<>
<File size={16} />
<em>
{message.attachments!.length >
1 ? (
<Text id="app.main.channel.misc.sent_multiple_files" />
) : (
<Text id="app.main.channel.misc.sent_file" />
)}
</em>
</>
)}
{message.author_id === SYSTEM_USER_ID ? (
<SystemMessage message={message} />
) : (