diff --git a/client/src/components/MenuItem.js b/client/src/components/MenuItem.js
index 4b3d0e82f..97921f8d2 100644
--- a/client/src/components/MenuItem.js
+++ b/client/src/components/MenuItem.js
@@ -143,6 +143,7 @@ export default class MenuItem extends AbstractPureComponent2 {
textClassName,
tagName = "a",
dropdownType,
+ caretIconSize = 16,
...htmlProps
} = this.props;
const hasSubmenu = children != null;
@@ -181,7 +182,7 @@ export default class MenuItem extends AbstractPureComponent2 {
{text}
,
this.maybeRenderLabel(labelElement),
- hasSubmenu ? : undefined,
+ hasSubmenu ? : undefined,
);
const liClasses = classNames({ [Classes.MENU_SUBMENU]: hasSubmenu });
diff --git a/client/src/components/Sidebar/SidebarContainer.js b/client/src/components/Sidebar/SidebarContainer.js
index f9d2df228..77c0c670f 100644
--- a/client/src/components/Sidebar/SidebarContainer.js
+++ b/client/src/components/Sidebar/SidebarContainer.js
@@ -3,7 +3,9 @@ import React from 'react';
export default function SidebarContainer(props) {
return (
)
}
\ No newline at end of file
diff --git a/client/src/components/Sidebar/SidebarMenu.js b/client/src/components/Sidebar/SidebarMenu.js
index 9d0d4a86b..9d78bc8fb 100644
--- a/client/src/components/Sidebar/SidebarMenu.js
+++ b/client/src/components/Sidebar/SidebarMenu.js
@@ -23,6 +23,7 @@ export default function SidebarMenu() {
disabled={item.disabled}
children={children}
dropdownType={item.dropdownType || 'collapse'}
+ caretIconSize={15}
onClick={() => {
if (item.href) {
history.push(item.href);
diff --git a/client/src/style/views/Sidebar.scss b/client/src/style/views/Sidebar.scss
index 5605e8a09..d9d40edd6 100644
--- a/client/src/style/views/Sidebar.scss
+++ b/client/src/style/views/Sidebar.scss
@@ -11,6 +11,13 @@ $sidebar-popover-submenu-bg: rgb(1, 20, 62);
color: $sidebar-text-color;
width: $sidebar-width;
+ &__inner{
+ overflow-y: scroll;
+ overflow-x: hidden;
+ height: 100%;
+ }
+
+
&__head{
padding: 16px 10px;
@@ -33,6 +40,7 @@ $sidebar-popover-submenu-bg: rgb(1, 20, 62);
padding: 0;
min-width: $sidebar-width;
border-radius: 0;
+ padding-bottom: 2rem;
.#{$ns}-menu-item{
color: $sidebar-menu-item-color;
@@ -56,37 +64,33 @@ $sidebar-popover-submenu-bg: rgb(1, 20, 62);
}
> .#{$ns}-icon-caret-right{
- margin-right: -2px;
- margin-top: 2px;
- color: #767B9B;
+ margin-right: -4px;
+ margin-top: 3px;
+ color: #5B5F7B;
}
}
.#{$ns}-submenu{
- .#{$ns}-menu{
- padding: 10px 0;
- margin: 0;
- background: $sidebar-popover-submenu-bg;
- border-radius: 0;
+ .#{$ns}-collapse{
- &-item{
- padding-top: 7px;
- padding-bottom: 7px;
- padding-left: 16px;
- padding-right: 16px;
- font-size: 14px;
+ &-body{
+ background-color: rgb(11, 34, 85);
+ padding-bottom: 6px;
+ padding-top: 6px;
+ }
- &,
- &:hover,
- &:active,
- &:focus{
- color: #fff;
+ .#{$ns}-menu-item{
+ padding: 7px 16px 7px 18px;
+ font-size: 15px;
+ color: #C5CBE3;
+
+ &:hover{
background: transparent;
+ color: #fff;
}
}
}
-
.#{$ns}-popover{
padding: 0;
@@ -100,8 +104,8 @@ $sidebar-popover-submenu-bg: rgb(1, 20, 62);
}
.#{$ns}-menu-divider{
border-top-color: #183C86;
- margin-left: 0;
- margin-right: 0;
+ color: #6B708C;
+ margin: 4px 0;
}
}
}
\ No newline at end of file