From ff3cd9145165d0e62c20004fbac012204cc3dfc8 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Thu, 8 Nov 2018 09:48:34 +0100 Subject: [PATCH 01/27] Change dashicon color Implement toolbar button style --- packages/components/src/button/index.native.js | 6 +++--- .../components/src/primitives/svg/index.native.js | 14 ++++++++++++-- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index be7f7caf4369b..883780734df8b 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -10,11 +10,11 @@ export default function Button( props ) { accessible={ true } accessibilityLabel={ ariaLabel } onPress={ onClick } - style={ { borderColor: ariaPressed ? 'black' : 'white', borderWidth: 1, borderRadius: 2 } } + style={ { flex: 1, borderColor: ariaPressed ? 'black' : 'white', borderWidth: 1, borderRadius: 5 } } > - + { children } - { subscript && ( { subscript } ) } + { subscript && ( { subscript } ) } ); diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index 9f6da4772c48e..150f46fd5b0fb 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -2,7 +2,7 @@ * External dependencies */ import { omit } from 'lodash'; -import { Svg } from 'react-native-svg'; +import { Svg, Path as SvgPath } from 'react-native-svg'; /** * Internal dependencies @@ -12,7 +12,6 @@ import styles from '../../dashicon/style.scss'; export { Circle, G, - Path, Polygon, Rect, } from 'react-native-svg'; @@ -42,3 +41,14 @@ export const SVG = ( props ) => { /> ); }; + +export const Path = ( props ) => { + + return ( + + ); +}; + From 3cff0759287dabd862c0026d275bb9e4e7e2bcc6 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 13 Nov 2018 21:33:57 +0100 Subject: [PATCH 02/27] Fixed Toolbar style --- packages/block-library/src/image/edit.native.js | 4 ++-- packages/components/src/button/index.native.js | 4 ++-- packages/components/src/index.native.js | 1 + packages/components/src/toolbar/toolbar-container.native.js | 6 ++++-- 4 files changed, 9 insertions(+), 6 deletions(-) diff --git a/packages/block-library/src/image/edit.native.js b/packages/block-library/src/image/edit.native.js index fde82c5a71777..9b553e05ec018 100644 --- a/packages/block-library/src/image/edit.native.js +++ b/packages/block-library/src/image/edit.native.js @@ -8,7 +8,7 @@ import RNReactNativeGutenbergBridge from 'react-native-gutenberg-bridge'; * Internal dependencies */ import { MediaPlaceholder, RichText, BlockControls } from '@wordpress/editor'; -import { Toolbar, IconButton } from '@wordpress/components'; +import { Toolbar, IconButton, ToolbarButton } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; export default function ImageEdit( props ) { @@ -40,7 +40,7 @@ export default function ImageEdit( props ) { const toolbarEditButton = ( - - + { children } { subscript && ( { subscript } ) } diff --git a/packages/components/src/index.native.js b/packages/components/src/index.native.js index 47799cd872668..3e44bdec61e50 100644 --- a/packages/components/src/index.native.js +++ b/packages/components/src/index.native.js @@ -2,6 +2,7 @@ export * from './primitives'; export { default as Dashicon } from './dashicon'; export { default as Toolbar } from './toolbar'; +export { default as ToolbarButton } from './toolbar-button'; export { default as withSpokenMessages } from './higher-order/with-spoken-messages'; export { default as IconButton } from './icon-button'; export { createSlotFill, Slot, Fill, Provider as SlotFillProvider } from './slot-fill'; diff --git a/packages/components/src/toolbar/toolbar-container.native.js b/packages/components/src/toolbar/toolbar-container.native.js index 08106a987f408..5277ebbd24800 100644 --- a/packages/components/src/toolbar/toolbar-container.native.js +++ b/packages/components/src/toolbar/toolbar-container.native.js @@ -3,8 +3,10 @@ */ import { View } from 'react-native'; -export default ( props ) => ( - +const ToolbarContainer = ( props ) => ( + { props.children } ); + +export default ToolbarContainer; \ No newline at end of file From 442a6eb304454e47fda98eeec2b674201b225e60 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 13 Nov 2018 22:44:11 +0100 Subject: [PATCH 03/27] Style refactor --- .../components/src/button/button-style.scss | 18 ++++++++++++++++++ packages/components/src/button/index.native.js | 10 ++++++++-- 2 files changed, 26 insertions(+), 2 deletions(-) create mode 100644 packages/components/src/button/button-style.scss diff --git a/packages/components/src/button/button-style.scss b/packages/components/src/button/button-style.scss new file mode 100644 index 0000000000000..49d3cf30c08b4 --- /dev/null +++ b/packages/components/src/button/button-style.scss @@ -0,0 +1,18 @@ +.container { + flex: 1; + padding-top: 3px; + padding-right: 3px; + padding-bottom: 3px; + padding-left: 3px; + justify-content: center; + align-items: center; +} + +.button { + flex: 1; + flex-direction: row; + justify-content: center; + align-items: center; + border-width: 1px; + border-radius: 6px; +} \ No newline at end of file diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index 45fbffd57f693..f4c74347123d4 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -3,16 +3,22 @@ */ import { TouchableOpacity, Text, View } from 'react-native'; +import styles from './button-style'; + export default function Button( props ) { const { children, onClick, 'aria-label': ariaLabel, 'aria-pressed': ariaPressed, 'data-subscript': subscript } = props; + + const buttonBorderColor = ariaPressed ? '#a8bece' : '#00000000'; + const buttonBackgroundColor = ariaPressed ? '#F9FBFC' : 'white'; + return ( - + { children } { subscript && ( { subscript } ) } From 5c6ae4f1aa997eab2b13fbb88e6baa178b7590d2 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 13 Nov 2018 23:00:52 +0100 Subject: [PATCH 04/27] Small refinment --- .../components/src/toolbar/toolbar-container.native.js | 4 +++- packages/components/src/toolbar/toolbar-container.scss | 7 +++++++ 2 files changed, 10 insertions(+), 1 deletion(-) create mode 100644 packages/components/src/toolbar/toolbar-container.scss diff --git a/packages/components/src/toolbar/toolbar-container.native.js b/packages/components/src/toolbar/toolbar-container.native.js index 5277ebbd24800..050b1b3dafb0d 100644 --- a/packages/components/src/toolbar/toolbar-container.native.js +++ b/packages/components/src/toolbar/toolbar-container.native.js @@ -3,8 +3,10 @@ */ import { View } from 'react-native'; +import styles from './toolbar-container.scss'; + const ToolbarContainer = ( props ) => ( - + { props.children } ); diff --git a/packages/components/src/toolbar/toolbar-container.scss b/packages/components/src/toolbar/toolbar-container.scss new file mode 100644 index 0000000000000..5ca6912345d84 --- /dev/null +++ b/packages/components/src/toolbar/toolbar-container.scss @@ -0,0 +1,7 @@ +.container { + flex-direction: row; + border-right-width: 1px; + border-right-color: #a8bece; + padding-left: 5px; + padding-right: 5px; +} \ No newline at end of file From 565bd08e9b3afaf108fdfb928743c468d75bb068 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 13 Nov 2018 23:43:13 +0100 Subject: [PATCH 05/27] Small fixes --- packages/components/src/button/button-style.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/components/src/button/button-style.scss b/packages/components/src/button/button-style.scss index 49d3cf30c08b4..df19d6d07352e 100644 --- a/packages/components/src/button/button-style.scss +++ b/packages/components/src/button/button-style.scss @@ -1,11 +1,11 @@ .container { - flex: 1; + flex: 1; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; - justify-content: center; - align-items: center; + justify-content: center; + align-items: center; } .button { From 125a5766579883be84b8b0b0de2f552eb8a24f59 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 13 Nov 2018 23:43:58 +0100 Subject: [PATCH 06/27] Small fixes --- packages/components/src/button/button-style.scss | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/components/src/button/button-style.scss b/packages/components/src/button/button-style.scss index df19d6d07352e..6d143e121c9a3 100644 --- a/packages/components/src/button/button-style.scss +++ b/packages/components/src/button/button-style.scss @@ -9,10 +9,10 @@ } .button { - flex: 1; - flex-direction: row; - justify-content: center; - align-items: center; - border-width: 1px; - border-radius: 6px; + flex: 1; + flex-direction: row; + justify-content: center; + align-items: center; + border-width: 1px; + border-radius: 6px; } \ No newline at end of file From 758829160bbe33b4f2c3d6635305c6a758090dfc Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 13 Nov 2018 23:56:51 +0100 Subject: [PATCH 07/27] Small fix --- packages/components/src/button/index.native.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index f4c74347123d4..cdc05d3067635 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -3,7 +3,7 @@ */ import { TouchableOpacity, Text, View } from 'react-native'; -import styles from './button-style'; +import styles from './button-style.scss'; export default function Button( props ) { const { children, onClick, 'aria-label': ariaLabel, 'aria-pressed': ariaPressed, 'data-subscript': subscript } = props; From 826bec4ce3c55c7714522b67ef0d34246844b067 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Mon, 19 Nov 2018 11:16:36 +0100 Subject: [PATCH 08/27] Temp push --- .../components/src/primitives/svg/index.native.js | 12 ++++++++++-- packages/components/src/primitives/svg/style.scss | 4 ++++ 2 files changed, 14 insertions(+), 2 deletions(-) create mode 100644 packages/components/src/primitives/svg/style.scss diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index 150f46fd5b0fb..49bca81538e9a 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -7,7 +7,7 @@ import { Svg, Path as SvgPath } from 'react-native-svg'; /** * Internal dependencies */ -import styles from '../../dashicon/style.scss'; +import styles from './style.scss'; export { Circle, @@ -33,10 +33,19 @@ export const SVG = ( props ) => { } const safeProps = styleValues.length === 0 ? { ...omit( props, [ 'style' ] ) } : { ...props, style: styleValues }; + + if (styleValues !== undefined && styleValues.length > 0) { + console.log('markosavic','color ' + styleValues[0].color); + } + return ( ); @@ -46,7 +55,6 @@ export const Path = ( props ) => { return ( ); diff --git a/packages/components/src/primitives/svg/style.scss b/packages/components/src/primitives/svg/style.scss new file mode 100644 index 0000000000000..90959d1c42ea1 --- /dev/null +++ b/packages/components/src/primitives/svg/style.scss @@ -0,0 +1,4 @@ +.dashicons-editor-bold { + color: currentColor; + outline: none; +} From c79a483f1cdc14e28151e9940f4a9739f8481a17 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Mon, 19 Nov 2018 21:32:00 +0100 Subject: [PATCH 09/27] Implemented selected state Change insert icon color to wp blue --- .../components/src/button/index.native.js | 7 +++-- .../components/src/dashicon/icon-class.js | 4 +++ .../src/dashicon/icon-class.native.js | 4 +++ packages/components/src/dashicon/index.js | 9 ++++-- packages/components/src/icon-button/index.js | 5 ++-- .../src/primitives/svg/index.native.js | 30 ++++++------------- .../src/primitives/svg/style.native.scss | 15 ++++++++++ .../components/src/primitives/svg/style.scss | 4 --- 8 files changed, 45 insertions(+), 33 deletions(-) create mode 100644 packages/components/src/dashicon/icon-class.js create mode 100644 packages/components/src/dashicon/icon-class.native.js create mode 100644 packages/components/src/primitives/svg/style.native.scss delete mode 100644 packages/components/src/primitives/svg/style.scss diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index cdc05d3067635..2bd762402a719 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -8,8 +8,9 @@ import styles from './button-style.scss'; export default function Button( props ) { const { children, onClick, 'aria-label': ariaLabel, 'aria-pressed': ariaPressed, 'data-subscript': subscript } = props; - const buttonBorderColor = ariaPressed ? '#a8bece' : '#00000000'; - const buttonBackgroundColor = ariaPressed ? '#F9FBFC' : 'white'; + const buttonBorderColor = ariaPressed ? '#2e4453' : '#00000000'; + const buttonBackgroundColor = ariaPressed ? '#2e4453' : 'white'; + const subscriptColor = ariaPressed ? 'white' : '#3d596d'; return ( { children } - { subscript && ( { subscript } ) } + { subscript && ( { subscript } ) } ); diff --git a/packages/components/src/dashicon/icon-class.js b/packages/components/src/dashicon/icon-class.js new file mode 100644 index 0000000000000..86098e2ef6df8 --- /dev/null +++ b/packages/components/src/dashicon/icon-class.js @@ -0,0 +1,4 @@ +export const IconClass = ( props ) => { + const { icon, className } = props; + return [ 'dashicon', 'dashicons-' + icon, className ].filter( Boolean ).join( ' ' ); +}; \ No newline at end of file diff --git a/packages/components/src/dashicon/icon-class.native.js b/packages/components/src/dashicon/icon-class.native.js new file mode 100644 index 0000000000000..7e61992ed8c46 --- /dev/null +++ b/packages/components/src/dashicon/icon-class.native.js @@ -0,0 +1,4 @@ +export const IconClass = ( props ) => { + const { icon, className, ariaPressed } = props; + return [ ariaPressed ? 'dashicon-active' : 'dashicon', 'dashicons-' + icon, className ].filter( Boolean ).join( ' ' ); +}; \ No newline at end of file diff --git a/packages/components/src/dashicon/index.js b/packages/components/src/dashicon/index.js index 8308c4a97384e..fda5fe52a1764 100644 --- a/packages/components/src/dashicon/index.js +++ b/packages/components/src/dashicon/index.js @@ -14,18 +14,21 @@ import { Component } from '@wordpress/element'; * Internal dependencies */ import { Path, SVG } from '../primitives'; +import { IconClass } from './icon-class'; export default class Dashicon extends Component { shouldComponentUpdate( nextProps ) { + return ( this.props.icon !== nextProps.icon || this.props.size !== nextProps.size || - this.props.className !== nextProps.className + this.props.className !== nextProps.className || + this.props.ariaPressed !== nextProps.ariaPressed ); } render() { - const { icon, className, size = 20 } = this.props; + const { icon, size = 20 } = this.props; let path; switch ( icon ) { @@ -896,7 +899,7 @@ export default class Dashicon extends Component { return null; } - const iconClass = [ 'dashicon', 'dashicons-' + icon, className ].filter( Boolean ).join( ' ' ); + const iconClass = IconClass(this.props); return ( - { isString( icon ) ? : icon } + { isString( icon ) ? : icon } { children } ); diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index 49bca81538e9a..ad3aeb8f1e78f 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -1,13 +1,12 @@ /** * External dependencies */ -import { omit } from 'lodash'; import { Svg, Path as SvgPath } from 'react-native-svg'; /** * Internal dependencies */ -import styles from './style.scss'; +import styles from './style.native.scss'; export { Circle, @@ -20,32 +19,21 @@ export const SVG = ( props ) => { // We're using the react-native-classname-to-style plugin, so when a `className` prop is passed it gets converted to `style` here. // Given it carries a string (as it was originally className) but an object is expected for `style`, // we need to check whether `style` exists and is a string, and convert it to an object - let styleKeys = new Array(); - const styleValues = new Array(); - if ( typeof props.style === 'string' || props.style instanceof String ) { - styleKeys = props.style.split( ' ' ); - styleKeys.forEach( ( element ) => { - const oneStyle = styles[ element ]; - if ( oneStyle !== undefined ) { - styleValues.push( oneStyle ); - } - } ); - } - - const safeProps = styleValues.length === 0 ? { ...omit( props, [ 'style' ] ) } : { ...props, style: styleValues }; - if (styleValues !== undefined && styleValues.length > 0) { - console.log('markosavic','color ' + styleValues[0].color); + let styleValues = {}; + if ( typeof props.style === 'string' ) { + let oneStyle = props.style.split( ' ' ).map( element => styles[ element ] ).filter( Boolean ); + styleValues = Object.assign( styleValues, ...oneStyle ); } + const safeProps = { ...props, style: styleValues }; + return ( ); diff --git a/packages/components/src/primitives/svg/style.native.scss b/packages/components/src/primitives/svg/style.native.scss new file mode 100644 index 0000000000000..14ff0435965ec --- /dev/null +++ b/packages/components/src/primitives/svg/style.native.scss @@ -0,0 +1,15 @@ +.dashicon { + color: #3d596d; + fill: currentColor; +} + +.dashicon-active { + color: white; + fill: currentColor; +} + +.dashicons-insert { + color: #0087be; + fill: currentColor; +} + diff --git a/packages/components/src/primitives/svg/style.scss b/packages/components/src/primitives/svg/style.scss deleted file mode 100644 index 90959d1c42ea1..0000000000000 --- a/packages/components/src/primitives/svg/style.scss +++ /dev/null @@ -1,4 +0,0 @@ -.dashicons-editor-bold { - color: currentColor; - outline: none; -} From a5aa2f2d969448c346c4979873ce59b27c6bcb6c Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Mon, 19 Nov 2018 21:35:59 +0100 Subject: [PATCH 10/27] Fixed naming --- packages/components/src/button/index.native.js | 2 +- .../src/button/{button-style.scss => style.native.scss} | 0 2 files changed, 1 insertion(+), 1 deletion(-) rename packages/components/src/button/{button-style.scss => style.native.scss} (100%) diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index 2bd762402a719..f295429a8282f 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -3,7 +3,7 @@ */ import { TouchableOpacity, Text, View } from 'react-native'; -import styles from './button-style.scss'; +import styles from './style.native.scss'; export default function Button( props ) { const { children, onClick, 'aria-label': ariaLabel, 'aria-pressed': ariaPressed, 'data-subscript': subscript } = props; diff --git a/packages/components/src/button/button-style.scss b/packages/components/src/button/style.native.scss similarity index 100% rename from packages/components/src/button/button-style.scss rename to packages/components/src/button/style.native.scss From 7c6c0f4897fcb5c23fa6a5b8d8bc523f8a6653a0 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Mon, 19 Nov 2018 21:40:20 +0100 Subject: [PATCH 11/27] Small fixes --- .../components/src/button/style.native.scss | 26 +++++++++---------- .../src/primitives/svg/style.native.scss | 2 +- 2 files changed, 14 insertions(+), 14 deletions(-) diff --git a/packages/components/src/button/style.native.scss b/packages/components/src/button/style.native.scss index 6d143e121c9a3..a69b6fd8d570c 100644 --- a/packages/components/src/button/style.native.scss +++ b/packages/components/src/button/style.native.scss @@ -1,18 +1,18 @@ .container { - flex: 1; - padding-top: 3px; - padding-right: 3px; - padding-bottom: 3px; - padding-left: 3px; - justify-content: center; - align-items: center; + flex: 1; + padding-top: 3px; + padding-right: 3px; + padding-bottom: 3px; + padding-left: 3px; + justify-content: center; + align-items: center; } .button { - flex: 1; - flex-direction: row; - justify-content: center; - align-items: center; - border-width: 1px; - border-radius: 6px; + flex: 1; + flex-direction: row; + justify-content: center; + align-items: center; + border-width: 1px; + border-radius: 6px; } \ No newline at end of file diff --git a/packages/components/src/primitives/svg/style.native.scss b/packages/components/src/primitives/svg/style.native.scss index 14ff0435965ec..95ddd2f8501d1 100644 --- a/packages/components/src/primitives/svg/style.native.scss +++ b/packages/components/src/primitives/svg/style.native.scss @@ -4,7 +4,7 @@ } .dashicon-active { - color: white; + color: #ffffff; fill: currentColor; } From 4aaac8041aa3f6069101533a81dfe8a1c9b781c1 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Mon, 19 Nov 2018 21:42:43 +0100 Subject: [PATCH 12/27] Rename css files --- packages/components/src/primitives/svg/style.native.scss | 2 +- .../src/toolbar/{toolbar-container.scss => style.native.scss} | 0 packages/components/src/toolbar/toolbar-container.native.js | 2 +- 3 files changed, 2 insertions(+), 2 deletions(-) rename packages/components/src/toolbar/{toolbar-container.scss => style.native.scss} (100%) diff --git a/packages/components/src/primitives/svg/style.native.scss b/packages/components/src/primitives/svg/style.native.scss index 95ddd2f8501d1..bef745ef2e873 100644 --- a/packages/components/src/primitives/svg/style.native.scss +++ b/packages/components/src/primitives/svg/style.native.scss @@ -4,7 +4,7 @@ } .dashicon-active { - color: #ffffff; + color: #fff; fill: currentColor; } diff --git a/packages/components/src/toolbar/toolbar-container.scss b/packages/components/src/toolbar/style.native.scss similarity index 100% rename from packages/components/src/toolbar/toolbar-container.scss rename to packages/components/src/toolbar/style.native.scss diff --git a/packages/components/src/toolbar/toolbar-container.native.js b/packages/components/src/toolbar/toolbar-container.native.js index 050b1b3dafb0d..9ab076f82eb19 100644 --- a/packages/components/src/toolbar/toolbar-container.native.js +++ b/packages/components/src/toolbar/toolbar-container.native.js @@ -3,7 +3,7 @@ */ import { View } from 'react-native'; -import styles from './toolbar-container.scss'; +import styles from './style.native.scss'; const ToolbarContainer = ( props ) => ( From 54440b6f544d970bbb2cd92ebff78f58184167b5 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Mon, 19 Nov 2018 21:44:26 +0100 Subject: [PATCH 13/27] Lint fixes --- packages/components/src/button/style.native.scss | 2 +- packages/components/src/toolbar/style.native.scss | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/components/src/button/style.native.scss b/packages/components/src/button/style.native.scss index a69b6fd8d570c..aad88de57b82a 100644 --- a/packages/components/src/button/style.native.scss +++ b/packages/components/src/button/style.native.scss @@ -15,4 +15,4 @@ align-items: center; border-width: 1px; border-radius: 6px; -} \ No newline at end of file +} diff --git a/packages/components/src/toolbar/style.native.scss b/packages/components/src/toolbar/style.native.scss index 5ca6912345d84..1f3d7dc9a8b26 100644 --- a/packages/components/src/toolbar/style.native.scss +++ b/packages/components/src/toolbar/style.native.scss @@ -1,7 +1,7 @@ .container { - flex-direction: row; - border-right-width: 1px; - border-right-color: #a8bece; - padding-left: 5px; - padding-right: 5px; + flex-direction: row; + border-right-width: 1px; + border-right-color: #a8bece; + padding-left: 5px; + padding-right: 5px; } \ No newline at end of file From ee7a9091b8100d69dcf6e2648a32a4ac23b14754 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Mon, 19 Nov 2018 21:45:52 +0100 Subject: [PATCH 14/27] Added EOF line --- packages/components/src/toolbar/style.native.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/src/toolbar/style.native.scss b/packages/components/src/toolbar/style.native.scss index 1f3d7dc9a8b26..2f9eb3d035736 100644 --- a/packages/components/src/toolbar/style.native.scss +++ b/packages/components/src/toolbar/style.native.scss @@ -4,4 +4,4 @@ border-right-color: #a8bece; padding-left: 5px; padding-right: 5px; -} \ No newline at end of file +} From 2fa504d7fcd8d7ecf6fdce1b790572a683e8a532 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 20 Nov 2018 14:13:10 +0100 Subject: [PATCH 15/27] Removed path const Remove scss file and use proper StyleSheet to make code cleaner --- .../components/src/button/index.native.js | 49 ++++++++++++++++--- .../components/src/button/style.native.scss | 18 ------- .../src/primitives/svg/index.native.js | 12 +---- 3 files changed, 43 insertions(+), 36 deletions(-) delete mode 100644 packages/components/src/button/style.native.scss diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index f295429a8282f..6df160c84c947 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -1,17 +1,50 @@ /** * External dependencies */ -import { TouchableOpacity, Text, View } from 'react-native'; +import { StyleSheet, TouchableOpacity, Text, View } from 'react-native'; -import styles from './style.native.scss'; +const styles = StyleSheet.create({ + container: { + flex: 1, + padding: 3, + justifyContent: 'center', + alignItems: 'center' + }, + buttonInactive: { + flex: 1, + flexDirection: 'row', + justifyContent: 'center', + alignItems: 'center', + borderWidth: 1, + borderRadius: 6, + borderColor: '#2e4453', + aspectRatio: 1, + backgroundColor: '#2e4453' + }, + buttonActive: { + flex: 1, + flexDirection: 'row', + justifyContent: 'center', + alignItems: 'center', + borderWidth: 1, + borderRadius: 6, + borderColor: '#00000000', + aspectRatio: 1, + backgroundColor: 'white' + }, + subscriptInactive: { + fontVariant: [ 'small-caps' ], + color: '#3d596d' + }, + subscriptActive: { + fontVariant: [ 'small-caps' ], + color: 'white' + } +}); export default function Button( props ) { const { children, onClick, 'aria-label': ariaLabel, 'aria-pressed': ariaPressed, 'data-subscript': subscript } = props; - const buttonBorderColor = ariaPressed ? '#2e4453' : '#00000000'; - const buttonBackgroundColor = ariaPressed ? '#2e4453' : 'white'; - const subscriptColor = ariaPressed ? 'white' : '#3d596d'; - return ( - + { children } - { subscript && ( { subscript } ) } + { subscript && ( { subscript } ) } ); diff --git a/packages/components/src/button/style.native.scss b/packages/components/src/button/style.native.scss deleted file mode 100644 index aad88de57b82a..0000000000000 --- a/packages/components/src/button/style.native.scss +++ /dev/null @@ -1,18 +0,0 @@ -.container { - flex: 1; - padding-top: 3px; - padding-right: 3px; - padding-bottom: 3px; - padding-left: 3px; - justify-content: center; - align-items: center; -} - -.button { - flex: 1; - flex-direction: row; - justify-content: center; - align-items: center; - border-width: 1px; - border-radius: 6px; -} diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index ad3aeb8f1e78f..53dd4183fec1e 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -1,7 +1,7 @@ /** * External dependencies */ -import { Svg, Path as SvgPath } from 'react-native-svg'; +import { Svg } from 'react-native-svg'; /** * Internal dependencies @@ -11,6 +11,7 @@ import styles from './style.native.scss'; export { Circle, G, + Path, Polygon, Rect, } from 'react-native-svg'; @@ -39,12 +40,3 @@ export const SVG = ( props ) => { ); }; -export const Path = ( props ) => { - - return ( - - ); -}; - From 4fed682ff329aacbad6bf5fb2c74bce55896d810 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 20 Nov 2018 18:17:06 +0100 Subject: [PATCH 16/27] Small fix --- packages/html-entities/package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/html-entities/package.json b/packages/html-entities/package.json index 1b74e5ebb8f89..d3d45f35b3d38 100644 --- a/packages/html-entities/package.json +++ b/packages/html-entities/package.json @@ -4,6 +4,7 @@ "description": "HTML entity utilities for WordPress.", "author": "The WordPress Contributors", "license": "GPL-2.0-or-later", + "react-native": "src/index", "keywords": [ "wordpress", "html", From 0809e9fc60836777a3dd708dffdade426fe6c672 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 20 Nov 2018 18:39:28 +0100 Subject: [PATCH 17/27] Small fix --- packages/components/src/primitives/svg/index.native.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index 53dd4183fec1e..bbc807dd1d556 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -6,7 +6,7 @@ import { Svg } from 'react-native-svg'; /** * Internal dependencies */ -import styles from './style.native.scss'; +import styles from './style.scss'; export { Circle, From fc6cf651a893dcc7001f5f03a572d7d79e81cf1b Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 20 Nov 2018 20:25:20 +0100 Subject: [PATCH 18/27] Fixed lint errors --- .../block-library/src/image/edit.native.js | 2 +- .../components/src/button/index.native.js | 20 +++++++++---------- .../components/src/dashicon/icon-class.js | 6 +++--- .../src/dashicon/icon-class.native.js | 6 +++--- packages/components/src/icon-button/index.js | 6 +++--- .../src/primitives/svg/index.native.js | 6 +++--- .../src/toolbar/toolbar-container.native.js | 2 +- 7 files changed, 24 insertions(+), 24 deletions(-) diff --git a/packages/block-library/src/image/edit.native.js b/packages/block-library/src/image/edit.native.js index 9b553e05ec018..5b4132e19a2b2 100644 --- a/packages/block-library/src/image/edit.native.js +++ b/packages/block-library/src/image/edit.native.js @@ -8,7 +8,7 @@ import RNReactNativeGutenbergBridge from 'react-native-gutenberg-bridge'; * Internal dependencies */ import { MediaPlaceholder, RichText, BlockControls } from '@wordpress/editor'; -import { Toolbar, IconButton, ToolbarButton } from '@wordpress/components'; +import { Toolbar, ToolbarButton } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; export default function ImageEdit( props ) { diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index 6df160c84c947..65058fdde705a 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -3,12 +3,12 @@ */ import { StyleSheet, TouchableOpacity, Text, View } from 'react-native'; -const styles = StyleSheet.create({ +const styles = StyleSheet.create( { container: { flex: 1, padding: 3, justifyContent: 'center', - alignItems: 'center' + alignItems: 'center', }, buttonInactive: { flex: 1, @@ -19,7 +19,7 @@ const styles = StyleSheet.create({ borderRadius: 6, borderColor: '#2e4453', aspectRatio: 1, - backgroundColor: '#2e4453' + backgroundColor: '#2e4453', }, buttonActive: { flex: 1, @@ -30,17 +30,17 @@ const styles = StyleSheet.create({ borderRadius: 6, borderColor: '#00000000', aspectRatio: 1, - backgroundColor: 'white' + backgroundColor: 'white', }, subscriptInactive: { - fontVariant: [ 'small-caps' ], - color: '#3d596d' + fontVariant: [ 'small-caps' ], + color: '#3d596d', }, subscriptActive: { - fontVariant: [ 'small-caps' ], - color: 'white' - } -}); + fontVariant: [ 'small-caps' ], + color: 'white', + }, +} ); export default function Button( props ) { const { children, onClick, 'aria-label': ariaLabel, 'aria-pressed': ariaPressed, 'data-subscript': subscript } = props; diff --git a/packages/components/src/dashicon/icon-class.js b/packages/components/src/dashicon/icon-class.js index 86098e2ef6df8..f82b6453ef68e 100644 --- a/packages/components/src/dashicon/icon-class.js +++ b/packages/components/src/dashicon/icon-class.js @@ -1,4 +1,4 @@ export const IconClass = ( props ) => { - const { icon, className } = props; - return [ 'dashicon', 'dashicons-' + icon, className ].filter( Boolean ).join( ' ' ); -}; \ No newline at end of file + const { icon, className } = props; + return [ 'dashicon', 'dashicons-' + icon, className ].filter( Boolean ).join( ' ' ); +}; diff --git a/packages/components/src/dashicon/icon-class.native.js b/packages/components/src/dashicon/icon-class.native.js index 7e61992ed8c46..09a798008ea1c 100644 --- a/packages/components/src/dashicon/icon-class.native.js +++ b/packages/components/src/dashicon/icon-class.native.js @@ -1,4 +1,4 @@ export const IconClass = ( props ) => { - const { icon, className, ariaPressed } = props; - return [ ariaPressed ? 'dashicon-active' : 'dashicon', 'dashicons-' + icon, className ].filter( Boolean ).join( ' ' ); -}; \ No newline at end of file + const { icon, className, ariaPressed } = props; + return [ ariaPressed ? 'dashicon-active' : 'dashicon', 'dashicons-' + icon, className ].filter( Boolean ).join( ' ' ); +}; diff --git a/packages/components/src/icon-button/index.js b/packages/components/src/icon-button/index.js index 125f44e03a708..199f05db7eefc 100644 --- a/packages/components/src/icon-button/index.js +++ b/packages/components/src/icon-button/index.js @@ -20,8 +20,8 @@ import Dashicon from '../dashicon'; // is common to apply a ref to the button element (only supported in class) class IconButton extends Component { render() { - const { icon, children, label, className, tooltip, shortcut, ...additionalProps} = this.props; - const { 'aria-pressed' : ariaPressed } = this.props; + const { icon, children, label, className, tooltip, shortcut, ...additionalProps } = this.props; + const { 'aria-pressed': ariaPressed } = this.props; const classes = classnames( 'components-icon-button', className ); const tooltipText = tooltip || label; @@ -43,7 +43,7 @@ class IconButton extends Component { let element = ( ); diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index bbc807dd1d556..00a83670e82cf 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -23,7 +23,7 @@ export const SVG = ( props ) => { let styleValues = {}; if ( typeof props.style === 'string' ) { - let oneStyle = props.style.split( ' ' ).map( element => styles[ element ] ).filter( Boolean ); + const oneStyle = props.style.split( ' ' ).map( element => { styles[ element ] } ).filter( Boolean ); styleValues = Object.assign( styleValues, ...oneStyle ); } @@ -31,8 +31,8 @@ export const SVG = ( props ) => { return ( ( ); -export default ToolbarContainer; \ No newline at end of file +export default ToolbarContainer; From 1c7dfc4dd79c8f0c83e9c8cbc933b1642fac1029 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 20 Nov 2018 22:28:10 +0100 Subject: [PATCH 19/27] Fixed styles from comment --- packages/components/src/button/index.native.js | 12 ++++-------- .../components/src/primitives/svg/index.native.js | 2 +- .../components/src/primitives/svg/style.native.scss | 5 ++--- packages/components/src/toolbar/style.native.scss | 2 +- 4 files changed, 8 insertions(+), 13 deletions(-) diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index 65058fdde705a..094fd61066ae1 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -15,26 +15,22 @@ const styles = StyleSheet.create( { flexDirection: 'row', justifyContent: 'center', alignItems: 'center', - borderWidth: 1, - borderRadius: 6, - borderColor: '#2e4453', aspectRatio: 1, - backgroundColor: '#2e4453', + backgroundColor: 'white', }, buttonActive: { flex: 1, flexDirection: 'row', justifyContent: 'center', alignItems: 'center', - borderWidth: 1, borderRadius: 6, - borderColor: '#00000000', + borderColor: '#2e4453', aspectRatio: 1, - backgroundColor: 'white', + backgroundColor: '#2e4453', }, subscriptInactive: { fontVariant: [ 'small-caps' ], - color: '#3d596d', + color: '#87a6bc', }, subscriptActive: { fontVariant: [ 'small-caps' ], diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index 00a83670e82cf..278627b7b52b3 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -23,7 +23,7 @@ export const SVG = ( props ) => { let styleValues = {}; if ( typeof props.style === 'string' ) { - const oneStyle = props.style.split( ' ' ).map( element => { styles[ element ] } ).filter( Boolean ); + const oneStyle = props.style.split( ' ' ).map( element => styles[ element ] ).filter( Boolean ); styleValues = Object.assign( styleValues, ...oneStyle ); } diff --git a/packages/components/src/primitives/svg/style.native.scss b/packages/components/src/primitives/svg/style.native.scss index bef745ef2e873..97b630b2cb42b 100644 --- a/packages/components/src/primitives/svg/style.native.scss +++ b/packages/components/src/primitives/svg/style.native.scss @@ -1,5 +1,5 @@ .dashicon { - color: #3d596d; + color: #87a6bc; fill: currentColor; } @@ -9,7 +9,6 @@ } .dashicons-insert { - color: #0087be; + color: #87a6bc; fill: currentColor; } - diff --git a/packages/components/src/toolbar/style.native.scss b/packages/components/src/toolbar/style.native.scss index 2f9eb3d035736..aca87d859b8bb 100644 --- a/packages/components/src/toolbar/style.native.scss +++ b/packages/components/src/toolbar/style.native.scss @@ -1,7 +1,7 @@ .container { flex-direction: row; border-right-width: 1px; - border-right-color: #a8bece; + border-right-color: #e9eff3; padding-left: 5px; padding-right: 5px; } From 0162da01baa04fc3c231e7d80ab5a9bfad6dee71 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Wed, 21 Nov 2018 09:52:55 +0100 Subject: [PATCH 20/27] Fixed path --- packages/components/src/toolbar/toolbar-container.native.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/src/toolbar/toolbar-container.native.js b/packages/components/src/toolbar/toolbar-container.native.js index 33b165d7acc43..dba6d5123c1ae 100644 --- a/packages/components/src/toolbar/toolbar-container.native.js +++ b/packages/components/src/toolbar/toolbar-container.native.js @@ -3,7 +3,7 @@ */ import { View } from 'react-native'; -import styles from './style.native.scss'; +import styles from './style.scss'; const ToolbarContainer = ( props ) => ( From 51956f87a4b8545e19cd0290f4315fbc08f9b733 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Wed, 21 Nov 2018 09:56:41 +0100 Subject: [PATCH 21/27] Flow error fix --- packages/components/src/primitives/svg/index.native.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index 278627b7b52b3..47c49b1bb6128 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -23,7 +23,7 @@ export const SVG = ( props ) => { let styleValues = {}; if ( typeof props.style === 'string' ) { - const oneStyle = props.style.split( ' ' ).map( element => styles[ element ] ).filter( Boolean ); + const oneStyle = props.style.split( ' ' ).map( ( element ) => styles[ element ] ).filter( Boolean ); styleValues = Object.assign( styleValues, ...oneStyle ); } From 746c90abcc2281e63b0e8de3025d28cff9770d83 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Wed, 21 Nov 2018 11:07:28 +0100 Subject: [PATCH 22/27] Fixes from comments --- .../components/src/button/index.native.js | 23 +++++++++++++------ 1 file changed, 16 insertions(+), 7 deletions(-) diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index 094fd61066ae1..c0260443bcff1 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -4,13 +4,13 @@ import { StyleSheet, TouchableOpacity, Text, View } from 'react-native'; const styles = StyleSheet.create( { - container: { + container: { flex: 1, padding: 3, justifyContent: 'center', alignItems: 'center', - }, - buttonInactive: { + }, + buttonInactive: { flex: 1, flexDirection: 'row', justifyContent: 'center', @@ -29,18 +29,25 @@ const styles = StyleSheet.create( { backgroundColor: '#2e4453', }, subscriptInactive: { - fontVariant: [ 'small-caps' ], color: '#87a6bc', + fontWeight: 'bold', + fontSize: 13, + alignSelf: 'flex-end', + marginLeft: -4, }, subscriptActive: { - fontVariant: [ 'small-caps' ], color: 'white', + fontWeight: 'bold', + fontSize: 13, + alignSelf: 'flex-end', + marginLeft: -4, }, } ); export default function Button( props ) { const { children, onClick, 'aria-label': ariaLabel, 'aria-pressed': ariaPressed, 'data-subscript': subscript } = props; + return ( - { children } - { subscript && ( { subscript } ) } + + { children } + { subscript && ( { subscript } ) } + ); From 49e82b49c1d9542efb3a3151250e7a8617ecd57a Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Wed, 21 Nov 2018 11:37:47 +0100 Subject: [PATCH 23/27] FIxed lint errors --- packages/components/src/button/index.native.js | 1 - packages/components/src/dashicon/index.js | 3 +-- 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index c0260443bcff1..4d597b13d7053 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -47,7 +47,6 @@ const styles = StyleSheet.create( { export default function Button( props ) { const { children, onClick, 'aria-label': ariaLabel, 'aria-pressed': ariaPressed, 'data-subscript': subscript } = props; - return ( Date: Wed, 21 Nov 2018 12:22:08 +0100 Subject: [PATCH 24/27] Fixes from comments --- packages/components/src/button/index.native.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index 4d597b13d7053..b1c0b52453809 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -1,7 +1,11 @@ /** * External dependencies */ -import { StyleSheet, TouchableOpacity, Text, View } from 'react-native'; +import { StyleSheet, TouchableOpacity, Text, View, Platform } from 'react-native'; + +const isAndroid = Platform.OS == 'android'; +const marginLeft = isAndroid ? -3 : -4; +const marginBottom = isAndroid ? -0.5 : 0; const styles = StyleSheet.create( { container: { @@ -33,14 +37,16 @@ const styles = StyleSheet.create( { fontWeight: 'bold', fontSize: 13, alignSelf: 'flex-end', - marginLeft: -4, + marginLeft: marginLeft, + marginBottom: marginBottom }, subscriptActive: { color: 'white', fontWeight: 'bold', fontSize: 13, alignSelf: 'flex-end', - marginLeft: -4, + marginLeft: marginLeft, + marginBottom: marginBottom }, } ); From 591ce947244c9b1ae2bcfc055dff16e6e88a9146 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Thu, 22 Nov 2018 11:08:00 +0100 Subject: [PATCH 25/27] Updated dashicon unselected state color --- packages/components/src/primitives/svg/style.native.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/src/primitives/svg/style.native.scss b/packages/components/src/primitives/svg/style.native.scss index 97b630b2cb42b..98a0c62b982cb 100644 --- a/packages/components/src/primitives/svg/style.native.scss +++ b/packages/components/src/primitives/svg/style.native.scss @@ -1,5 +1,5 @@ .dashicon { - color: #87a6bc; + color: #7B9AB1; fill: currentColor; } From 5e6e9d20ad54905fe8718291c29accae28afe231 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Thu, 22 Nov 2018 13:30:11 +0100 Subject: [PATCH 26/27] Fixes from comments --- packages/components/src/button/index.native.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index b1c0b52453809..3451aaf542599 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -3,9 +3,9 @@ */ import { StyleSheet, TouchableOpacity, Text, View, Platform } from 'react-native'; -const isAndroid = Platform.OS == 'android'; -const marginLeft = isAndroid ? -3 : -4; +const isAndroid = Platform.OS === 'android'; const marginBottom = isAndroid ? -0.5 : 0; +const marginLeft = -3; const styles = StyleSheet.create( { container: { @@ -33,12 +33,12 @@ const styles = StyleSheet.create( { backgroundColor: '#2e4453', }, subscriptInactive: { - color: '#87a6bc', + color: '#7B9AB1', fontWeight: 'bold', fontSize: 13, alignSelf: 'flex-end', marginLeft: marginLeft, - marginBottom: marginBottom + marginBottom: marginBottom, }, subscriptActive: { color: 'white', @@ -46,7 +46,7 @@ const styles = StyleSheet.create( { fontSize: 13, alignSelf: 'flex-end', marginLeft: marginLeft, - marginBottom: marginBottom + marginBottom: marginBottom, }, } ); @@ -55,6 +55,7 @@ export default function Button( props ) { return ( Date: Thu, 22 Nov 2018 15:06:24 +0100 Subject: [PATCH 27/27] Fixed lint errors --- packages/components/src/button/index.native.js | 2 +- packages/components/src/primitives/svg/style.native.scss | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/components/src/button/index.native.js b/packages/components/src/button/index.native.js index 3451aaf542599..b5a084993d21f 100644 --- a/packages/components/src/button/index.native.js +++ b/packages/components/src/button/index.native.js @@ -33,7 +33,7 @@ const styles = StyleSheet.create( { backgroundColor: '#2e4453', }, subscriptInactive: { - color: '#7B9AB1', + color: '#7b9ab1', fontWeight: 'bold', fontSize: 13, alignSelf: 'flex-end', diff --git a/packages/components/src/primitives/svg/style.native.scss b/packages/components/src/primitives/svg/style.native.scss index 98a0c62b982cb..a6017e488b922 100644 --- a/packages/components/src/primitives/svg/style.native.scss +++ b/packages/components/src/primitives/svg/style.native.scss @@ -1,5 +1,5 @@ .dashicon { - color: #7B9AB1; + color: #7b9ab1; fill: currentColor; }