@sky-mavis/tanto-widget
Version:
Tanto Widget
93 lines • 3.43 kB
JavaScript
const baseThemeCommonTokens = {
fontFamily: ["'Work Sans'", '-apple-system', 'BlinkMacSystemFont', "'Segoe UI'", 'Helvetica', "'Apple Color Emoji'", 'Arial', 'sans-serif', "'Segoe UI Emoji'"],
fontSize: 16,
buttonPrimaryShadow: 'none',
buttonPrimaryHoverShadow: 'none',
buttonPrimaryActiveShadow: 'none',
buttonPrimaryBorder: '0 none',
buttonSecondaryShadow: 'none',
buttonSecondaryHoverShadow: 'none',
buttonSecondaryActiveShadow: 'none',
buttonSecondaryBorder: '0 none',
buttonDisabledBorder: '0 none',
overlayBackdropFilter: 'none',
drawerBorderRadius: '20px 20px 0 0',
modalBorderRadius: 20,
modalShadow: 'none'
};
const tantoDarkTheme = {
mode: 'dark',
warningColor: '#FFC34D',
successColor: '#52E08D',
buttonPrimaryBackground: '#F1F3F9',
buttonPrimaryColor: '#15181E',
buttonPrimaryHoverBackground: '#CDD5E5',
buttonPrimaryHoverColor: '#15181E',
buttonPrimaryActiveBackground: '#F1F3F9',
buttonPrimaryActiveColor: '#15181E',
buttonSecondaryBackground: '#CDD5E512',
buttonSecondaryColor: '#F1F3F9',
buttonSecondaryHoverBackground: '#CDD5E51A',
buttonSecondaryHoverColor: '#F1F3F9',
buttonSecondaryActiveBackground: '#CDD5E526',
buttonSecondaryActiveColor: '#F1F3F9',
buttonDisabledBackground: '#CDD5E512',
buttonDisabledColor: 'rgba(205, 213, 229, 0.7)',
bodyText: '#fff',
mutedText: 'rgba(205, 213, 229, 0.75)',
overlayBackground: 'rgba(12, 12, 13, 0.6)',
modalBackground: '#15181E',
modalBorder: '1px solid #272B34',
spinnerColor: '#f1f3f9',
skeletonColor: 'rgba(205, 213, 229, 0.07)',
scrollbarTrack: '#15181E',
scrollbarThumb: '#353a45',
linkColor: '#5294F8',
dividerBorder: '1px dashed #353A45',
listItemBackground: 'rgba(205, 213, 229, 0.07)',
listItemHoverBackground: 'rgba(205, 213, 229, 0.1)',
badgeDefaultColor: '#F1F3F9',
badgeDefaultBackground: 'rgba(39, 43, 52, 0.60)',
badgeHighlightColor: '#FBB2D0',
badgeHighlightBackground: 'rgba(115, 13, 55, 0.60)',
qrcodeBackground: '#F1F3F9',
...baseThemeCommonTokens
};
const tantoLightTheme = {
mode: 'light',
warningColor: '#DB6D00',
successColor: '#05C956',
buttonPrimaryBackground: '#15181E',
buttonPrimaryColor: '#FFFFFF',
buttonPrimaryHoverBackground: '#2B2F36',
buttonPrimaryHoverColor: '#FFFFFF',
buttonPrimaryActiveBackground: '#15181E',
buttonPrimaryActiveColor: '#FFFFFF',
buttonSecondaryBackground: '#15181E12',
buttonSecondaryColor: '#15181E',
buttonSecondaryHoverBackground: '#15181E1A',
buttonSecondaryHoverColor: '#15181E',
buttonSecondaryActiveBackground: '#15181E26',
buttonSecondaryActiveColor: '#15181E',
buttonDisabledBackground: '#15181E12',
buttonDisabledColor: 'rgba(21, 24, 30, 0.4)',
bodyText: '#15181E',
mutedText: '#43464C',
overlayBackground: 'rgba(240, 240, 240, 0.6)',
modalBackground: '#F0F1F5',
modalBorder: '1px solid #D0D6E1',
spinnerColor: '#0C48C0',
skeletonColor: 'rgba(21, 24, 30, 0.07)',
scrollbarTrack: '#F0F1F5',
scrollbarThumb: '#C4C4C4',
linkColor: '#0C48C0',
dividerBorder: '1px dashed #B1BBCD',
listItemBackground: 'rgba(102, 121, 153, 0.10)',
listItemHoverBackground: 'rgba(105, 122, 150, 0.20)',
badgeDefaultColor: '#43464C',
badgeDefaultBackground: '#66799926',
badgeHighlightColor: '#FFFFFF',
badgeHighlightBackground: '#E90B6699',
qrcodeBackground: 'rgba(21, 24, 30, 0.03)',
...baseThemeCommonTokens
};export{tantoDarkTheme,tantoLightTheme};