diff options
-rw-r--r-- | src/features/workspaces/components/WorkspaceDrawer.tsx | 2 | ||||
-rw-r--r-- | src/features/workspaces/components/WorkspaceDrawerItem.tsx | 18 | ||||
-rw-r--r-- | src/styles/tabs.scss | 4 | ||||
-rw-r--r-- | src/styles/vertical.scss | 3 |
4 files changed, 23 insertions, 4 deletions
diff --git a/src/features/workspaces/components/WorkspaceDrawer.tsx b/src/features/workspaces/components/WorkspaceDrawer.tsx index 1c827e9dd..bb97aa372 100644 --- a/src/features/workspaces/components/WorkspaceDrawer.tsx +++ b/src/features/workspaces/components/WorkspaceDrawer.tsx | |||
@@ -135,6 +135,7 @@ class WorkspaceDrawer extends Component<IProps> { | |||
135 | <div className={classes.workspaces}> | 135 | <div className={classes.workspaces}> |
136 | <WorkspaceDrawerItem | 136 | <WorkspaceDrawerItem |
137 | name={intl.formatMessage(messages.allServices)} | 137 | name={intl.formatMessage(messages.allServices)} |
138 | icon="*" | ||
138 | onClick={() => { | 139 | onClick={() => { |
139 | workspaceActions.deactivate(); | 140 | workspaceActions.deactivate(); |
140 | workspaceActions.toggleWorkspaceDrawer(); | 141 | workspaceActions.toggleWorkspaceDrawer(); |
@@ -147,6 +148,7 @@ class WorkspaceDrawer extends Component<IProps> { | |||
147 | <WorkspaceDrawerItem | 148 | <WorkspaceDrawerItem |
148 | key={workspace.id} | 149 | key={workspace.id} |
149 | name={workspace.name} | 150 | name={workspace.name} |
151 | icon={(workspace.name || ' ').slice(0, 1)} | ||
150 | isActive={actualWorkspace === workspace} | 152 | isActive={actualWorkspace === workspace} |
151 | onClick={() => { | 153 | onClick={() => { |
152 | if (actualWorkspace === workspace) { | 154 | if (actualWorkspace === workspace) { |
diff --git a/src/features/workspaces/components/WorkspaceDrawerItem.tsx b/src/features/workspaces/components/WorkspaceDrawerItem.tsx index 172b4192c..d9aeec2f0 100644 --- a/src/features/workspaces/components/WorkspaceDrawerItem.tsx +++ b/src/features/workspaces/components/WorkspaceDrawerItem.tsx | |||
@@ -45,6 +45,14 @@ const styles = theme => ({ | |||
45 | backgroundColor: theme.workspaces.drawer.listItem.activeBackground, | 45 | backgroundColor: theme.workspaces.drawer.listItem.activeBackground, |
46 | }, | 46 | }, |
47 | }, | 47 | }, |
48 | icon: { | ||
49 | fontSize: 'x-large', | ||
50 | borderColor: 'red', | ||
51 | borderStyle: 'double', | ||
52 | borderWidth: 'medium', | ||
53 | padding: '0 6px', | ||
54 | marginRight: '6px', | ||
55 | }, | ||
48 | name: { | 56 | name: { |
49 | marginTop: '4px', | 57 | marginTop: '4px', |
50 | color: theme.workspaces.drawer.listItem.name.color, | 58 | color: theme.workspaces.drawer.listItem.name.color, |
@@ -70,6 +78,7 @@ const styles = theme => ({ | |||
70 | interface IProps extends WithStylesProps<typeof styles>, WrappedComponentProps { | 78 | interface IProps extends WithStylesProps<typeof styles>, WrappedComponentProps { |
71 | isActive: boolean; | 79 | isActive: boolean; |
72 | name: string; | 80 | name: string; |
81 | icon: string; | ||
73 | onClick: MouseEventHandler<HTMLInputElement>; | 82 | onClick: MouseEventHandler<HTMLInputElement>; |
74 | services: string[]; | 83 | services: string[]; |
75 | onContextMenuEditClick?: () => void | null; | 84 | onContextMenuEditClick?: () => void | null; |
@@ -83,6 +92,7 @@ class WorkspaceDrawerItem extends Component<IProps> { | |||
83 | classes, | 92 | classes, |
84 | isActive, | 93 | isActive, |
85 | name, | 94 | name, |
95 | icon, | ||
86 | onClick, | 96 | onClick, |
87 | onContextMenuEditClick = null, | 97 | onContextMenuEditClick = null, |
88 | services, | 98 | services, |
@@ -127,6 +137,14 @@ class WorkspaceDrawerItem extends Component<IProps> { | |||
127 | > | 137 | > |
128 | <span | 138 | <span |
129 | className={classnames([ | 139 | className={classnames([ |
140 | classes.icon, | ||
141 | isActive ? classes.activeName : null, | ||
142 | ])} | ||
143 | > | ||
144 | {icon} | ||
145 | </span> | ||
146 | <span | ||
147 | className={classnames([ | ||
130 | classes.name, | 148 | classes.name, |
131 | isActive ? classes.activeName : null, | 149 | isActive ? classes.activeName : null, |
132 | ])} | 150 | ])} |
diff --git a/src/styles/tabs.scss b/src/styles/tabs.scss index 21a5e76ce..a0081c03d 100644 --- a/src/styles/tabs.scss +++ b/src/styles/tabs.scss | |||
@@ -54,7 +54,7 @@ | |||
54 | } | 54 | } |
55 | } | 55 | } |
56 | 56 | ||
57 | &.is-label-enabled{ | 57 | &.is-label-enabled { |
58 | height: min-content; | 58 | height: min-content; |
59 | overflow: hidden; | 59 | overflow: hidden; |
60 | padding-top: 8px; | 60 | padding-top: 8px; |
@@ -149,7 +149,7 @@ | |||
149 | z-index: 99999; | 149 | z-index: 99999; |
150 | } | 150 | } |
151 | 151 | ||
152 | .tab-item__error-icon{ | 152 | .tab-item__error-icon { |
153 | font-size: 1.9em; | 153 | font-size: 1.9em; |
154 | color: red; | 154 | color: red; |
155 | position: absolute; | 155 | position: absolute; |
diff --git a/src/styles/vertical.scss b/src/styles/vertical.scss index dd2ae4ed1..3f67e47e8 100644 --- a/src/styles/vertical.scss +++ b/src/styles/vertical.scss | |||
@@ -32,7 +32,6 @@ $tabitem-bias: 30px; | |||
32 | flex-direction: row; | 32 | flex-direction: row; |
33 | 33 | ||
34 | .tab-item { | 34 | .tab-item { |
35 | |||
36 | &.is-active { | 35 | &.is-active { |
37 | border-left-width: 0px !important; | 36 | border-left-width: 0px !important; |
38 | border-top-width: 4px; | 37 | border-top-width: 4px; |
@@ -61,7 +60,7 @@ $tabitem-bias: 30px; | |||
61 | } | 60 | } |
62 | } | 61 | } |
63 | } | 62 | } |
64 | div{ | 63 | div { |
65 | overflow: hidden !important; | 64 | overflow: hidden !important; |
66 | } | 65 | } |
67 | 66 | ||