main-site/components/themes.tsx

76 lines
1.6 KiB
TypeScript

// Probably a good idea to spread this out into multiple files under a folder once it gets bigger
import { createGlobalStyle, DefaultTheme } from 'styled-components'
// TODO: unsure whether needed
/* const GlobalStyle = createGlobalStyle`
html,
body {
color: ${({ theme }) => theme.colors.primary};
padding: 0;
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
}
a {
color: inherit;
text-decoration: none;
}
* {
box-sizing: border-box;
}
`
export default GlobalStyle; */
export const lightTheme: DefaultTheme = {
themeName: "Light Theme",
themeId: 0,
colors: {
background: '#ffffff',
primary: '#00aaff',
secondary:'#ffaa00',
online: '#00ff00',
loading: '#ff5300',
offline: '#ff0000',
},
}
export const darkTheme: DefaultTheme = {
themeName: "Dark Theme",
themeId: 1,
colors: {
background: '#1f1f1f',
primary: '#00aaff',
secondary:'#ffaa00',
online: '#00ff00',
loading: '#ff5300',
offline: '#ff0000',
},
}
export const amoledTheme: DefaultTheme = {
themeName: "AMOLED Theme",
themeId: 2,
colors: {
background: '#000000',
primary: '#00aaff',
secondary:'#ffaa00',
online: '#00ff00',
loading: '#ff5300',
offline: '#ff0000',
},
}
export const amoled2Theme: DefaultTheme = {
themeName: "AMOLED Theme 2",
themeId: 3,
colors: {
background: '#000000',
primary: '#00ffaa',
secondary:'#aa00ff',
online: '#00ff00',
loading: '#ff5300',
offline: '#ff0000',
},
}