Add lighter purple color option
This commit is contained in:
parent
2c029b5f6a
commit
0ed3b9817c
3
App.tsx
3
App.tsx
|
@ -13,7 +13,6 @@ import {
|
||||||
Snackbar,
|
Snackbar,
|
||||||
} from 'react-native-paper'
|
} from 'react-native-paper'
|
||||||
import MaterialIcon from 'react-native-vector-icons/MaterialIcons'
|
import MaterialIcon from 'react-native-vector-icons/MaterialIcons'
|
||||||
import {lightColors} from './colors'
|
|
||||||
import {AppDataSource} from './data-source'
|
import {AppDataSource} from './data-source'
|
||||||
import {settingsRepo} from './db'
|
import {settingsRepo} from './db'
|
||||||
import Routes from './Routes'
|
import Routes from './Routes'
|
||||||
|
@ -35,8 +34,6 @@ export const CombinedDarkTheme = {
|
||||||
colors: {
|
colors: {
|
||||||
...NavigationDarkTheme.colors,
|
...NavigationDarkTheme.colors,
|
||||||
...PaperDarkTheme.colors,
|
...PaperDarkTheme.colors,
|
||||||
primary: lightColors[0].hex,
|
|
||||||
background: '#0E0E0E',
|
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -6,9 +6,7 @@ import {lightColors} from './colors'
|
||||||
export default function MassiveFab(props: Partial<ComponentProps<typeof FAB>>) {
|
export default function MassiveFab(props: Partial<ComponentProps<typeof FAB>>) {
|
||||||
const {colors} = useTheme()
|
const {colors} = useTheme()
|
||||||
|
|
||||||
const fabColor = lightColors
|
const fabColor = lightColors.includes(colors.primary)
|
||||||
.map(lightColor => lightColor.hex)
|
|
||||||
.includes(colors.primary)
|
|
||||||
? CombinedDarkTheme.colors.background
|
? CombinedDarkTheme.colors.background
|
||||||
: CombinedDefaultTheme.colors.background
|
: CombinedDefaultTheme.colors.background
|
||||||
|
|
||||||
|
|
|
@ -202,10 +202,10 @@ export default function SettingsPage() {
|
||||||
<Select value={color} onChange={changeColor}>
|
<Select value={color} onChange={changeColor}>
|
||||||
{lightColors.concat(darkColors).map(colorOption => (
|
{lightColors.concat(darkColors).map(colorOption => (
|
||||||
<Picker.Item
|
<Picker.Item
|
||||||
key={colorOption.hex}
|
key={colorOption}
|
||||||
value={colorOption.hex}
|
value={colorOption}
|
||||||
label="Primary color"
|
label="Primary color"
|
||||||
color={colorOption.hex}
|
color={colorOption}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</Select>
|
</Select>
|
||||||
|
|
16
colors.ts
16
colors.ts
|
@ -1,16 +1,12 @@
|
||||||
export const lightColors = [
|
export const lightColors = [
|
||||||
{hex: '#B3E5FC', name: 'Cyan'},
|
'#B3E5FC',
|
||||||
{hex: '#FA8072', name: 'Salmon'},
|
'#FA8072',
|
||||||
{hex: '#FFC0CB', name: 'Pink'},
|
'#FFC0CB',
|
||||||
{hex: '#E9DCC9', name: 'Linen'},
|
'#E9DCC9',
|
||||||
|
'#BBA1CE',
|
||||||
]
|
]
|
||||||
|
|
||||||
export const darkColors = [
|
export const darkColors = ['#8156A7', '#007AFF', '#000000', '#CD5C5C']
|
||||||
{hex: '#8156A7', name: 'Purple'},
|
|
||||||
{hex: '#007AFF', name: 'Blue'},
|
|
||||||
{hex: '#000000', name: 'Black'},
|
|
||||||
{hex: '#CD5C5C', name: 'Red'},
|
|
||||||
]
|
|
||||||
|
|
||||||
export const colorShade = (color: any, amount: number) => {
|
export const colorShade = (color: any, amount: number) => {
|
||||||
color = color.replace(/^#/, '')
|
color = color.replace(/^#/, '')
|
||||||
|
|
|
@ -10,7 +10,7 @@ export class addColor1667186320954 implements MigrationInterface {
|
||||||
name: 'color',
|
name: 'color',
|
||||||
type: 'text',
|
type: 'text',
|
||||||
isNullable: false,
|
isNullable: false,
|
||||||
default: `'${darkColors[0].hex}'`,
|
default: `'${darkColors[0]}'`,
|
||||||
}),
|
}),
|
||||||
)
|
)
|
||||||
.catch(console.error)
|
.catch(console.error)
|
||||||
|
|
Loading…
Reference in New Issue
Block a user