From 1f7e95680124aa0a578f5169aa6487d2ca28a89b Mon Sep 17 00:00:00 2001 From: William Grant Date: Tue, 11 Oct 2022 16:06:00 +1100 Subject: [PATCH] fix: made --message-link-preview-background-color global --- ts/themes/classicDark.ts | 2 -- ts/themes/classicLight.ts | 2 -- ts/themes/globals.tsx | 10 ++++++++++ ts/themes/oceanDark.ts | 2 -- ts/themes/oceanLight.ts | 2 -- ts/themes/variableColors.tsx | 19 ------------------- 6 files changed, 10 insertions(+), 27 deletions(-) diff --git a/ts/themes/classicDark.ts b/ts/themes/classicDark.ts index 041182857..ac386661b 100644 --- a/ts/themes/classicDark.ts +++ b/ts/themes/classicDark.ts @@ -130,8 +130,6 @@ const classicDark: ThemeColorVariables = { '--context-menu-text-color': 'var(--text-primary-color)', '--context-menu-text-hover-color': 'var(--black-color)', - '--message-link-preview-background-color': `rgba(${hexColorToRGB(COLORS.BLACK)}, 0.06)`, - '--suggestions-background-color': THEMES.CLASSIC_DARK.COLOR2, '--suggestions-background-hover-color': THEMES.CLASSIC_DARK.COLOR3, '--suggestions-text-color': 'var(--text-primary-color)', diff --git a/ts/themes/classicLight.ts b/ts/themes/classicLight.ts index 17999f57e..8234ff952 100644 --- a/ts/themes/classicLight.ts +++ b/ts/themes/classicLight.ts @@ -130,8 +130,6 @@ const classicLight: ThemeColorVariables = { '--context-menu-text-color': 'var(--text-primary-color)', '--context-menu-text-hover-color': 'var(--black-color)', - '--message-link-preview-background-color': `rgba(${hexColorToRGB(COLORS.BLACK)}, 0.06)`, - '--suggestions-background-color': 'var(--background-secondary-color)', '--suggestions-background-hover-color': THEMES.CLASSIC_LIGHT.COLOR4, '--suggestions-text-color': 'var(--text-primary-color)', diff --git a/ts/themes/globals.tsx b/ts/themes/globals.tsx index defb0768e..623e5930e 100644 --- a/ts/themes/globals.tsx +++ b/ts/themes/globals.tsx @@ -72,6 +72,14 @@ export type ThemeGlobals = { /* Avatar Border */ '--avatar-border-color': string; + + /* Message Link Preview */ + /* Also used for Images */ + /* Also used for the Media Grid Items */ + /* Also used for Staged Generic Attachments */ + /* Also used for FileDropZone */ + /* Used for Quote References Not Found */ + '--message-link-preview-background-color': string; }; // These are only set once in the global style (at root). @@ -133,6 +141,8 @@ export const THEME_GLOBALS: ThemeGlobals = { '--lightbox-icon-stroke-color': 'var(--white-color)', '--avatar-border-color': `rgba(${hexColorToRGB(COLORS.BLACK)}, 0.59)`, + + '--message-link-preview-background-color': `rgba(${hexColorToRGB(COLORS.BLACK)}, 0.06)`, }; // These should only be needed for the global style (at root). diff --git a/ts/themes/oceanDark.ts b/ts/themes/oceanDark.ts index a4202cb33..ecfba9bd4 100644 --- a/ts/themes/oceanDark.ts +++ b/ts/themes/oceanDark.ts @@ -130,8 +130,6 @@ const oceanDark: ThemeColorVariables = { '--context-menu-text-color': 'var(--text-primary-color)', '--context-menu-text-hover-color': 'var(--black-color)', - '--message-link-preview-background-color': `rgba(${hexColorToRGB(COLORS.BLACK)}, 0.06)`, - '--suggestions-background-color': 'var(--background-secondary-color)', '--suggestions-background-hover-color': THEMES.OCEAN_DARK.COLOR4, '--suggestions-text-color': 'var(--text-primary-color)', diff --git a/ts/themes/oceanLight.ts b/ts/themes/oceanLight.ts index bc754a13a..a5d2f6fe8 100644 --- a/ts/themes/oceanLight.ts +++ b/ts/themes/oceanLight.ts @@ -130,8 +130,6 @@ const oceanLight: ThemeColorVariables = { '--context-menu-text-color': 'var(--text-primary-color)', '--context-menu-text-hover-color': 'var(--black-color)', - '--message-link-preview-background-color': `rgba(${hexColorToRGB(COLORS.BLACK)}, 0.06)`, - '--suggestions-background-color': 'var(--background-secondary-color)', '--suggestions-background-hover-color': THEMES.OCEAN_LIGHT.COLOR4, '--suggestions-text-color': 'var(--text-primary-color)', diff --git a/ts/themes/variableColors.tsx b/ts/themes/variableColors.tsx index 6d1dabdc0..085dbb998 100644 --- a/ts/themes/variableColors.tsx +++ b/ts/themes/variableColors.tsx @@ -31,7 +31,6 @@ export type ThemeColorVariables = { /* Menu Button */ '--menu-button-background-color': string; '--menu-button-background-hover-color': string; - /* TODO Theming Make a icon fill varible that uses the background color? */ '--menu-button-icon-color': string; /* Chat (Interaction) Buttons */ @@ -48,20 +47,17 @@ export type ThemeColorVariables = { '--settings-tab-background-selected-color': string; '--settings-tab-text-color': string; - /* TODO Theming probably consolidate this */ /* Buttons */ /* Outline (Default) */ '--button-outline-background-color': string; '--button-outline-background-hover-color': string; '--button-outline-text-color': string; - /* TODO Theming we might not need this */ '--button-outline-text-hover-color': string; '--button-outline-border-color': string; '--button-outline-border-hover-color': string; '--button-outline-disabled-color': string; /* Solid */ - /* TODO Theming - Should Pills have their own colors */ /* Also used for Pills */ '--button-solid-background-color': string; '--button-solid-background-hover-color': string; @@ -69,7 +65,6 @@ export type ThemeColorVariables = { '--button-solid-text-hover-color': string; /* Solid buttons stay the same and rely on the disabled pointer */ '--button-solid-disabled-color': string; - /* TODO Theming - Only light themes have shadows? */ '--button-solid-shadow-color': string; /* Simple */ @@ -116,18 +111,15 @@ export type ThemeColorVariables = { /* Toggle Switch */ '--toggle-switch-ball-color': string; '--toggle-switch-ball-shadow-color': string; - /* TODO Theming think this should be white instead of transparent */ '--toggle-switch-off-background-color': string; '--toggle-switch-off-border-color': string; '--toggle-switch-on-background-color': string; '--toggle-switch-on-border-color': string; - /* TODO Theming Think this is part of the Convesations Tab */ /* Unread Messages Alert */ '--unread-messages-alert-background-color': string; '--unread-messages-alert-text-color': string; - /* toggles between the Light and Dark mode for a Theme */ /* Color Mode Button */ '--button-color-mode-stroke-color': string; '--button-color-mode-hover-color': string; @@ -139,8 +131,6 @@ export type ThemeColorVariables = { '--emoji-reaction-bar-icon-background-color': string; '--emoji-reaction-bar-icon-color': string; - /* TODO Theming - Should Pills have their own colors? */ - /* Modals */ '--modal-background-content-color': string; '--modal-text-color': string; @@ -170,15 +160,6 @@ export type ThemeColorVariables = { '--context-menu-text-color': string; '--context-menu-text-hover-color': string; - /* Message Link Preview */ - /* Also used for Images */ - /* Also used for the Media Grid Items */ - /* Also used for Staged Generic Attachments */ - /* Also used for FileDropZone */ - /* Used for Quote References Not Found */ - /* Same for all Themes */ - '--message-link-preview-background-color': string; - /* Suggestions i.e. Mentions and Emojis */ '--suggestions-background-color': string; '--suggestions-background-hover-color': string;