feat: finished styling convesation category

including block list, added quick link to github release
pull/2521/head
William Grant 3 years ago
parent 27e19f3afa
commit 59f82a165b

@ -18,20 +18,28 @@ const BlockedEntriesContainer = styled.div`
overflow: auto; overflow: auto;
min-height: 40px; min-height: 40px;
max-height: 100%; max-height: 100%;
background: var(--color-input-background); // TODO theming update
`; `;
const BlockedEntriesRoundedContainer = styled.div` const BlockedEntriesRoundedContainer = styled.div`
overflow: hidden; overflow: hidden;
background: var(--background-secondary-color);
border: 1px solid var(--border-color);
border-radius: 16px; border-radius: 16px;
padding: var(--margins-lg); padding: var(--margins-lg);
background: var(--color-input-background); // TODO theming update margin: 0 var(--margins-lg);
`; `;
const BlockedContactsSection = styled.div` const BlockedContactsSection = styled.div`
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: 0; min-height: 0;
background: var(--settings-tab-background-color);
color: var(--settings-tab-text-color);
border-top: 1px solid var(--border-color);
border-bottom: 1px solid var(--border-color);
margin-bottom: var(--margins-lg);
`; `;
const BlockedContactListTitle = styled.div` const BlockedContactListTitle = styled.div`
@ -50,10 +58,6 @@ export const StyledBlockedSettingItem = styled.div<{ clickable: boolean }>`
font-size: var(--font-size-md); font-size: var(--font-size-md);
padding: var(--margins-lg); padding: var(--margins-lg);
background: var(--color-cell-background);
color: var(--color-text);
border-bottom: var(--border-session);
cursor: ${props => (props.clickable ? 'pointer' : 'unset')}; cursor: ${props => (props.clickable ? 'pointer' : 'unset')};
`; `;
@ -143,18 +147,20 @@ export const BlockedContactsList = () => {
iconRotation={expanded ? 0 : 180} iconRotation={expanded ? 0 : 180}
dataTestId="reveal-blocked-user-settings" dataTestId="reveal-blocked-user-settings"
/> />
<SpacerLG />
</BlockedContactListTitleButtons> </BlockedContactListTitleButtons>
)} )}
</BlockedContactListTitle> </BlockedContactListTitle>
</StyledBlockedSettingItem> </StyledBlockedSettingItem>
{expanded && !noBlockedNumbers ? ( {expanded && !noBlockedNumbers ? (
<>
<BlockedEntries <BlockedEntries
blockedNumbers={blockedNumbers} blockedNumbers={blockedNumbers}
selectedIds={selectedIds} selectedIds={selectedIds}
addToSelected={addToSelected} addToSelected={addToSelected}
removeFromSelected={removeFromSelected} removeFromSelected={removeFromSelected}
/> />
<SpacerLG />
</>
) : null} ) : null}
</BlockedContactsSection> </BlockedContactsSection>
); );

@ -61,21 +61,33 @@ const StyledSpanSessionInfo = styled.span`
opacity: 0.4; opacity: 0.4;
transition: var(--default-duration); transition: var(--default-duration);
user-select: text; user-select: text;
cursor: pointer;
:hover { &:hover {
opacity: 1; opacity: 1;
} }
`; `;
const SessionInfo = () => { const SessionInfo = () => {
const openOxenWebsite = () => {
void shell.openExternal('https://oxen.io/');
};
return ( return (
<StyledVersionInfo> <StyledVersionInfo>
<StyledSpanSessionInfo>v{window.versionInfo.version}</StyledSpanSessionInfo> <StyledSpanSessionInfo
onClick={() => {
void shell.openExternal(
`https://github.com/oxen-io/session-desktop/releases/tag/v${window.versionInfo.version}`
);
}}
>
v{window.versionInfo.version}
</StyledSpanSessionInfo>
<StyledSpanSessionInfo> <StyledSpanSessionInfo>
<SessionIconButton iconSize="medium" iconType="oxen" onClick={openOxenWebsite} /> <SessionIconButton
iconSize="medium"
iconType="oxen"
onClick={() => {
void shell.openExternal('https://oxen.io/');
}}
/>
</StyledSpanSessionInfo> </StyledSpanSessionInfo>
<StyledSpanSessionInfo>{window.versionInfo.commitHash}</StyledSpanSessionInfo> <StyledSpanSessionInfo>{window.versionInfo.commitHash}</StyledSpanSessionInfo>
</StyledVersionInfo> </StyledVersionInfo>

Loading…
Cancel
Save