Changeset View
Changeset View
Standalone View
Standalone View
native/themes/colors.js
| Show First 20 Lines • Show All 133 Lines • ▼ Show 20 Lines | const light = Object.freeze({ | ||||
| drawerOpenCommunityBackground: designSystemColors.shadesWhite90, | drawerOpenCommunityBackground: designSystemColors.shadesWhite90, | ||||
| drawerBackground: designSystemColors.shadesWhite100, | drawerBackground: designSystemColors.shadesWhite100, | ||||
| subthreadsModalClose: designSystemColors.shadesBlack60, | subthreadsModalClose: designSystemColors.shadesBlack60, | ||||
| subthreadsModalBackground: designSystemColors.shadesWhite80, | subthreadsModalBackground: designSystemColors.shadesWhite80, | ||||
| subthreadsModalSearch: '#00000008', | subthreadsModalSearch: '#00000008', | ||||
| messageLabel: designSystemColors.shadesBlack100, | messageLabel: designSystemColors.shadesBlack100, | ||||
| modalSeparator: designSystemColors.shadesWhite60, | modalSeparator: designSystemColors.shadesWhite60, | ||||
| secondaryButtonBorder: designSystemColors.shadesWhite100, | secondaryButtonBorder: designSystemColors.shadesWhite100, | ||||
| inviteLinkLinkColor: designSystemColors.shadesBlack100, | |||||
| inviteLinkButtonBackground: designSystemColors.shadesWhite60, | |||||
| }); | }); | ||||
| export type Colors = $Exact<typeof light>; | export type Colors = $Exact<typeof light>; | ||||
| const dark: Colors = Object.freeze({ | const dark: Colors = Object.freeze({ | ||||
| blockQuoteBackground: '#A9A9A9', | blockQuoteBackground: '#A9A9A9', | ||||
| blockQuoteBorder: designSystemColors.shadesBlack60, | blockQuoteBorder: designSystemColors.shadesBlack60, | ||||
| codeBackground: designSystemColors.shadesBlack100, | codeBackground: designSystemColors.shadesBlack100, | ||||
| disabledButton: designSystemColors.shadesBlack80, | disabledButton: designSystemColors.shadesBlack80, | ||||
| ▲ Show 20 Lines • Show All 79 Lines • ▼ Show 20 Lines | const dark: Colors = Object.freeze({ | ||||
| subthreadsModalBackground: designSystemColors.shadesBlack90, | subthreadsModalBackground: designSystemColors.shadesBlack90, | ||||
| subthreadsModalSearch: '#FFFFFF04', | subthreadsModalSearch: '#FFFFFF04', | ||||
| typeaheadTooltipBackground: '#1F1F1f', | typeaheadTooltipBackground: '#1F1F1f', | ||||
| typeaheadTooltipBorder: designSystemColors.shadesBlack80, | typeaheadTooltipBorder: designSystemColors.shadesBlack80, | ||||
| typeaheadTooltipText: 'white', | typeaheadTooltipText: 'white', | ||||
| messageLabel: designSystemColors.shadesWhite60, | messageLabel: designSystemColors.shadesWhite60, | ||||
| modalSeparator: designSystemColors.shadesBlack80, | modalSeparator: designSystemColors.shadesBlack80, | ||||
| secondaryButtonBorder: designSystemColors.shadesWhite100, | secondaryButtonBorder: designSystemColors.shadesWhite100, | ||||
| inviteLinkLinkColor: designSystemColors.shadesWhite80, | |||||
| inviteLinkButtonBackground: designSystemColors.shadesBlack80, | |||||
| }); | }); | ||||
| const colors = { light, dark }; | const colors = { light, dark }; | ||||
| const colorsSelector: (state: AppState) => Colors = createSelector( | const colorsSelector: (state: AppState) => Colors = createSelector( | ||||
| (state: AppState) => state.globalThemeInfo.activeTheme, | (state: AppState) => state.globalThemeInfo.activeTheme, | ||||
| (theme: ?GlobalTheme) => { | (theme: ?GlobalTheme) => { | ||||
| const explicitTheme = theme ? theme : 'light'; | const explicitTheme = theme ? theme : 'light'; | ||||
| return colors[explicitTheme]; | return colors[explicitTheme]; | ||||
| ▲ Show 20 Lines • Show All 127 Lines • Show Last 20 Lines | |||||