2019-02-10 12:25:09 -08:00
|
|
|
// @flow
|
|
|
|
|
2019-02-08 20:59:21 -08:00
|
|
|
import { ThemeSet } from 'styled-theming';
|
|
|
|
|
2019-02-06 19:06:48 -08:00
|
|
|
type Colors = {
|
2019-02-08 20:59:21 -08:00
|
|
|
primary: ThemeSet,
|
|
|
|
secondary: ThemeSet,
|
|
|
|
sidebarBg: ThemeSet,
|
2019-02-15 18:59:05 -08:00
|
|
|
|
2019-02-17 19:56:50 -08:00
|
|
|
// Card
|
2019-02-08 20:59:21 -08:00
|
|
|
cardBackgroundColor: ThemeSet,
|
2019-02-17 19:56:50 -08:00
|
|
|
sendCardBg: ThemeSet,
|
|
|
|
sendCardBorder: ThemeSet,
|
|
|
|
|
2019-02-08 20:59:21 -08:00
|
|
|
text: ThemeSet,
|
|
|
|
activeItem: ThemeSet,
|
|
|
|
inactiveItem: ThemeSet,
|
|
|
|
background: ThemeSet,
|
2019-02-15 18:59:05 -08:00
|
|
|
|
2019-02-08 20:59:21 -08:00
|
|
|
selectButtonShadow: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
|
2019-02-08 20:59:21 -08:00
|
|
|
modalItemLabel: ThemeSet,
|
|
|
|
blackTwo: ThemeSet,
|
|
|
|
buttonBorderColor: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
|
2019-02-17 19:56:50 -08:00
|
|
|
// Dropdown
|
|
|
|
dropdownBg: ThemeSet,
|
|
|
|
dropdownHoveredBg: ThemeSet,
|
|
|
|
dropdownBorder: ThemeSet,
|
2019-02-18 10:04:41 -08:00
|
|
|
dropdownIconBorder: ThemeSet,
|
|
|
|
dropdownOpenedIconBorder: ThemeSet,
|
2019-02-17 19:56:50 -08:00
|
|
|
|
2019-02-16 19:34:12 -08:00
|
|
|
// Divider
|
2019-02-10 12:25:09 -08:00
|
|
|
divider: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
|
|
|
|
// Header
|
2019-02-10 12:25:09 -08:00
|
|
|
headerTitle: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
|
|
|
|
// Status Pill
|
2019-02-10 12:25:09 -08:00
|
|
|
statusPillBg: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
statusPillLabel: ThemeSet,
|
|
|
|
statusPillBorder: ThemeSet,
|
|
|
|
|
|
|
|
// Wallet Summary
|
2019-02-10 12:25:09 -08:00
|
|
|
walletSummaryBg: ThemeSet,
|
|
|
|
walletSummaryBorder: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
|
2019-02-18 15:40:15 -08:00
|
|
|
// Wallet Address
|
|
|
|
walletAddressBg: ThemeSet,
|
|
|
|
walletAddressBorder: ThemeSet,
|
|
|
|
walletAddressInput: ThemeSet,
|
|
|
|
walletAddressInputHovered: ThemeSet,
|
|
|
|
walletAddressTooltip: ThemeSet,
|
|
|
|
walletAddressTooltipBg: ThemeSet,
|
|
|
|
|
2019-02-16 19:34:12 -08:00
|
|
|
// Console
|
2019-02-10 12:25:09 -08:00
|
|
|
consoleBg: ThemeSet,
|
2019-02-16 19:48:10 -08:00
|
|
|
consoleBorder: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
|
|
|
|
// Buttons
|
2019-02-18 08:20:47 -08:00
|
|
|
buttonPrimaryBg: ThemeSet,
|
2019-02-10 12:25:09 -08:00
|
|
|
buttonPrimaryText: ThemeSet,
|
2019-02-18 08:20:47 -08:00
|
|
|
buttonPrimaryDisabledBg: ThemeSet,
|
|
|
|
buttonSecondaryBg: ThemeSet,
|
2019-02-10 12:25:09 -08:00
|
|
|
buttonSecondaryText: ThemeSet,
|
2019-02-18 08:20:47 -08:00
|
|
|
buttonSecondaryDisabledBg: ThemeSet,
|
|
|
|
buttonSecondaryBorder: ThemeSet,
|
|
|
|
buttonSecondaryHoveredBg: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
|
|
|
|
// QR Code
|
2019-02-15 18:59:05 -08:00
|
|
|
qrCodeWrapperBg: ThemeSet,
|
2019-02-18 10:04:41 -08:00
|
|
|
qrCodeWrapperBorder: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
|
|
|
|
// Transactions
|
|
|
|
transactionSent: ThemeSet,
|
|
|
|
transactionReceived: ThemeSet,
|
|
|
|
transactionsDate: ThemeSet,
|
|
|
|
transactionsItemHovered: ThemeSet,
|
|
|
|
|
|
|
|
// Transaction Item
|
|
|
|
transactionItemBg: ThemeSet,
|
|
|
|
transactionItemHoverBg: ThemeSet,
|
|
|
|
transactionItemAddress: ThemeSet,
|
|
|
|
transactionItemAddressHover: ThemeSet,
|
|
|
|
|
|
|
|
// Transaction Details
|
|
|
|
transactionDetailsShadow: ThemeSet,
|
|
|
|
transactionDetailsBg: ThemeSet,
|
|
|
|
transactionDetailsRowHover: ThemeSet,
|
|
|
|
transactionDetailsDivider: ThemeSet,
|
|
|
|
transactionDetailsLabel: ThemeSet,
|
|
|
|
|
|
|
|
// Input
|
|
|
|
inputBg: ThemeSet,
|
|
|
|
inputBorder: ThemeSet,
|
2019-02-18 10:04:41 -08:00
|
|
|
inputBorderActive: ThemeSet,
|
2019-02-16 19:34:12 -08:00
|
|
|
|
|
|
|
// Sidebar
|
|
|
|
sidebarBg: ThemeSet,
|
|
|
|
sidebarItem: ThemeSet,
|
|
|
|
sidebarItemActive: ThemeSet,
|
|
|
|
sidebarActiveItemBorder: ThemeSet,
|
|
|
|
sidebarBorderRight: ThemeSet,
|
|
|
|
sidebarItemHovered: ThemeSet,
|
|
|
|
sidebarHoveredItemLabel: ThemeSet,
|
|
|
|
sidebarLogoGradientBegin: ThemeSet,
|
|
|
|
sidebarLogoGradientEnd: ThemeSet,
|
|
|
|
sidebarItemHoveredBg: ThemeSet,
|
2019-02-18 07:45:34 -08:00
|
|
|
|
|
|
|
// Settings
|
|
|
|
settingsCardBg: ThemeSet,
|
|
|
|
settingsLearnMore: ThemeSet,
|
|
|
|
settingsLearnMoreHovered: ThemeSet,
|
2019-02-18 15:40:15 -08:00
|
|
|
|
|
|
|
// Loading
|
|
|
|
loadingScreenBg: ThemeSet,
|
|
|
|
loadingScreenText: ThemeSet,
|
2019-02-18 18:22:38 -08:00
|
|
|
|
|
|
|
// Misc
|
|
|
|
sendAdditionalOptionsBg: ThemeSet,
|
|
|
|
sendAdditionalOptionsBorder: ThemeSet,
|
|
|
|
sendAdditionalInputBg: ThemeSet,
|
|
|
|
sendAdditionalInputText: ThemeSet,
|
2019-02-06 19:06:48 -08:00
|
|
|
};
|
|
|
|
|
|
|
|
type FontSize = {
|
|
|
|
large: number,
|
|
|
|
medium: number,
|
|
|
|
regular: number,
|
|
|
|
small: number,
|
|
|
|
};
|
|
|
|
|
|
|
|
type FontWeight = {
|
|
|
|
bold: number,
|
|
|
|
default: number,
|
|
|
|
light: number,
|
|
|
|
};
|
|
|
|
|
|
|
|
type AppTheme = {
|
2019-02-10 12:25:09 -08:00
|
|
|
// General
|
2019-02-06 19:06:48 -08:00
|
|
|
mode: string,
|
2019-02-10 12:25:09 -08:00
|
|
|
|
|
|
|
// Typography
|
2019-02-06 19:06:48 -08:00
|
|
|
fontFamily: string,
|
|
|
|
fontWeight: FontWeight,
|
|
|
|
fontSize: FontSize,
|
2019-02-10 12:25:09 -08:00
|
|
|
|
|
|
|
// Colors
|
2019-02-06 19:06:48 -08:00
|
|
|
colors: Colors,
|
2019-02-10 12:25:09 -08:00
|
|
|
|
|
|
|
// Spacing
|
2019-02-06 19:06:48 -08:00
|
|
|
sidebarWidth: string,
|
|
|
|
headerHeight: string,
|
|
|
|
layoutPaddingLeft: string,
|
|
|
|
layoutPaddingRight: string,
|
|
|
|
layoutContentPaddingTop: string,
|
|
|
|
boxBorderRadius: string,
|
2019-02-10 12:25:09 -08:00
|
|
|
|
|
|
|
// Misc
|
2019-02-06 19:06:48 -08:00
|
|
|
transitionEase: string,
|
|
|
|
};
|
|
|
|
|
2019-02-07 08:31:59 -08:00
|
|
|
declare type PropsWithTheme<T = {}> = {
|
|
|
|
...T,
|
|
|
|
theme: AppTheme,
|
|
|
|
};
|