Use black instead of blue color for active item

yangyinchun · Oct 31, 2019 · 0e4ecec · 0e4ecec
1 parent f45bbf4
commit 0e4ecec
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 1 deletion.
diff --git a/client/app/components/SettingsWrapper.jsx b/client/app/components/SettingsWrapper.jsx
@@ -4,6 +4,7 @@ import { PageHeader } from '@/components/PageHeader';
 import { $location } from '@/services/ng';
 import settingsMenu from '@/services/settingsMenu';
 
+import './SettingsWrapper.less';
 
 function wrapSettingsTab(options, WrappedComponent) {
   if (options) {
@@ -17,7 +18,7 @@ function wrapSettingsTab(options, WrappedComponent) {
         <div className="container">
           <PageHeader title="Settings" />
           <div className="bg-white tiled">
-            <Menu selectedKeys={[activeItem && activeItem.title]} mode="horizontal">
+            <Menu selectedKeys={[activeItem && activeItem.title]} selectable={false} mode="horizontal">
               {settingsMenu.items.map(item => (
                 <Menu.Item key={item.title}><a href={item.path}>{item.title}</a></Menu.Item>
               ))}

diff --git a/client/app/components/SettingsWrapper.less b/client/app/components/SettingsWrapper.less
@@ -0,0 +1,17 @@
+@import '~antd/lib/menu/style/index';
+
+.settings-screen {
+  .@{menu-prefix-cls} {
+    &-item > a:hover {
+      color: black !important;
+    }
+
+    &-item-selected {
+      color: black !important;
+      > a,
+      > a:hover {
+        color: black !important;
+      }
+    }
+  }
+}