fix: add hover effect to search dropdown, custom support etc

src/components/modals/main/settings/sections/Keybinds.jsx

@@ -45,7 +45,7 @@ export default class KeybindSettings extends PureComponent {
   }
 
   reset(type) {
-    let keybinds = this.state.keybinds;
+    const keybinds = this.state.keybinds;
     keybinds[type] = '';
     localStorage.setItem('keybinds', JSON.stringify(keybinds));
     this.setState({

src/components/widgets/search/Search.jsx

@@ -130,7 +130,7 @@ export default class Search extends PureComponent {
     }
   }
 
-  setSearch(name) {
+  setSearch(name, custom) {
     let url;
     let query = 'q';
     const info = searchEngines.find((i) => i.name === name);
@@ -142,6 +142,10 @@ export default class Search extends PureComponent {
       }
     }
 
+    if (custom) {
+      url = localStorage.getItem('customSearchEngine');
+    }
+
     this.setState({
       url: url,
       query: query,
@@ -165,23 +169,27 @@ export default class Search extends PureComponent {
   }
 
   render() {
+    const customText = window.language.modals.main.settings.sections.search.custom.split(' ')[0];
+
     return (
       <form onSubmit={this.searchButton} className='searchBar'>
         {localStorage.getItem('searchDropdown') === 'true' ? 
         <div className='searchDropdown'>
           <span className='searchSelected' onClick={() => this.toggleDropdown()}>{this.state.currentSearch}</span>
-          <div className='searchOptions' style={{ display: this.state.searchDropdown }}>
+          <div style={{ display: this.state.searchDropdown }}>
             {searchEngines.map((engine) => {
               if (engine.name === this.state.currentSearch) {
                 return null;
               }
+
               return (
                 <>
-                  <span className='searchSelected' onClick={() => this.setSearch(engine.name)}>{engine.name}</span>
+                  <span className='searchDropdownList' onClick={() => this.setSearch(engine.name)}>{engine.name}</span>
                   <br/>
                 </>
               );
             })}
+            {this.state.currentSearch !== customText ? <span className='searchDropdownList' onClick={() => this.setSearch(customText, 'custom')}>{customText}</span> : null}
           </div>
         </div> : null}
         {this.state.microphone}

src/components/widgets/search/search.scss

@@ -56,6 +56,14 @@
   .searchSelected {
     cursor: pointer;
   }
+
+  .searchDropdownList {
+    cursor: pointer;
+    
+    &:hover {
+      color: rgb(211, 211, 211);
+    }
+  }
 }
 
 .micIcon {