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: