diff --git a/web/chat/chat-message-list-container.css b/web/chat/chat-message-list-container.css --- a/web/chat/chat-message-list-container.css +++ b/web/chat/chat-message-list-container.css @@ -1,12 +1,9 @@ div.container { - margin-left: 400px; - height: 100%; + flex: 1; background-color: var(--bg); display: flex; flex-direction: column; - box-sizing: border-box; } div.activeContainer { - border: 2px solid #5989d6; - margin-left: 402px; + border: 2px solid var(--chat-message-list-active-border); } diff --git a/web/chat/chat-tabs.css b/web/chat/chat-tabs.css --- a/web/chat/chat-tabs.css +++ b/web/chat/chat-tabs.css @@ -1,8 +1,5 @@ div.container { - position: absolute; width: 400px; - top: 0; - bottom: 0; background-color: var(--bg); border-right: 1px solid var(--border-color); display: flex; diff --git a/web/style.css b/web/style.css --- a/web/style.css +++ b/web/style.css @@ -89,9 +89,11 @@ div.main-content-container { position: relative; grid-area: app; + display: flex; } div.main-content { - height: 100%; + display: flex; + flex: 1; } div.upper-right { diff --git a/web/theme.css b/web/theme.css --- a/web/theme.css +++ b/web/theme.css @@ -173,4 +173,5 @@ --thread-creation-close-search-color: var(--shades-black-60); --thread-creation-search-item-bg-hover: var(--shades-black-80); --thread-creation-search-item-info-color: var(--shades-black-60); + --chat-message-list-active-border: #5989d6; }