diff --git a/stylesheets/_session.scss b/stylesheets/_session.scss index 4b0a90003..bad48f138 100644 --- a/stylesheets/_session.scss +++ b/stylesheets/_session.scss @@ -640,17 +640,6 @@ input { } } -.messages-container { - .session-icon-button { - display: flex; - justify-content: center; - align-items: center; - height: 40px; - width: 40px; - border-radius: 50%; - } -} - .group-member-list { &__selection { height: 100%; diff --git a/stylesheets/_session_conversation.scss b/stylesheets/_session_conversation.scss index e0f75ef78..73210d8ee 100644 --- a/stylesheets/_session_conversation.scss +++ b/stylesheets/_session_conversation.scss @@ -144,17 +144,6 @@ } } -.messages-container { - display: flex; - flex-grow: 1; - flex-direction: column-reverse; - position: relative; - overflow-x: hidden; - min-width: 370px; - scrollbar-width: 4px; - padding: var(--margins-sm) var(--margins-lg) var(--margins-lg); -} - .composition-container { display: flex; justify-content: center; diff --git a/ts/components/SplitViewContainer.tsx b/ts/components/SplitViewContainer.tsx index 2e9df22b6..b45b2651b 100644 --- a/ts/components/SplitViewContainer.tsx +++ b/ts/components/SplitViewContainer.tsx @@ -17,7 +17,7 @@ const Divider = styled.div` width: 100%; cursor: row-resize; height: 5px; - background-color: var(--color-cell-background); + background-color: var(--background-primary-color); margin-top: 2px; `; @@ -25,7 +25,7 @@ const DividerHandle = styled.div` width: 10%; height: 5px; cursor: row-resize; - background-color: var(--color-text); + background-color: var(--text-primary-color); flex-shrink: 0; position: relative; left: 50%; diff --git a/ts/components/conversation/ConversationRequestButtons.tsx b/ts/components/conversation/ConversationRequestButtons.tsx index fe9ed7bba..27425c374 100644 --- a/ts/components/conversation/ConversationRequestButtons.tsx +++ b/ts/components/conversation/ConversationRequestButtons.tsx @@ -24,6 +24,21 @@ const handleAcceptConversationRequest = async (convoId: string) => { await approveConvoAndSendResponse(convoId, true); }; +const ConversationRequestBanner = styled.div` + display: flex; + flex-direction: column; + justify-content: center; + padding: var(--margins-lg); + gap: var(--margins-lg); +`; + +const ConversationBannerRow = styled.div` + display: flex; + flex-direction: row; + gap: var(--margins-lg); + justify-content: center; +`; + export const ConversationMessageRequestButtons = () => { const selectedConversation = useSelector(getSelectedConversation); @@ -61,18 +76,3 @@ export const ConversationMessageRequestButtons = () => { ); }; - -const ConversationBannerRow = styled.div` - display: flex; - flex-direction: row; - gap: var(--margins-lg); - justify-content: center; -`; - -const ConversationRequestBanner = styled.div` - display: flex; - flex-direction: column; - justify-content: center; - padding: var(--margins-lg); - gap: var(--margins-lg); -`; diff --git a/ts/components/conversation/ConversationRequestInfo.tsx b/ts/components/conversation/ConversationRequestInfo.tsx index 1b20f6c97..fb9ad94e1 100644 --- a/ts/components/conversation/ConversationRequestInfo.tsx +++ b/ts/components/conversation/ConversationRequestInfo.tsx @@ -7,6 +7,20 @@ import { hasSelectedConversationIncomingMessages, } from '../../state/selectors/conversations'; +const ConversationRequestTextBottom = styled.div` + display: flex; + flex-direction: row; + justify-content: center; + padding: var(--margins-lg); +`; + +// TODO Theming - Confirm this is correct? +const ConversationRequestTextInner = styled.div` + color: var(--text-secondary-color); + text-align: center; + max-width: 390px; +`; + export const ConversationRequestinfo = () => { const selectedConversation = useSelector(getSelectedConversation); const isIncomingMessageRequest = useIsRequest(selectedConversation?.id); @@ -26,16 +40,3 @@ export const ConversationRequestinfo = () => { ); }; - -const ConversationRequestTextBottom = styled.div` - display: flex; - flex-direction: row; - justify-content: center; - padding: var(--margins-lg); -`; - -const ConversationRequestTextInner = styled.div` - color: var(--color-text-subtle); - text-align: center; - max-width: 390px; -`; diff --git a/ts/components/conversation/SessionFileDropzone.tsx b/ts/components/conversation/SessionFileDropzone.tsx index fb3f6dcbc..108ca7735 100644 --- a/ts/components/conversation/SessionFileDropzone.tsx +++ b/ts/components/conversation/SessionFileDropzone.tsx @@ -12,8 +12,8 @@ const DropZoneContainer = styled.div` `; const DropZoneWithBorder = styled.div` - border: dashed 4px var(--color-accent); - background-color: var(--color-clickable-hovered); + border: dashed 4px var(--primary-color); + background-color: var(--message-link-preview-background-color); position: absolute; top: 0; bottom: 0; @@ -29,7 +29,7 @@ export const SessionFileDropzone = () => { - + diff --git a/ts/themes/SessionTheme.tsx b/ts/themes/SessionTheme.tsx index 772664f31..8f0f489aa 100644 --- a/ts/themes/SessionTheme.tsx +++ b/ts/themes/SessionTheme.tsx @@ -648,6 +648,7 @@ export const SessionGlobalStyles = createGlobalStyle` /* Also used for Images */ /* Also used for the Media Grid Items */ /* Also used for Staged Generic Attachments */ + /* Also used for FileDropZone */ /* Same for all Themes */ --message-link-preview-background-color: rgba(${hexColorToRGB(COLORS.BLACK)}, 0.06); };