oxen-io/session-desktop
1
0
Fork 0
mirror of https://github.com/oxen-io/session-desktop.git synced 2023-12-14 02:12:57 +01:00
Code Issues Projects Releases Wiki Activity

fix: improved theme colors for file dropzone

Browse source
This commit is contained in:
William Grant 2022-11-10 16:19:09 +11:00
parent 40f86116d6
commit 31f786aecd
6 changed files with 23 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
ts/components/conversation/SessionFileDropzone.tsx
View file

@ -12,8 +12,8 @@ const DropZoneContainer = styled.div`
`;
const DropZoneWithBorder = styled.div`
border: dashed 4px var(--primary-color);
background-color: var(--message-link-preview-background-color);
border: dashed 4px var(--file-dropzone-border-color);
background-color: var(--file-dropzone-background-color);
position: absolute;
top: 0;
bottom: 0;
@ -29,7 +29,11 @@ export const SessionFileDropzone = () => {
<DropZoneContainer>
<DropZoneWithBorder>
<Flex container={true} justifyContent="space-around" height="100%" alignItems="center">
<SessionIcon iconColor="var(--primary-color)" iconSize={'max'} iconType="circlePlus" />
<SessionIcon
iconColor="var(--file-dropzone-border-color)"
iconSize={'max'}
iconType="circlePlus"
/>
</Flex>
</DropZoneWithBorder>
</DropZoneContainer>

3
ts/themes/classicDark.ts
View file

@ -153,4 +153,7 @@ export const classicDark: ThemeColorVariables = {
'--call-buttons-icon-disabled-color': 'var(--text-primary-color)',
'--call-buttons-dropdown-color': 'var(--text-primary-color)',
'--call-buttons-dropdown-shadow': '0 0 4px 0 var(grey-color)',
'--file-dropzone-background-color': 'var(--message-link-preview-background-color)',
'--file-dropzone-border-color': 'var(--primary-color)',
};

3
ts/themes/classicLight.ts
View file

@ -153,4 +153,7 @@ export const classicLight: ThemeColorVariables = {
'--call-buttons-icon-disabled-color': 'var(--disabled-color)',
'--call-buttons-dropdown-color': 'var(--text-primary-color)',
'--call-buttons-dropdown-shadow': '0 0 4px 0 var(grey-color)',
'--file-dropzone-background-color': 'var(--message-link-preview-background-color)',
'--file-dropzone-border-color': 'var(--text-primary-color)',
};

3
ts/themes/oceanDark.ts
View file

@ -154,4 +154,7 @@ export const oceanDark: ThemeColorVariables = {
'--call-buttons-icon-disabled-color': THEMES.OCEAN_DARK.COLOR7!,
'--call-buttons-dropdown-color': 'var(--text-primary-color)',
'--call-buttons-dropdown-shadow': '0 0 4px 0 var(grey-color)',
'--file-dropzone-background-color': 'var(--message-link-preview-background-color)',
'--file-dropzone-border-color': 'var(--primary-color)',
};

3
ts/themes/oceanLight.ts
View file

@ -154,4 +154,7 @@ export const oceanLight: ThemeColorVariables = {
'--call-buttons-icon-disabled-color': 'var(--disabled-color)',
'--call-buttons-dropdown-color': 'var(--text-primary-color)',
'--call-buttons-dropdown-shadow': '0 0 4px 0 var(grey-color)',
'--file-dropzone-background-color': 'var(--message-link-preview-background-color)',
'--file-dropzone-border-color': 'var(--text-primary-color)',
};

4
ts/themes/variableColors.tsx
View file

@ -189,6 +189,10 @@ export type ThemeColorVariables = {
'--call-buttons-icon-disabled-color': string;
'--call-buttons-dropdown-color': string;
'--call-buttons-dropdown-shadow': string;
/* File Dropzone */
'--file-dropzone-background-color': string;
'--file-dropzone-border-color': string;
};
export function loadThemeColors(variables: ThemeColorVariables) {