diff --git a/native/themes/colors.js b/native/themes/colors.js --- a/native/themes/colors.js +++ b/native/themes/colors.js @@ -18,11 +18,12 @@ shadesWhite70: '#e0e0e0', shadesWhite60: '#cccccc', - shadesBlack100: '#0a0a0a', - shadesBlack90: '#1f1f1f', - shadesBlack80: '#404040', - shadesBlack70: '#666666', - shadesBlack60: '#808080', + shadesBlack95: '#0a0a0a', + shadesBlack90: '#191919', + shadesBlack85: '#1f1f1f', + shadesBlack75: '#404040', + shadesBlack60: '#666666', + shadesBlack50: '#808080', violetDark100: '#7e57c2', violetDark80: '#6d49ab', @@ -56,46 +57,46 @@ blockQuoteBorder: designSystemColors.shadesWhite60, codeBackground: designSystemColors.shadesWhite70, disabledButton: designSystemColors.shadesWhite70, - disabledButtonText: designSystemColors.shadesBlack60, + disabledButtonText: designSystemColors.shadesBlack50, disconnectedBarBackground: designSystemColors.shadesWhite90, editButton: '#A4A4A2', floatingButtonBackground: '#999999', floatingButtonLabel: designSystemColors.shadesWhite80, - headerChevron: designSystemColors.shadesBlack100, + headerChevron: designSystemColors.shadesBlack95, inlineEngagementBackground: designSystemColors.shadesWhite70, - inlineEngagementLabel: designSystemColors.shadesBlack100, + inlineEngagementLabel: designSystemColors.shadesBlack95, link: designSystemColors.violetDark100, listBackground: designSystemColors.shadesWhite100, - listBackgroundLabel: designSystemColors.shadesBlack100, + listBackgroundLabel: designSystemColors.shadesBlack95, listBackgroundSecondaryLabel: '#444444', listBackgroundTernaryLabel: '#999999', listChatBubble: '#F1F0F5', - listForegroundLabel: designSystemColors.shadesBlack100, + listForegroundLabel: designSystemColors.shadesBlack95, listForegroundSecondaryLabel: '#333333', - listForegroundTertiaryLabel: designSystemColors.shadesBlack70, + listForegroundTertiaryLabel: designSystemColors.shadesBlack60, listInputBackground: designSystemColors.shadesWhite90, listInputBar: '#E2E2E2', listInputButton: '#8E8D92', listIosHighlightUnderlay: '#DDDDDDDD', listSearchBackground: designSystemColors.shadesWhite90, listSearchIcon: '#8E8D92', - listSeparatorLabel: designSystemColors.shadesBlack70, + listSeparatorLabel: designSystemColors.shadesBlack60, modalBackground: designSystemColors.shadesWhite80, modalBackgroundLabel: '#333333', modalBackgroundSecondaryLabel: '#AAAAAA', modalButton: '#BBBBBB', - modalButtonLabel: designSystemColors.shadesBlack100, - modalContrastBackground: designSystemColors.shadesBlack100, + modalButtonLabel: designSystemColors.shadesBlack95, + modalContrastBackground: designSystemColors.shadesBlack95, modalContrastForegroundLabel: designSystemColors.shadesWhite100, modalContrastOpacity: 0.7, modalForeground: designSystemColors.shadesWhite100, modalForegroundBorder: designSystemColors.shadesWhite60, - modalForegroundLabel: designSystemColors.shadesBlack100, + modalForegroundLabel: designSystemColors.shadesBlack95, modalForegroundSecondaryLabel: '#888888', modalForegroundTertiaryLabel: '#AAAAAA', modalIosHighlightUnderlay: '#CCCCCCDD', modalSubtext: designSystemColors.shadesWhite60, - modalSubtextLabel: designSystemColors.shadesBlack70, + modalSubtextLabel: designSystemColors.shadesBlack60, modalInputBackground: designSystemColors.shadesWhite60, modalInputForeground: designSystemColors.shadesWhite90, modalKnob: designSystemColors.shadesWhite90, @@ -106,18 +107,18 @@ panelButton: designSystemColors.shadesWhite70, panelForeground: designSystemColors.shadesWhite100, panelForegroundBorder: designSystemColors.shadesWhite60, - panelForegroundLabel: designSystemColors.shadesBlack100, + panelForegroundLabel: designSystemColors.shadesBlack95, panelForegroundSecondaryLabel: '#333333', panelForegroundTertiaryLabel: '#888888', panelInputBackground: designSystemColors.shadesWhite60, - panelInputSecondaryForeground: designSystemColors.shadesBlack60, + panelInputSecondaryForeground: designSystemColors.shadesBlack50, panelIosHighlightUnderlay: '#EBEBEBDD', panelSecondaryForeground: designSystemColors.shadesWhite80, panelSecondaryForegroundBorder: designSystemColors.shadesWhite70, panelSeparator: designSystemColors.shadesWhite60, purpleLink: designSystemColors.violetDark100, purpleButton: designSystemColors.violetDark100, - reactionSelectionPopoverItemBackground: designSystemColors.shadesBlack80, + reactionSelectionPopoverItemBackground: designSystemColors.shadesBlack75, redText: designSystemColors.errorPrimary, spoiler: designSystemColors.spoilerColor, tabBarAccent: designSystemColors.violetDark100, @@ -129,21 +130,21 @@ tooltipBackground: designSystemColors.shadesWhite70, logInSpacer: '#FFFFFF33', siweButton: designSystemColors.shadesWhite100, - siweButtonText: designSystemColors.shadesBlack90, - drawerExpandButton: designSystemColors.shadesBlack60, + siweButtonText: designSystemColors.shadesBlack85, + drawerExpandButton: designSystemColors.shadesBlack50, drawerExpandButtonDisabled: designSystemColors.shadesWhite60, - drawerItemLabelLevel0: designSystemColors.shadesBlack100, - drawerItemLabelLevel1: designSystemColors.shadesBlack100, - drawerItemLabelLevel2: designSystemColors.shadesBlack90, + drawerItemLabelLevel0: designSystemColors.shadesBlack95, + drawerItemLabelLevel1: designSystemColors.shadesBlack95, + drawerItemLabelLevel2: designSystemColors.shadesBlack85, drawerOpenCommunityBackground: designSystemColors.shadesWhite90, drawerBackground: designSystemColors.shadesWhite100, - subthreadsModalClose: designSystemColors.shadesBlack60, + subthreadsModalClose: designSystemColors.shadesBlack50, subthreadsModalBackground: designSystemColors.shadesWhite80, subthreadsModalSearch: '#00000008', - messageLabel: designSystemColors.shadesBlack100, + messageLabel: designSystemColors.shadesBlack95, modalSeparator: designSystemColors.shadesWhite60, secondaryButtonBorder: designSystemColors.shadesWhite100, - inviteLinkLinkColor: designSystemColors.shadesBlack100, + inviteLinkLinkColor: designSystemColors.shadesBlack95, inviteLinkButtonBackground: designSystemColors.shadesWhite60, greenIndicatorInner: designSystemColors.successPrimary, greenIndicatorOuter: designSystemColors.successDark50, @@ -154,101 +155,101 @@ const dark: Colors = Object.freeze({ blockQuoteBackground: '#A9A9A9', - blockQuoteBorder: designSystemColors.shadesBlack60, - codeBackground: designSystemColors.shadesBlack100, - disabledButton: designSystemColors.shadesBlack80, - disabledButtonText: designSystemColors.shadesBlack60, - disconnectedBarBackground: designSystemColors.shadesBlack90, - editButton: designSystemColors.shadesBlack70, - floatingButtonBackground: designSystemColors.shadesBlack70, + blockQuoteBorder: designSystemColors.shadesBlack50, + codeBackground: designSystemColors.shadesBlack95, + disabledButton: designSystemColors.shadesBlack75, + disabledButtonText: designSystemColors.shadesBlack50, + disconnectedBarBackground: designSystemColors.shadesBlack85, + editButton: designSystemColors.shadesBlack60, + floatingButtonBackground: designSystemColors.shadesBlack60, floatingButtonLabel: designSystemColors.shadesWhite100, headerChevron: designSystemColors.shadesWhite100, - inlineEngagementBackground: designSystemColors.shadesBlack70, + inlineEngagementBackground: designSystemColors.shadesBlack60, inlineEngagementLabel: designSystemColors.shadesWhite100, link: designSystemColors.violetLight100, - listBackground: designSystemColors.shadesBlack100, + listBackground: designSystemColors.shadesBlack95, listBackgroundLabel: designSystemColors.shadesWhite60, listBackgroundSecondaryLabel: '#BBBBBB', - listBackgroundTernaryLabel: designSystemColors.shadesBlack60, + listBackgroundTernaryLabel: designSystemColors.shadesBlack50, listChatBubble: '#26252A', listForegroundLabel: designSystemColors.shadesWhite100, listForegroundSecondaryLabel: designSystemColors.shadesWhite60, - listForegroundTertiaryLabel: designSystemColors.shadesBlack60, - listInputBackground: designSystemColors.shadesBlack90, - listInputBar: designSystemColors.shadesBlack70, + listForegroundTertiaryLabel: designSystemColors.shadesBlack50, + listInputBackground: designSystemColors.shadesBlack85, + listInputBar: designSystemColors.shadesBlack60, listInputButton: designSystemColors.shadesWhite60, listIosHighlightUnderlay: '#BBBBBB88', - listSearchBackground: designSystemColors.shadesBlack90, + listSearchBackground: designSystemColors.shadesBlack85, listSearchIcon: designSystemColors.shadesWhite60, listSeparatorLabel: designSystemColors.shadesWhite80, - modalBackground: designSystemColors.shadesBlack100, + modalBackground: designSystemColors.shadesBlack95, modalBackgroundLabel: designSystemColors.shadesWhite60, - modalBackgroundSecondaryLabel: designSystemColors.shadesBlack70, - modalButton: designSystemColors.shadesBlack70, + modalBackgroundSecondaryLabel: designSystemColors.shadesBlack60, + modalButton: designSystemColors.shadesBlack60, modalButtonLabel: designSystemColors.shadesWhite100, modalContrastBackground: designSystemColors.shadesWhite100, - modalContrastForegroundLabel: designSystemColors.shadesBlack100, + modalContrastForegroundLabel: designSystemColors.shadesBlack95, modalContrastOpacity: 0.85, - modalForeground: designSystemColors.shadesBlack90, - modalForegroundBorder: designSystemColors.shadesBlack90, + modalForeground: designSystemColors.shadesBlack85, + modalForegroundBorder: designSystemColors.shadesBlack85, modalForegroundLabel: designSystemColors.shadesWhite100, modalForegroundSecondaryLabel: '#AAAAAA', - modalForegroundTertiaryLabel: designSystemColors.shadesBlack70, + modalForegroundTertiaryLabel: designSystemColors.shadesBlack60, modalIosHighlightUnderlay: '#AAAAAA88', - modalSubtext: designSystemColors.shadesBlack80, + modalSubtext: designSystemColors.shadesBlack75, modalSubtextLabel: '#AAAAAA', - modalInputBackground: designSystemColors.shadesBlack80, - modalInputForeground: designSystemColors.shadesBlack60, + modalInputBackground: designSystemColors.shadesBlack75, + modalInputForeground: designSystemColors.shadesBlack50, modalKnob: designSystemColors.shadesWhite90, navigationCard: '#2A2A2A', - navigationChevron: designSystemColors.shadesBlack70, - panelBackground: designSystemColors.shadesBlack100, + navigationChevron: designSystemColors.shadesBlack60, + panelBackground: designSystemColors.shadesBlack95, panelBackgroundLabel: designSystemColors.shadesWhite60, - panelButton: designSystemColors.shadesBlack70, - panelForeground: designSystemColors.shadesBlack90, + panelButton: designSystemColors.shadesBlack60, + panelForeground: designSystemColors.shadesBlack85, panelForegroundBorder: '#2C2C2E', panelForegroundLabel: designSystemColors.shadesWhite100, panelForegroundSecondaryLabel: designSystemColors.shadesWhite60, panelForegroundTertiaryLabel: '#AAAAAA', - panelInputBackground: designSystemColors.shadesBlack80, - panelInputSecondaryForeground: designSystemColors.shadesBlack60, + panelInputBackground: designSystemColors.shadesBlack75, + panelInputSecondaryForeground: designSystemColors.shadesBlack50, panelIosHighlightUnderlay: '#313035', - panelSecondaryForeground: designSystemColors.shadesBlack80, - panelSecondaryForegroundBorder: designSystemColors.shadesBlack70, - panelSeparator: designSystemColors.shadesBlack80, + panelSecondaryForeground: designSystemColors.shadesBlack75, + panelSecondaryForegroundBorder: designSystemColors.shadesBlack60, + panelSeparator: designSystemColors.shadesBlack75, purpleLink: designSystemColors.violetLight100, purpleButton: designSystemColors.violetDark100, - reactionSelectionPopoverItemBackground: designSystemColors.shadesBlack80, + reactionSelectionPopoverItemBackground: designSystemColors.shadesBlack75, redText: designSystemColors.errorPrimary, spoiler: designSystemColors.spoilerColor, tabBarAccent: designSystemColors.violetLight100, - tabBarBackground: designSystemColors.shadesBlack100, + tabBarBackground: designSystemColors.shadesBlack95, tabBarActiveTintColor: designSystemColors.violetLight100, vibrantGreenButton: designSystemColors.successPrimary, vibrantRedButton: designSystemColors.errorPrimary, whiteText: designSystemColors.shadesWhite100, - tooltipBackground: designSystemColors.shadesBlack90, + tooltipBackground: designSystemColors.shadesBlack85, logInSpacer: '#FFFFFF33', siweButton: designSystemColors.shadesWhite100, - siweButtonText: designSystemColors.shadesBlack90, - drawerExpandButton: designSystemColors.shadesBlack60, - drawerExpandButtonDisabled: designSystemColors.shadesBlack80, + siweButtonText: designSystemColors.shadesBlack85, + drawerExpandButton: designSystemColors.shadesBlack50, + drawerExpandButtonDisabled: designSystemColors.shadesBlack75, drawerItemLabelLevel0: designSystemColors.shadesWhite60, drawerItemLabelLevel1: designSystemColors.shadesWhite60, drawerItemLabelLevel2: designSystemColors.shadesWhite90, - drawerOpenCommunityBackground: '#191919', - drawerBackground: designSystemColors.shadesBlack90, - subthreadsModalClose: designSystemColors.shadesBlack60, - subthreadsModalBackground: designSystemColors.shadesBlack90, + drawerOpenCommunityBackground: designSystemColors.shadesBlack90, + drawerBackground: designSystemColors.shadesBlack85, + subthreadsModalClose: designSystemColors.shadesBlack50, + subthreadsModalBackground: designSystemColors.shadesBlack85, subthreadsModalSearch: '#FFFFFF04', typeaheadTooltipBackground: '#1F1F1f', - typeaheadTooltipBorder: designSystemColors.shadesBlack80, + typeaheadTooltipBorder: designSystemColors.shadesBlack75, typeaheadTooltipText: 'white', messageLabel: designSystemColors.shadesWhite60, - modalSeparator: designSystemColors.shadesBlack80, + modalSeparator: designSystemColors.shadesBlack75, secondaryButtonBorder: designSystemColors.shadesWhite100, inviteLinkLinkColor: designSystemColors.shadesWhite80, - inviteLinkButtonBackground: designSystemColors.shadesBlack80, + inviteLinkButtonBackground: designSystemColors.shadesBlack75, greenIndicatorInner: designSystemColors.successPrimary, greenIndicatorOuter: designSystemColors.successDark90, redIndicatorInner: designSystemColors.errorPrimary,