diff --git a/web/src/index.css b/web/src/index.css index b095ed8..807114e 100644 --- a/web/src/index.css +++ b/web/src/index.css @@ -27,7 +27,7 @@ --button-hover-color: rgba(0, 0, 0, .2); --light-hover-color: rgba(0, 0, 0, .1); - --composer-background-color: #eeeeee; + --composer-background-color: #f0f0f0; --timeline-hover-bg-color: #eee; --timeline-highlight-bg-color: rgba(255, 255, 0, .1); @@ -44,7 +44,7 @@ --room-list-entry-selected-color: rgba(0, 0, 0, 0.125); --dimmed-overlay-background-color: rgba(0, 0, 0, .75); - --modal-box-shadow-color: rgba(0, 0, 0, 0.15); + --modal-box-shadow-color: rgba(0, 0, 0, 0.1); --emoji-selected-border-color: #cec; diff --git a/web/src/ui/composer/MessageComposer.css b/web/src/ui/composer/MessageComposer.css index 7805c21..9e3f26c 100644 --- a/web/src/ui/composer/MessageComposer.css +++ b/web/src/ui/composer/MessageComposer.css @@ -43,7 +43,7 @@ div.message-composer { > div.composer-media, > div.composer-location { display: flex; - padding: .5rem; + padding: .5rem .5rem 0; justify-content: space-between; > button { diff --git a/web/src/ui/composer/TypingNotifications.css b/web/src/ui/composer/TypingNotifications.css index c8af016..fca9c07 100644 --- a/web/src/ui/composer/TypingNotifications.css +++ b/web/src/ui/composer/TypingNotifications.css @@ -1,6 +1,6 @@ div.typing-notifications { grid-area: typing; - height: 1.6rem; + height: 1.5rem; margin: 0 var(--timeline-horizontal-padding); display: flex; gap: 0.5rem; diff --git a/web/src/ui/composer/TypingNotifications.tsx b/web/src/ui/composer/TypingNotifications.tsx index e901ad6..545b3a9 100644 --- a/web/src/ui/composer/TypingNotifications.tsx +++ b/web/src/ui/composer/TypingNotifications.tsx @@ -30,7 +30,7 @@ const TypingNotifications = () => { const typing = useRoomTyping(room).filter(u => u !== client.userID) let loader: JSX.Element | null = null if (typing.length > 0) { - loader = + loader = } const avatars: JSX.Element[] = [] const memberNames: string[] = [] diff --git a/web/src/ui/timeline/ReplyBody.css b/web/src/ui/timeline/ReplyBody.css index 8dcea96..de3b617 100644 --- a/web/src/ui/timeline/ReplyBody.css +++ b/web/src/ui/timeline/ReplyBody.css @@ -22,6 +22,10 @@ blockquote.reply-body { } } + &.composer { + margin: .5rem .5rem 0; + } + &:hover, &.composer { > div.message-text { color: var(--text-color); diff --git a/web/src/ui/timeline/TimelineEvent.css b/web/src/ui/timeline/TimelineEvent.css index f97c2c7..64afb5f 100644 --- a/web/src/ui/timeline/TimelineEvent.css +++ b/web/src/ui/timeline/TimelineEvent.css @@ -1,6 +1,7 @@ div.timeline-event { - width: calc(100% - 2 * var(--timeline-horizontal-padding)); - max-width: calc(100% - 2 * var(--timeline-horizontal-padding)); + width: 100%; + max-width: 100%; + box-sizing: border-box; padding: 0 var(--timeline-horizontal-padding); display: grid; grid-template: