Merge pull request #168 from medyo/MustCodeAl-master

Improve the phind integration

Author: medyo

src/assets/App.css

@@ -413,10 +413,6 @@ a {
 .dark .blockHeaderWhite {
   color: white;
 }
-.dark .SELogo {
-  fill: white;
-}
-
 
 .light .blockHeaderWhite {
   color: black;

src/assets/baidu_logo.svg

@@ -16,3 +16,7 @@
   width: 100%;
   height: 100%;
 }
+
+.dark .searchEngineLogo .themeAdaptiveFillColor {
+  fill: white;
+}

src/components/Elements/SearchBarWithLogo/SearchBarWithLogo.css

@@ -11,9 +11,9 @@ export const SearchBarWithLogo = () => {
 
   return (
     <div className="searchBarWithLogo">
-      {userSearchEngine && userSearchEngine.logo && (
+      {userSearchEngine?.logo && (
         <div className="searchEngineLogo">
-          <userSearchEngine.logo />
+          <userSearchEngine.logo className={userSearchEngine?.className} />
         </div>
       )}
       <SearchBar />

src/components/Elements/SearchBarWithLogo/SearchBarWithLogo.tsx

@@ -8,10 +8,10 @@ import { ReactComponent as DuckDuckGoLogo } from 'src/assets/duckduckgo_logo.svg
 import { ReactComponent as GoogleLogo } from 'src/assets/google_logo.svg'
 import HashNodeIcon from 'src/assets/icon_hashnode.png'
 import LobstersIcon from 'src/assets/icon_lobsters.png'
+import { ReactComponent as PhindLogo } from 'src/assets/phind_logo.svg'
 import { ReactComponent as StartPageLogo } from 'src/assets/startpage_logo.svg'
 import { ReactComponent as YahooLogo } from 'src/assets/yahoo_logo.svg'
 import { ReactComponent as YandexLogo } from 'src/assets/yandex_logo.svg'
-import { ReactComponent as PhindLogo } from 'src/assets/phind_logo.svg'
 
 import {
   ConferencesCard,
@@ -75,6 +75,7 @@ export const SUPPORTED_SEARCH_ENGINES = [
     label: 'Yandex',
     url: 'https://yandex.ru/search/?text=',
     logo: YandexLogo,
+    className: 'themeAdaptiveFillColor',
   },
   {
     label: 'Startpage',
@@ -84,7 +85,8 @@ export const SUPPORTED_SEARCH_ENGINES = [
   {
     label: 'Phind',
     url: 'https://phind.com/search?q=',
-    logo: <PhindLogo className={"SELogo"} />,
+    logo: PhindLogo,
+    className: 'themeAdaptiveFillColor',
   },
 ]
 export const SUPPORTED_CARDS: SupportedCardType[] = [