export const lightTheme = { colors: { background: '', black: '', black40: '', black70: '', button: '', buttonHover: '', dateButton: '', dateFilter: '', error: '', inputs: '', loader: '', primary: '', secondary: '', shadow: '', white: '', white50: '', white70: '', }, name: 'light' as Name, } export const defaultTheme: CustomTheme = { colors: { background: ` radial-gradient( 49.07% 49.07% at 50% 29.54%, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0) 100% ), rgba(0, 0, 0, 0.9)`, black: '#000000', black40: 'rgba(0, 0, 0, 0.4)', black70: 'rgba(0, 0, 0, 0.7)', button: '#294FC3', buttonHover: '#3255be', dateButton: 'rgba(255, 255, 255, 0.5)', dateFilter: '#656565', error: 'rgba(235, 87, 87, 1)', inputs: '#3F3F3F', loader: '#FFFFFF', primary: ` linear-gradient( 180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 0.01%, rgba(0, 0, 0, 0.1) 99.99% ), #0033CC `, secondary: '#999999', shadow: '0px 1px 1px rgba(0, 0, 0, 0.3)', white: '#FFFFFF', white50: 'rgba(255, 255, 255, 0.5)', white70: 'rgba(255, 255, 255, 0.7)', }, name: 'dark' as Name, } export const lffTheme: CustomTheme = { ...defaultTheme, colors: { ...defaultTheme.colors, background: '#1D1D1D', button: '#A30C2F', buttonHover: '#DB1C49', dateButton: defaultTheme.colors.white, dateFilter: defaultTheme.colors.white50, inputs: 'transparent', }, name: 'lff', } export const facrTheme: CustomTheme = { ...defaultTheme, colors: { ...defaultTheme.colors, button: '#00257A', inputs: 'transparent', }, name: 'facr', } export const tunisTheme: CustomTheme = { ...defaultTheme, colors: { ...defaultTheme.colors, background: '#1D1D1D', button: '#0E8F84', dateFilter: '#ffffff80', inputs: '#3A4849', }, name: 'tunis', } type Name = 'light' | 'dark' | 'lff' | 'facr' | 'tunis' export type CustomTheme = typeof lightTheme