From 66c767a80bb5da60c8fc263685eb913e8ad14148 Mon Sep 17 00:00:00 2001 From: Jan Henrik Overland Date: Wed, 26 Jun 2019 16:05:41 +0200 Subject: [PATCH 1/4] chore: use colors from @dhis2/analytics --- .../app/src/components/AxisSetup/styles/AxisSetup.style.js | 2 +- .../Dialogs/AddToLayoutButton/styles/DropDownButton.style.js | 2 +- .../components/DimensionsPanel/styles/DimensionsPanel.style.js | 2 +- .../Layout/DefaultLayout/styles/DefaultAxis.style.js | 3 ++- packages/app/src/components/Layout/styles/Chip.style.js | 3 ++- packages/app/src/components/Layout/styles/Tooltip.style.js | 2 +- packages/app/src/components/Layout/styles/style.js | 2 +- packages/app/src/components/Snackbar/styles/Snackbar.style.js | 2 +- packages/app/src/components/TitleBar/styles/TitleBar.style.js | 2 +- .../src/components/UpdateButton/styles/UpdateButton.style.js | 2 +- .../src/components/Visualization/styles/BlankCanvas.style.js | 2 +- .../styles/VisualizationTypeSelector.style.js | 2 +- 12 files changed, 14 insertions(+), 12 deletions(-) diff --git a/packages/app/src/components/AxisSetup/styles/AxisSetup.style.js b/packages/app/src/components/AxisSetup/styles/AxisSetup.style.js index 7725bda976..98a7c7f79b 100644 --- a/packages/app/src/components/AxisSetup/styles/AxisSetup.style.js +++ b/packages/app/src/components/AxisSetup/styles/AxisSetup.style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; export default { tableContainer: { diff --git a/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/styles/DropDownButton.style.js b/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/styles/DropDownButton.style.js index 1a022b8f3a..52ce1e3de7 100644 --- a/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/styles/DropDownButton.style.js +++ b/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/styles/DropDownButton.style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../../../modules/colors'; +import { colors } from '@dhis2/analytics'; export default { arrowDown: { diff --git a/packages/app/src/components/DimensionsPanel/styles/DimensionsPanel.style.js b/packages/app/src/components/DimensionsPanel/styles/DimensionsPanel.style.js index b61b0cc9d9..89f33266c5 100644 --- a/packages/app/src/components/DimensionsPanel/styles/DimensionsPanel.style.js +++ b/packages/app/src/components/DimensionsPanel/styles/DimensionsPanel.style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; export const styles = { divContainer: { diff --git a/packages/app/src/components/Layout/DefaultLayout/styles/DefaultAxis.style.js b/packages/app/src/components/Layout/DefaultLayout/styles/DefaultAxis.style.js index 9cf5f93d65..3303e0c71d 100644 --- a/packages/app/src/components/Layout/DefaultLayout/styles/DefaultAxis.style.js +++ b/packages/app/src/components/Layout/DefaultLayout/styles/DefaultAxis.style.js @@ -1,4 +1,5 @@ -import { colors } from '../../../../modules/colors'; +import { colors } from '@dhis2/analytics'; + import defaultLayoutStyle from './DefaultLayout.style'; import * as layoutStyle from '../../styles/style'; diff --git a/packages/app/src/components/Layout/styles/Chip.style.js b/packages/app/src/components/Layout/styles/Chip.style.js index 2c346c5af1..6924c887e4 100644 --- a/packages/app/src/components/Layout/styles/Chip.style.js +++ b/packages/app/src/components/Layout/styles/Chip.style.js @@ -1,4 +1,5 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; + import * as layoutStyle from './style'; export const styles = { diff --git a/packages/app/src/components/Layout/styles/Tooltip.style.js b/packages/app/src/components/Layout/styles/Tooltip.style.js index dff48f2ae5..ac20fcae25 100644 --- a/packages/app/src/components/Layout/styles/Tooltip.style.js +++ b/packages/app/src/components/Layout/styles/Tooltip.style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; export const styles = { tooltip: { diff --git a/packages/app/src/components/Layout/styles/style.js b/packages/app/src/components/Layout/styles/style.js index e59d3cd47c..57e9e40941 100644 --- a/packages/app/src/components/Layout/styles/style.js +++ b/packages/app/src/components/Layout/styles/style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; // Layout export const LAYOUT_HEIGHT = '78px'; diff --git a/packages/app/src/components/Snackbar/styles/Snackbar.style.js b/packages/app/src/components/Snackbar/styles/Snackbar.style.js index 08f09217b8..571be4659d 100644 --- a/packages/app/src/components/Snackbar/styles/Snackbar.style.js +++ b/packages/app/src/components/Snackbar/styles/Snackbar.style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; export default theme => ({ container: { diff --git a/packages/app/src/components/TitleBar/styles/TitleBar.style.js b/packages/app/src/components/TitleBar/styles/TitleBar.style.js index 1043a06896..a3c94d5d97 100644 --- a/packages/app/src/components/TitleBar/styles/TitleBar.style.js +++ b/packages/app/src/components/TitleBar/styles/TitleBar.style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; export default { titleBar: { diff --git a/packages/app/src/components/UpdateButton/styles/UpdateButton.style.js b/packages/app/src/components/UpdateButton/styles/UpdateButton.style.js index 519e222900..85f1b5c9fd 100644 --- a/packages/app/src/components/UpdateButton/styles/UpdateButton.style.js +++ b/packages/app/src/components/UpdateButton/styles/UpdateButton.style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; export default { flat: { diff --git a/packages/app/src/components/Visualization/styles/BlankCanvas.style.js b/packages/app/src/components/Visualization/styles/BlankCanvas.style.js index 2982a53502..dd4410fdfa 100644 --- a/packages/app/src/components/Visualization/styles/BlankCanvas.style.js +++ b/packages/app/src/components/Visualization/styles/BlankCanvas.style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; const error = { fontWeight: 'bold', diff --git a/packages/app/src/components/VisualizationTypeSelector/styles/VisualizationTypeSelector.style.js b/packages/app/src/components/VisualizationTypeSelector/styles/VisualizationTypeSelector.style.js index eeb4d2d790..79d236b26e 100644 --- a/packages/app/src/components/VisualizationTypeSelector/styles/VisualizationTypeSelector.style.js +++ b/packages/app/src/components/VisualizationTypeSelector/styles/VisualizationTypeSelector.style.js @@ -1,4 +1,4 @@ -import { colors } from '../../../modules/colors'; +import { colors } from '@dhis2/analytics'; export default { button: { From 39185bb21d768b045485198868f67d0974d983c8 Mon Sep 17 00:00:00 2001 From: Edoardo Sabadelli Date: Tue, 2 Jul 2019 13:05:01 +0200 Subject: [PATCH 2/4] chore: use colors from @dhis2/ui-core --- packages/app/package.json | 1 + .../AxisSetup/styles/AxisSetup.style.js | 6 +- .../styles/DropDownButton.style.js | 2 +- .../styles/DimensionsPanel.style.js | 4 +- .../styles/FatalErrorBoundary.style.js | 10 +-- .../DefaultLayout/styles/DefaultAxis.style.js | 4 +- .../components/Layout/styles/Chip.style.js | 4 +- .../components/Layout/styles/Menu.style.js | 4 +- .../components/Layout/styles/Tooltip.style.js | 4 +- .../app/src/components/Layout/styles/style.js | 10 ++- .../MenuBar/styles/MenuBar.style.js | 4 +- .../Snackbar/styles/Snackbar.style.js | 6 +- .../TitleBar/styles/TitleBar.style.js | 10 +-- .../UpdateButton/styles/UpdateButton.style.js | 4 +- .../Visualization/styles/BlankCanvas.style.js | 6 +- .../styles/VisualizationOptions.style.js | 6 +- .../styles/VisualizationTypeSelector.style.js | 4 +- packages/app/src/modules/colors.js | 63 ------------------- yarn.lock | 8 +++ 19 files changed, 56 insertions(+), 104 deletions(-) delete mode 100644 packages/app/src/modules/colors.js diff --git a/packages/app/package.json b/packages/app/package.json index 151202009b..136d97454d 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -32,6 +32,7 @@ "@dhis2/d2-ui-interpretations": "6.1.0", "@dhis2/data-visualizer-plugin": "33.0.3", "@dhis2/ui": "^1.0.0-beta.11", + "@dhis2/ui-core": "^3.4.0", "@material-ui/core": "^3.1.2", "@material-ui/icons": "^3.0.1", "autoprefixer": "9.1.3", diff --git a/packages/app/src/components/AxisSetup/styles/AxisSetup.style.js b/packages/app/src/components/AxisSetup/styles/AxisSetup.style.js index 98a7c7f79b..320ecf582c 100644 --- a/packages/app/src/components/AxisSetup/styles/AxisSetup.style.js +++ b/packages/app/src/components/AxisSetup/styles/AxisSetup.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; export default { tableContainer: { @@ -11,11 +11,11 @@ export default { width: '10%', }, coloredColumn: { - backgroundColor: colors.lightGrey, + backgroundColor: colors.grey100, }, tableCell: { padding: '4px 24px', - borderBottom: `1px solid ${colors.greyLight}`, + borderBottom: `1px solid ${colors.grey300}`, }, head: { borderBottom: 'none', diff --git a/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/styles/DropDownButton.style.js b/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/styles/DropDownButton.style.js index 52ce1e3de7..f39eaabc55 100644 --- a/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/styles/DropDownButton.style.js +++ b/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/styles/DropDownButton.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; export default { arrowDown: { diff --git a/packages/app/src/components/DimensionsPanel/styles/DimensionsPanel.style.js b/packages/app/src/components/DimensionsPanel/styles/DimensionsPanel.style.js index 89f33266c5..fb9a16ac9b 100644 --- a/packages/app/src/components/DimensionsPanel/styles/DimensionsPanel.style.js +++ b/packages/app/src/components/DimensionsPanel/styles/DimensionsPanel.style.js @@ -1,11 +1,11 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; export const styles = { divContainer: { height: '100%', display: 'flex', flexDirection: 'column', - backgroundColor: colors.snow, + backgroundColor: colors.grey050, padding: '8px 0 2px 8px', }, textField: { diff --git a/packages/app/src/components/ErrorBoundaries/styles/FatalErrorBoundary.style.js b/packages/app/src/components/ErrorBoundaries/styles/FatalErrorBoundary.style.js index cc30979eb3..2218291cbd 100644 --- a/packages/app/src/components/ErrorBoundaries/styles/FatalErrorBoundary.style.js +++ b/packages/app/src/components/ErrorBoundaries/styles/FatalErrorBoundary.style.js @@ -1,7 +1,9 @@ -const bgColor = '#F4F6F8', - iconColor = '#B0BEC5', - primaryTextColor = '#000000', - secondaryTextColor = '#494949'; +import { colors } from '@dhis2/ui-core'; + +const bgColor = colors.grey050, + iconColor = colors.grey500, + primaryTextColor = colors.black, + secondaryTextColor = colors.grey700; export default { mask: { diff --git a/packages/app/src/components/Layout/DefaultLayout/styles/DefaultAxis.style.js b/packages/app/src/components/Layout/DefaultLayout/styles/DefaultAxis.style.js index 3303e0c71d..26ba29e9f4 100644 --- a/packages/app/src/components/Layout/DefaultLayout/styles/DefaultAxis.style.js +++ b/packages/app/src/components/Layout/DefaultLayout/styles/DefaultAxis.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; import defaultLayoutStyle from './DefaultLayout.style'; import * as layoutStyle from '../../styles/style'; @@ -20,7 +20,7 @@ export default { maxWidth: 55, padding: '2px 0px 0px 0px', fontSize: 11, - color: colors.greyDark, + color: colors.grey700, userSelect: 'none', letterSpacing: '0.2px', }, diff --git a/packages/app/src/components/Layout/styles/Chip.style.js b/packages/app/src/components/Layout/styles/Chip.style.js index 6924c887e4..ce9fb55a69 100644 --- a/packages/app/src/components/Layout/styles/Chip.style.js +++ b/packages/app/src/components/Layout/styles/Chip.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; import * as layoutStyle from './style'; @@ -21,7 +21,7 @@ export const styles = { textOverflow: 'ellipsis', }, chipEmpty: { - backgroundColor: colors.greyLight, + backgroundColor: colors.grey300, }, fixedDimensionIcon: { paddingRight: '6px', diff --git a/packages/app/src/components/Layout/styles/Menu.style.js b/packages/app/src/components/Layout/styles/Menu.style.js index 96f3e45426..bb06148fc7 100644 --- a/packages/app/src/components/Layout/styles/Menu.style.js +++ b/packages/app/src/components/Layout/styles/Menu.style.js @@ -1,9 +1,11 @@ +import { colors } from '@dhis2/ui-core'; + export const styles = { icon: { width: 22, height: 22, background: 'none', - color: '#000', + color: colors.black, padding: 0, }, }; diff --git a/packages/app/src/components/Layout/styles/Tooltip.style.js b/packages/app/src/components/Layout/styles/Tooltip.style.js index ac20fcae25..ccf8725a79 100644 --- a/packages/app/src/components/Layout/styles/Tooltip.style.js +++ b/packages/app/src/components/Layout/styles/Tooltip.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; export const styles = { tooltip: { @@ -6,7 +6,7 @@ export const styles = { padding: '7px 9px', color: colors.white, fontSize: '12px', - backgroundColor: '#4a4a4a', + backgroundColor: colors.grey900, boxShadow: 'none', borderRadius: '3px', position: 'relative', diff --git a/packages/app/src/components/Layout/styles/style.js b/packages/app/src/components/Layout/styles/style.js index 57e9e40941..b0e4ae3cb8 100644 --- a/packages/app/src/components/Layout/styles/style.js +++ b/packages/app/src/components/Layout/styles/style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors, theme } from '@dhis2/ui-core'; // Layout export const LAYOUT_HEIGHT = '78px'; @@ -6,18 +6,16 @@ export const LAYOUT_HEIGHT = '78px'; // Axis export const AXIS_PADDING = '4px 4px 2px 6px'; export const AXIS_LABEL_PADDING = '2px 0px 0px 4px'; -export const AXIS_BORDER_COLOR = colors.greyLight; +export const AXIS_BORDER_COLOR = colors.grey300; export const AXIS_BORDER_STYLE = 'solid'; export const AXIS_BORDER_WIDTH = '0px 0px 1px 1px'; export const AXIS_BACKGROUND_COLOR = colors.white; // Chip -export const CHIP_COLOR = colors.black; +export const CHIP_COLOR = colors.grey900; export const CHIP_FONT_WEIGHT = 400; export const CHIP_FONT_SIZE = '14px'; -export const CHIP_BACKGROUND_COLOR = colors.accentSecondaryLightest; -export const CHIP_BACKGROUND_COLOR_HOVER = colors.lightBlueHover; -export const CHIP_BACKGROUND_COLOR_ACTIVE = colors.lightBlueActive; +export const CHIP_BACKGROUND_COLOR = theme.secondary200; export const CHIP_HEIGHT = '14px'; export const CHIP_MARGIN = '4px'; export const CHIP_PADDING = '1px 6px'; diff --git a/packages/app/src/components/MenuBar/styles/MenuBar.style.js b/packages/app/src/components/MenuBar/styles/MenuBar.style.js index 0e7b44c1f4..72bf783e4a 100644 --- a/packages/app/src/components/MenuBar/styles/MenuBar.style.js +++ b/packages/app/src/components/MenuBar/styles/MenuBar.style.js @@ -1,6 +1,8 @@ +import { colors } from '@dhis2/ui-core'; + export default theme => ({ menuBar: { - background: '#fff', + background: colors.white, display: 'flex', alignItems: 'center', padding: `0 ${theme.spacing.unit}px`, diff --git a/packages/app/src/components/Snackbar/styles/Snackbar.style.js b/packages/app/src/components/Snackbar/styles/Snackbar.style.js index 571be4659d..58bcad175c 100644 --- a/packages/app/src/components/Snackbar/styles/Snackbar.style.js +++ b/packages/app/src/components/Snackbar/styles/Snackbar.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; export default theme => ({ container: { @@ -15,11 +15,11 @@ export default theme => ({ cursor: 'pointer', }, warning: { - backgroundColor: '#FFCA28', + backgroundColor: colors.yellow500, color: colors.black, }, error: { - backgroundColor: '#D32F2F', + backgroundColor: colors.red500, color: colors.white, }, }); diff --git a/packages/app/src/components/TitleBar/styles/TitleBar.style.js b/packages/app/src/components/TitleBar/styles/TitleBar.style.js index a3c94d5d97..aa70b4ec0a 100644 --- a/packages/app/src/components/TitleBar/styles/TitleBar.style.js +++ b/packages/app/src/components/TitleBar/styles/TitleBar.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; export default { titleBar: { @@ -8,7 +8,7 @@ export default { cell: { display: 'flex', alignItems: 'center', - background: '#fff', + background: colors.white, padding: '6px', borderRadius: '5px', margin: '4px', @@ -21,7 +21,7 @@ export default { }, interpretation: { fontSize: '12px', - color: colors.greyDark, + color: colors.grey700, }, interpretationIcon: { display: 'flex', @@ -31,10 +31,10 @@ export default { marginRight: '3px', }, titleUnsaved: { - color: colors.grey, + color: colors.grey500, fontStyle: 'italic', }, titleDirty: { - color: colors.greyDark, + color: colors.grey700, }, }; diff --git a/packages/app/src/components/UpdateButton/styles/UpdateButton.style.js b/packages/app/src/components/UpdateButton/styles/UpdateButton.style.js index 85f1b5c9fd..5b03a2995a 100644 --- a/packages/app/src/components/UpdateButton/styles/UpdateButton.style.js +++ b/packages/app/src/components/UpdateButton/styles/UpdateButton.style.js @@ -1,8 +1,8 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; export default { flat: { - backgroundColor: colors.accentPrimary, + backgroundColor: colors.primary600, color: colors.white, fontSize: '13px', padding: '6px 15px', diff --git a/packages/app/src/components/Visualization/styles/BlankCanvas.style.js b/packages/app/src/components/Visualization/styles/BlankCanvas.style.js index dd4410fdfa..0c82d661fc 100644 --- a/packages/app/src/components/Visualization/styles/BlankCanvas.style.js +++ b/packages/app/src/components/Visualization/styles/BlankCanvas.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; const error = { fontWeight: 'bold', @@ -21,10 +21,10 @@ export default { }, title: { ...error, - color: colors.greyDark, + color: colors.grey700, }, description: { ...error, - color: colors.grey, + color: colors.grey500, }, }; diff --git a/packages/app/src/components/VisualizationOptions/styles/VisualizationOptions.style.js b/packages/app/src/components/VisualizationOptions/styles/VisualizationOptions.style.js index 0a98a71374..96ceb12303 100644 --- a/packages/app/src/components/VisualizationOptions/styles/VisualizationOptions.style.js +++ b/packages/app/src/components/VisualizationOptions/styles/VisualizationOptions.style.js @@ -1,11 +1,13 @@ +import { colors } from '@dhis2/ui-core'; + export default { dialogContent: { flex: '1 1 550px', }, tabsBar: { height: '48px', - backgroundColor: '#FFFFFF', - borderBottom: '1px solid #E0E0E0', + backgroundColor: colors.white, + borderBottom: `1px solid ${colors.grey300}`, }, tab: { width: '33.33%', diff --git a/packages/app/src/components/VisualizationTypeSelector/styles/VisualizationTypeSelector.style.js b/packages/app/src/components/VisualizationTypeSelector/styles/VisualizationTypeSelector.style.js index 79d236b26e..be18f46c5c 100644 --- a/packages/app/src/components/VisualizationTypeSelector/styles/VisualizationTypeSelector.style.js +++ b/packages/app/src/components/VisualizationTypeSelector/styles/VisualizationTypeSelector.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/analytics'; +import { colors } from '@dhis2/ui-core'; export default { button: { @@ -20,7 +20,7 @@ export default { menuDivider: { border: 'none', borderBottom: '1px solid', - borderColor: colors.greyLight, + borderColor: colors.grey300, }, menuItem: { height: 120, diff --git a/packages/app/src/modules/colors.js b/packages/app/src/modules/colors.js deleted file mode 100644 index 36fdbb5b05..0000000000 --- a/packages/app/src/modules/colors.js +++ /dev/null @@ -1,63 +0,0 @@ -const accentPrimaryDark = '#004BA0'; -const accentPrimary = '#1976D2'; -const accentPrimaryLight = '#63A4FF'; -const accentPrimaryLightest = '#EAF4FF'; - -const accentSecondaryDark = '#004C40'; -const accentSecondary = '#00796B'; -const accentSecondaryLight = '#48A999'; -const accentSecondaryLightest = '#B2DFDB'; -const accentSecondaryTransparent = '#D9ECEB'; - -const black = '#000000'; -const greyDark = '#494949'; -const grey = '#9E9E9E'; -const greyLight = '#E0E0E0'; -const blueGrey = '#ECEFF1'; -const lightBlue = '#BBDEFB'; -const snow = '#F4F6F8'; -const white = '#FFFFFF'; - -const negative = '#E53935'; -const warning = '#F19C02'; -const positive = '#3D9305'; -const info = '#EAF4FF'; - -// TODO remove these? -const paleGrey = '#FAFAFA'; -const lightGrey = '#F5F5F5'; -const charcoalGrey = '#CCCCCC'; -const blue = '#004BA0'; - -export const colors = { - accentPrimaryDark, - accentPrimary, - accentPrimaryLight, - accentPrimaryLightest, - - accentSecondaryDark, - accentSecondary, - accentSecondaryLight, - accentSecondaryLightest, - accentSecondaryTransparent, - - black, - greyDark, - grey, - greyLight, - blueGrey, - lightBlue, - snow, - white, - - negative, - warning, - positive, - info, - - // TODO remove these? - paleGrey, - lightGrey, - charcoalGrey, - blue, -}; diff --git a/yarn.lock b/yarn.lock index 316232a4e7..4d29f655c2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -337,6 +337,14 @@ react-select "^2.0.0" rxjs "^5.5.7" +"@dhis2/ui-core@^3.4.0": + version "3.4.0" + resolved "https://registry.yarnpkg.com/@dhis2/ui-core/-/ui-core-3.4.0.tgz#23ee88b507eb4968673e3b5789b9785c53c598d5" + integrity sha512-OjF+D5+4wrPui4Pvz38wmM0qBba1nH/EeV0ejYpj5zP4oxmz/FE5FegDNXsMz25ozBCXY6Dne9YBdPfBYk5RTA== + dependencies: + classnames "^2.2.6" + styled-jsx "^3.2.1" + "@dhis2/ui@^1.0.0-beta.11": version "1.0.0-beta.15" resolved "https://registry.yarnpkg.com/@dhis2/ui/-/ui-1.0.0-beta.15.tgz#3dc7484174f1db686dd6f10cbad8271d84f3a0b9" From 9c9b0aeb30b9aca583ba48b31a8cb60561368bab Mon Sep 17 00:00:00 2001 From: Edoardo Sabadelli Date: Tue, 2 Jul 2019 13:50:22 +0200 Subject: [PATCH 3/4] fix: temporary fix for i18next namespace separator issue The : character is the default namespace separator and causes i18next to choke if present in a string. Nothing we can do in the app as the i18next init is defined in d2-i18n and not accessible from the app. --- packages/app/i18n/en.pot | 7 +++++-- packages/app/src/modules/chartTypes.js | 2 +- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/app/i18n/en.pot b/packages/app/i18n/en.pot index 6907e30d12..60ca33ab5c 100644 --- a/packages/app/i18n/en.pot +++ b/packages/app/i18n/en.pot @@ -5,8 +5,8 @@ msgstr "" "Content-Type: text/plain; charset=utf-8\n" "Content-Transfer-Encoding: 8bit\n" "Plural-Forms: nplurals=2; plural=(n != 1)\n" -"POT-Creation-Date: 2019-06-11T12:01:09.869Z\n" -"PO-Revision-Date: 2019-06-11T12:01:09.869Z\n" +"POT-Creation-Date: 2019-07-02T11:48:24.367Z\n" +"PO-Revision-Date: 2019-07-02T11:48:24.367Z\n" msgid "Rename successful" msgstr "" @@ -316,6 +316,9 @@ msgstr "" msgid "Year over year (column)" msgstr "" +msgid "Open as Map" +msgstr "" + msgid "Reporting rate" msgstr "" diff --git a/packages/app/src/modules/chartTypes.js b/packages/app/src/modules/chartTypes.js index d8fae08583..d47e33e671 100644 --- a/packages/app/src/modules/chartTypes.js +++ b/packages/app/src/modules/chartTypes.js @@ -26,7 +26,7 @@ export const chartTypeDisplayNames = { [GAUGE]: i18n.t('Gauge'), [YEAR_OVER_YEAR_LINE]: i18n.t('Year over year (line)'), [YEAR_OVER_YEAR_COLUMN]: i18n.t('Year over year (column)'), - [OPEN_AS_MAP]: i18n.t('Open as: Map'), + [OPEN_AS_MAP]: i18n.t('Open as Map'), // TODO Open as: Map when i18next nsSeparator fixed }; const stackedTypes = [STACKED_COLUMN, STACKED_BAR, AREA]; From 18c743578af095dbfe40e20cb7150286e30a1c86 Mon Sep 17 00:00:00 2001 From: Viktor Varland Date: Wed, 3 Jul 2019 11:34:04 +0200 Subject: [PATCH 4/4] chore: let webpack compile @dhis2 scoped packages to es5 to satisfy uglifyjs (#308) To allow DV to use the ui-core components (which are shipped as ES6 code), the App is responsible to compile the ui-core components into the target of the App. The problem is that UglifyJS does not support ES6, so we need to compile the ES6 code to ES5 code before shipping it to the html-webpack-plugin[1] minifier, which uses html-minifier[2] which finally runs the uglifyjs library[3] which crashes. > uglify-js only supports JavaScript (ECMAScript 5). To solve this we need to allow webpack to run babel on @dhis2-scope packages in node_modules. [1] https://github.com/jantimon/html-webpack-plugin#minification [2] https://github.com/kangax/html-minifier [3] https://github.com/mishoo/UglifyJS2 --- packages/app/config/webpack.config.dev.js | 7 +++++++ packages/app/config/webpack.config.prod.js | 7 +++++++ 2 files changed, 14 insertions(+) diff --git a/packages/app/config/webpack.config.dev.js b/packages/app/config/webpack.config.dev.js index 95b0deeecd..c861d3eecf 100644 --- a/packages/app/config/webpack.config.dev.js +++ b/packages/app/config/webpack.config.dev.js @@ -167,6 +167,13 @@ module.exports = { }, }, // Process JS with Babel. + { + test: /@dhis2\/.*\.(js|jsx|mjs)$/, + loader: require.resolve('babel-loader'), + options: { + cacheDirectory: true, + }, + }, { test: /\.(js|jsx|mjs)$/, include: paths.appSrc, diff --git a/packages/app/config/webpack.config.prod.js b/packages/app/config/webpack.config.prod.js index fc448e2b8f..b40b00f587 100644 --- a/packages/app/config/webpack.config.prod.js +++ b/packages/app/config/webpack.config.prod.js @@ -157,6 +157,13 @@ module.exports = { }, }, // Process JS with Babel. + { + test: /@dhis2\/.*\.(js|jsx|mjs)$/, + loader: require.resolve('babel-loader'), + options: { + cacheDirectory: true, + }, + }, { test: /\.(js|jsx|mjs)$/, include: paths.appSrc,