diff options
author | Dominik Guzei <dominik.guzei@gmail.com> | 2019-04-07 19:56:00 +0200 |
---|---|---|
committer | Dominik Guzei <dominik.guzei@gmail.com> | 2019-04-07 19:56:00 +0200 |
commit | 4421584d41a5182b0f93f0ed7e3c73d34f98d3de (patch) | |
tree | 7bf80c8f711a94944c468900a21533f3fc305161 /src | |
parent | render workspace service list like services + toggle (diff) | |
download | ferdium-app-4421584d41a5182b0f93f0ed7e3c73d34f98d3de.tar.gz ferdium-app-4421584d41a5182b0f93f0ed7e3c73d34f98d3de.tar.zst ferdium-app-4421584d41a5182b0f93f0ed7e3c73d34f98d3de.zip |
change plus icon in workspace drawer to settings icon
Diffstat (limited to 'src')
5 files changed, 52 insertions, 27 deletions
diff --git a/src/features/workspaces/components/WorkspaceDrawer.js b/src/features/workspaces/components/WorkspaceDrawer.js index 0befcc869..bb77aa72d 100644 --- a/src/features/workspaces/components/WorkspaceDrawer.js +++ b/src/features/workspaces/components/WorkspaceDrawer.js | |||
@@ -21,9 +21,9 @@ const messages = defineMessages({ | |||
21 | id: 'workspaceDrawer.allServices', | 21 | id: 'workspaceDrawer.allServices', |
22 | defaultMessage: '!!!All services', | 22 | defaultMessage: '!!!All services', |
23 | }, | 23 | }, |
24 | addWorkspaceTooltip: { | 24 | workspacesSettingsTooltip: { |
25 | id: 'workspaceDrawer.addWorkspaceTooltip', | 25 | id: 'workspaceDrawer.workspacesSettingsTooltip', |
26 | defaultMessage: '!!!Add workspace', | 26 | defaultMessage: '!!!Workspaces settings', |
27 | }, | 27 | }, |
28 | workspaceFeatureInfo: { | 28 | workspaceFeatureInfo: { |
29 | id: 'workspaceDrawer.workspaceFeatureInfo', | 29 | id: 'workspaceDrawer.workspaceFeatureInfo', |
@@ -54,12 +54,12 @@ const styles = theme => ({ | |||
54 | marginBottom: '25px', | 54 | marginBottom: '25px', |
55 | marginLeft: theme.workspaceDrawerPadding, | 55 | marginLeft: theme.workspaceDrawerPadding, |
56 | }, | 56 | }, |
57 | addWorkspaceButton: { | 57 | workspacesSettingsButton: { |
58 | float: 'right', | 58 | float: 'right', |
59 | marginRight: theme.workspaceDrawerPadding, | 59 | marginRight: theme.workspaceDrawerPadding, |
60 | marginTop: '2px', | 60 | marginTop: '2px', |
61 | }, | 61 | }, |
62 | addWorkspaceButtonIcon: { | 62 | workspacesSettingsButtonIcon: { |
63 | fill: theme.workspaceDrawerAddButtonColor, | 63 | fill: theme.workspaceDrawerAddButtonColor, |
64 | '&:hover': { | 64 | '&:hover': { |
65 | fill: theme.workspaceDrawerAddButtonHoverColor, | 65 | fill: theme.workspaceDrawerAddButtonHoverColor, |
@@ -133,17 +133,17 @@ class WorkspaceDrawer extends Component { | |||
133 | <H1 className={classes.headline}> | 133 | <H1 className={classes.headline}> |
134 | {intl.formatMessage(messages.headline)} | 134 | {intl.formatMessage(messages.headline)} |
135 | <span | 135 | <span |
136 | className={classes.addWorkspaceButton} | 136 | className={classes.workspacesSettingsButton} |
137 | onClick={() => { | 137 | onClick={() => { |
138 | workspaceActions.openWorkspaceSettings(); | 138 | workspaceActions.openWorkspaceSettings(); |
139 | gaEvent(GA_CATEGORY_WORKSPACES, 'add', 'drawerHeadline'); | 139 | gaEvent(GA_CATEGORY_WORKSPACES, 'settings', 'drawerHeadline'); |
140 | }} | 140 | }} |
141 | data-tip={`${intl.formatMessage(messages.addWorkspaceTooltip)}`} | 141 | data-tip={`${intl.formatMessage(messages.workspacesSettingsTooltip)}`} |
142 | > | 142 | > |
143 | <Icon | 143 | <Icon |
144 | icon="mdiPlusBox" | 144 | icon="mdiSettings" |
145 | size={1.5} | 145 | size={1.5} |
146 | className={classes.addWorkspaceButtonIcon} | 146 | className={classes.workspacesSettingsButtonIcon} |
147 | /> | 147 | /> |
148 | </span> | 148 | </span> |
149 | </H1> | 149 | </H1> |
@@ -212,7 +212,7 @@ class WorkspaceDrawer extends Component { | |||
212 | <Icon | 212 | <Icon |
213 | icon="mdiPlusBox" | 213 | icon="mdiPlusBox" |
214 | size={1} | 214 | size={1} |
215 | className={classes.addWorkspaceButtonIcon} | 215 | className={classes.workspacesSettingsButtonIcon} |
216 | /> | 216 | /> |
217 | <span> | 217 | <span> |
218 | {intl.formatMessage(messages.addNewWorkspaceLabel)} | 218 | {intl.formatMessage(messages.addNewWorkspaceLabel)} |
diff --git a/src/features/workspaces/components/WorkspaceServiceListItem.js b/src/features/workspaces/components/WorkspaceServiceListItem.js index 7b516d056..e05b21440 100644 --- a/src/features/workspaces/components/WorkspaceServiceListItem.js +++ b/src/features/workspaces/components/WorkspaceServiceListItem.js | |||
@@ -2,23 +2,37 @@ import React, { Component } from 'react'; | |||
2 | import PropTypes from 'prop-types'; | 2 | import PropTypes from 'prop-types'; |
3 | import { observer } from 'mobx-react'; | 3 | import { observer } from 'mobx-react'; |
4 | import injectSheet from 'react-jss'; | 4 | import injectSheet from 'react-jss'; |
5 | import classnames from 'classnames'; | ||
5 | import { Toggle } from '@meetfranz/forms'; | 6 | import { Toggle } from '@meetfranz/forms'; |
6 | 7 | ||
7 | import Service from '../../../models/Service'; | 8 | import Service from '../../../models/Service'; |
8 | import ServiceIcon from '../../../components/ui/ServiceIcon'; | 9 | import ServiceIcon from '../../../components/ui/ServiceIcon'; |
9 | 10 | ||
10 | const styles = theme => ({ | 11 | const styles = theme => ({ |
11 | service: { | 12 | listItem: { |
12 | height: theme.workspaceSettings.listItemHeight, | 13 | height: theme.workspaces.settings.listItems.height, |
14 | borderBottom: `1px solid ${theme.workspaces.settings.listItems.borderColor}`, | ||
13 | display: 'flex', | 15 | display: 'flex', |
16 | alignItems: 'center', | ||
14 | }, | 17 | }, |
15 | name: { | 18 | serviceIcon: { |
16 | marginTop: '4px', | 19 | padding: theme.workspaces.settings.listItems.padding, |
20 | }, | ||
21 | toggle: { | ||
22 | height: 'auto', | ||
23 | margin: 0, | ||
24 | }, | ||
25 | label: { | ||
26 | padding: theme.workspaces.settings.listItems.padding, | ||
27 | flexGrow: 1, | ||
28 | }, | ||
29 | disabledLabel: { | ||
30 | color: theme.workspaces.settings.listItems.disabled.color, | ||
17 | }, | 31 | }, |
18 | }); | 32 | }); |
19 | 33 | ||
20 | @injectSheet(styles) @observer | 34 | @injectSheet(styles) @observer |
21 | class ServiceListItem extends Component { | 35 | class WorkspaceServiceListItem extends Component { |
22 | static propTypes = { | 36 | static propTypes = { |
23 | classes: PropTypes.object.isRequired, | 37 | classes: PropTypes.object.isRequired, |
24 | isInWorkspace: PropTypes.bool.isRequired, | 38 | isInWorkspace: PropTypes.bool.isRequired, |
@@ -35,16 +49,27 @@ class ServiceListItem extends Component { | |||
35 | } = this.props; | 49 | } = this.props; |
36 | 50 | ||
37 | return ( | 51 | return ( |
38 | <div className={classes.service}> | 52 | <div className={classes.listItem}> |
39 | <ServiceIcon service={service} /> | 53 | <ServiceIcon |
54 | className={classes.serviceIcon} | ||
55 | service={service} | ||
56 | /> | ||
57 | <span | ||
58 | className={classnames([ | ||
59 | classes.label, | ||
60 | service.isEnabled ? null : classes.disabledLabel, | ||
61 | ])} | ||
62 | > | ||
63 | {service.name} | ||
64 | </span> | ||
40 | <Toggle | 65 | <Toggle |
66 | className={classes.toggle} | ||
41 | checked={isInWorkspace} | 67 | checked={isInWorkspace} |
42 | onChange={onToggle} | 68 | onChange={onToggle} |
43 | label={service.name} | ||
44 | /> | 69 | /> |
45 | </div> | 70 | </div> |
46 | ); | 71 | ); |
47 | } | 72 | } |
48 | } | 73 | } |
49 | 74 | ||
50 | export default ServiceListItem; | 75 | export default WorkspaceServiceListItem; |
diff --git a/src/i18n/locales/defaultMessages.json b/src/i18n/locales/defaultMessages.json index 05df4cbac..f882e6030 100644 --- a/src/i18n/locales/defaultMessages.json +++ b/src/i18n/locales/defaultMessages.json | |||
@@ -3349,15 +3349,15 @@ | |||
3349 | } | 3349 | } |
3350 | }, | 3350 | }, |
3351 | { | 3351 | { |
3352 | "defaultMessage": "!!!Add workspace", | 3352 | "defaultMessage": "!!!Workspaces settings", |
3353 | "end": { | 3353 | "end": { |
3354 | "column": 3, | 3354 | "column": 3, |
3355 | "line": 27 | 3355 | "line": 27 |
3356 | }, | 3356 | }, |
3357 | "file": "src/features/workspaces/components/WorkspaceDrawer.js", | 3357 | "file": "src/features/workspaces/components/WorkspaceDrawer.js", |
3358 | "id": "workspaceDrawer.addWorkspaceTooltip", | 3358 | "id": "workspaceDrawer.workspacesSettingsTooltip", |
3359 | "start": { | 3359 | "start": { |
3360 | "column": 23, | 3360 | "column": 29, |
3361 | "line": 24 | 3361 | "line": 24 |
3362 | } | 3362 | } |
3363 | }, | 3363 | }, |
diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json index 78dcd83d7..e55489418 100644 --- a/src/i18n/locales/en-US.json +++ b/src/i18n/locales/en-US.json | |||
@@ -307,12 +307,12 @@ | |||
307 | "welcome.loginButton": "Login to your account", | 307 | "welcome.loginButton": "Login to your account", |
308 | "welcome.signupButton": "Create a free account", | 308 | "welcome.signupButton": "Create a free account", |
309 | "workspaceDrawer.addNewWorkspaceLabel": "add new workspace", | 309 | "workspaceDrawer.addNewWorkspaceLabel": "add new workspace", |
310 | "workspaceDrawer.addWorkspaceTooltip": "Add workspace", | ||
311 | "workspaceDrawer.allServices": "All services", | 310 | "workspaceDrawer.allServices": "All services", |
312 | "workspaceDrawer.headline": "Workspaces", | 311 | "workspaceDrawer.headline": "Workspaces", |
313 | "workspaceDrawer.item.noServicesAddedYet": "No services added yet", | 312 | "workspaceDrawer.item.noServicesAddedYet": "No services added yet", |
314 | "workspaceDrawer.premiumCtaButtonLabel": "Create your first workspace", | 313 | "workspaceDrawer.premiumCtaButtonLabel": "Create your first workspace", |
315 | "workspaceDrawer.reactivatePremiumAccountLabel": "Reactivate premium account", | 314 | "workspaceDrawer.reactivatePremiumAccountLabel": "Reactivate premium account", |
316 | "workspaceDrawer.workspaceFeatureInfo": "<p>Franz Workspaces let you focus on what’s important right now. Set up different sets of services and easily switch between them at any time.</p><p>You decide which services you need when and where, so we can help you stay on top of your game - or easily switch off from work whenever you want.</p>", | 315 | "workspaceDrawer.workspaceFeatureInfo": "<p>Franz Workspaces let you focus on what’s important right now. Set up different sets of services and easily switch between them at any time.</p><p>You decide which services you need when and where, so we can help you stay on top of your game - or easily switch off from work whenever you want.</p>", |
316 | "workspaceDrawer.workspacesSettingsTooltip": "Edit workspaces settings", | ||
317 | "workspaces.switchingIndicator.switchingTo": "Switching to" | 317 | "workspaces.switchingIndicator.switchingTo": "Switching to" |
318 | } \ No newline at end of file | 318 | } \ No newline at end of file |
diff --git a/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawer.json b/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawer.json index 9b0b80321..d347622d2 100644 --- a/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawer.json +++ b/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawer.json | |||
@@ -26,12 +26,12 @@ | |||
26 | } | 26 | } |
27 | }, | 27 | }, |
28 | { | 28 | { |
29 | "id": "workspaceDrawer.addWorkspaceTooltip", | 29 | "id": "workspaceDrawer.workspacesSettingsTooltip", |
30 | "defaultMessage": "!!!Add workspace", | 30 | "defaultMessage": "!!!Workspaces settings", |
31 | "file": "src/features/workspaces/components/WorkspaceDrawer.js", | 31 | "file": "src/features/workspaces/components/WorkspaceDrawer.js", |
32 | "start": { | 32 | "start": { |
33 | "line": 24, | 33 | "line": 24, |
34 | "column": 23 | 34 | "column": 29 |
35 | }, | 35 | }, |
36 | "end": { | 36 | "end": { |
37 | "line": 27, | 37 | "line": 27, |