diff --git a/client/app/components/SettingsWrapper.jsx b/client/app/components/SettingsWrapper.jsx
index 592dd6fff8..435aae0223 100644
--- 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
new file mode 100644
index 0000000000..5f5dc12192
--- /dev/null
+++ 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;
+      }
+    }
+  }
+}
\ No newline at end of file