From c77e3925449fc0a6f706ee5c166f591e545f0278 Mon Sep 17 00:00:00 2001 From: Kadie Alexander Date: Fri, 12 May 2023 17:30:41 +1200 Subject: [PATCH 1/4] colour changes for reaction bubble --- src/styles/themes/default.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/styles/themes/default.js b/src/styles/themes/default.js index 0917d1d5b794..2ce80c94981b 100644 --- a/src/styles/themes/default.js +++ b/src/styles/themes/default.js @@ -15,7 +15,7 @@ const darkTheme = { iconReversed: colors.greenAppBackground, textSupporting: colors.greenSupportingText, text: colors.white, - link: colors.blueLink, + link: colors.green100, linkHover: colors.blueLinkHover, buttonDefaultBG: colors.greenDefaultButton, buttonDisabledBG: colors.greenDefaultButtonDisabled, @@ -66,7 +66,7 @@ const darkTheme = { pickerOptionsTextColor: colors.white, imageCropBackgroundColor: colors.greenIcons, fallbackIconColor: colors.green700, - reactionActive: '#003C73', + reactionActive: colors.green600, badgeAdHoc: colors.pink600, badgeAdHocHover: colors.pink700, mentionText: colors.blue100, From 234b4607c6659eea2de72e6d3f9c3727ed1f19cf Mon Sep 17 00:00:00 2001 From: Kadie Alexander Date: Mon, 15 May 2023 18:19:14 +1200 Subject: [PATCH 2/4] create new dark theme variable for emoji reaction bubble text --- src/styles/StyleUtils.js | 2 +- src/styles/themes/default.js | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/src/styles/StyleUtils.js b/src/styles/StyleUtils.js index 1b43a12b253c..f5329eae7439 100644 --- a/src/styles/StyleUtils.js +++ b/src/styles/StyleUtils.js @@ -1053,7 +1053,7 @@ function getEmojiReactionBubbleTextStyle(isContextMenu = false) { function getEmojiReactionCounterTextStyle(hasUserReacted) { if (hasUserReacted) { - return {color: themeColors.link}; + return {color: themeColors.reactionActiveText}; } return {color: themeColors.textLight}; diff --git a/src/styles/themes/default.js b/src/styles/themes/default.js index 2ce80c94981b..20ce73c22c1a 100644 --- a/src/styles/themes/default.js +++ b/src/styles/themes/default.js @@ -67,6 +67,7 @@ const darkTheme = { imageCropBackgroundColor: colors.greenIcons, fallbackIconColor: colors.green700, reactionActive: colors.green600, + reactionActiveText: colors.green100, badgeAdHoc: colors.pink600, badgeAdHocHover: colors.pink700, mentionText: colors.blue100, From bb46184fb51dfac7a09ce79d89d315f30a6895d1 Mon Sep 17 00:00:00 2001 From: Kadie Alexander Date: Mon, 15 May 2023 18:21:30 +1200 Subject: [PATCH 3/4] restore link colour to blue for other places in the app --- src/styles/themes/default.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/themes/default.js b/src/styles/themes/default.js index 20ce73c22c1a..410e26cc63e5 100644 --- a/src/styles/themes/default.js +++ b/src/styles/themes/default.js @@ -15,7 +15,7 @@ const darkTheme = { iconReversed: colors.greenAppBackground, textSupporting: colors.greenSupportingText, text: colors.white, - link: colors.green100, + link: colors.blueLink, linkHover: colors.blueLinkHover, buttonDefaultBG: colors.greenDefaultButton, buttonDisabledBG: colors.greenDefaultButtonDisabled, From 71fc92290c0fb7bf23354329dde02f20e9ba941d Mon Sep 17 00:00:00 2001 From: Kadie Alexander Date: Tue, 16 May 2023 14:28:29 +1200 Subject: [PATCH 4/4] update reactionActive to a more descriptive name --- src/styles/StyleUtils.js | 2 +- src/styles/themes/default.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/styles/StyleUtils.js b/src/styles/StyleUtils.js index f5329eae7439..38d66b53df80 100644 --- a/src/styles/StyleUtils.js +++ b/src/styles/StyleUtils.js @@ -1019,7 +1019,7 @@ function getEmojiReactionBubbleStyle(isHovered, hasUserReacted, isContextMenu = } if (hasUserReacted) { - backgroundColor = themeColors.reactionActive; + backgroundColor = themeColors.reactionActiveBackground; } if (isContextMenu) { diff --git a/src/styles/themes/default.js b/src/styles/themes/default.js index 410e26cc63e5..86a89b38e695 100644 --- a/src/styles/themes/default.js +++ b/src/styles/themes/default.js @@ -66,7 +66,7 @@ const darkTheme = { pickerOptionsTextColor: colors.white, imageCropBackgroundColor: colors.greenIcons, fallbackIconColor: colors.green700, - reactionActive: colors.green600, + reactionActiveBackground: colors.green600, reactionActiveText: colors.green100, badgeAdHoc: colors.pink600, badgeAdHocHover: colors.pink700,