Page MenuHomePhabricator

D5619.diff
No OneTemporary

D5619.diff

diff --git a/native/components/color-selector-button.react.js b/native/components/color-selector-button.react.js
--- a/native/components/color-selector-button.react.js
+++ b/native/components/color-selector-button.react.js
@@ -1,11 +1,13 @@
// @flow
import * as React from 'react';
-import { StyleSheet, TouchableOpacity, View } from 'react-native';
+import { TouchableOpacity, View } from 'react-native';
import tinycolor from 'tinycolor2';
import type { SetState } from 'lib/types/hook-types';
+import { useStyles } from '../themes/colors';
+
type ColorSelectorButtonProps = {
+color: string,
+pendingColor: string,
@@ -13,10 +15,11 @@
};
function ColorSelectorButton(props: ColorSelectorButtonProps): React.Node {
const { color, pendingColor, setPendingColor } = props;
+ const styles = useStyles(unboundStyles);
const colorSplotchStyle = React.useMemo(() => {
return [styles.button, { backgroundColor: `#${color}` }];
- }, [color]);
+ }, [color, styles.button]);
const onPendingColorSelected = React.useCallback(() => {
setPendingColor(color);
@@ -33,7 +36,7 @@
);
}
-const styles = StyleSheet.create({
+const unboundStyles = {
button: {
borderRadius: 20,
height: 40,
@@ -47,12 +50,12 @@
width: 60,
},
outerRingSelected: {
- backgroundColor: '#404040',
+ backgroundColor: 'modalForegroundBorder',
borderRadius: 30,
height: 60,
margin: 5,
width: 60,
},
-});
+};
export default ColorSelectorButton;
diff --git a/native/components/color-selector.react.js b/native/components/color-selector.react.js
--- a/native/components/color-selector.react.js
+++ b/native/components/color-selector.react.js
@@ -82,7 +82,7 @@
flex: 1,
},
header: {
- color: 'white',
+ color: 'modalForegroundLabel',
fontSize: 24,
fontWeight: 'bold',
marginBottom: 10,

File Metadata

Mime Type
text/plain
Expires
Sat, Oct 5, 5:59 PM (21 h, 32 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2245279
Default Alt Text
D5619.diff (1 KB)

Event Timeline