README.org: ico add

README.org

@@ -1,4 +1,6 @@
 * Engine Switcher
+[[img/icon.png]]
+
 A WebExtension to switch current page between various search engines in just one click (or =Ctrl+Alt+N=), if you are too lazy to type =!b=, =!g= (especially on mobile) in DuckDuckGo.
 
 So you can easily keep your privacy as possible as you can.

src/common.ts

@@ -374,18 +374,18 @@ export const ALL_ENGINES: SearchEngine[] = [
     },
     {
         id: 'enwiki',
-        name: 'English Wikipedia (Not recommended)',
+        name: '🧪 Wikipedia (English)',
         hostname: 'en.wikipedia.org',
         queryKey: 'search',
         queryUrl: 'https://en.wikipedia.org/w/index.php?search={}&title=Special:Search&fulltext=1&ns0=1',
         queryNeedContentScript: false,
         iconUrl: browser.runtime.getURL('img/engines/wikipedia.svg'),
         privacyInfo: {
-            collectData: CollectData.Yes,
+            collectData: CollectData.No,  // https://foundation.wikimedia.org/wiki/Policy:Wikipedia_15_Privacy_Policy "Generally, we keep personal, nonpublic information about you confidential. We do not sell or rent your nonpublic information, nor do we give it to others to sell you anything. However, there are a few specific circumstances where we are permitted to share your information.""
             jurisdiction: '🇺🇸 United States',
             resultsSources: ['__own__'],
             since: 2001,
-            summary: "Not a general-purposed search engine though, but a user want this feature and send a PR."
+            summary: "(🧪 Experimental) Everyone knows what this is, but not recommended to use here because this is not a general-purposed search engine and may be not practical, but a user want this feature and sent a PR."
         },
     },
 ]

src/content.ts

@@ -166,6 +166,8 @@ async function setupFloatBar() {
     #engineSwitcherBar {
         --bg: #ffffff;
         --bgActive: #eeeeee;
+        --bgHover: #eeeeee;
+        --activeIndicator: #5599ff;
         --fg: #333333;
         --bd: #cccccc;
         display: flex;
@@ -196,6 +198,9 @@ async function setupFloatBar() {
     #engineSwitcherBar a:hover {
         background: var(--bgActive);
     }
+    #engineSwitcherBar .active {
+        border-bottom: 3px solid var(--activeIndicator);
+    }
     #engineSwitcherBar a .iconImg {
         width: ${ICON_SIZE}px;
         min-width: ${ICON_SIZE}px;
@@ -207,6 +212,21 @@ async function setupFloatBar() {
     body {
         padding-bottom: ${ICON_SIZE}px;
     }
+
+    @media(prefers-color-scheme: dark) {
+        #engineSwitcherBar {
+            --bg: #000;
+            --bgActive: #333333;
+            --bgHover: #eeeeee;
+            --activeIndicator: #999999;
+            --fg: #666666;
+            --bd: #666666;
+        }
+        #engineSwitcherBar img[src$='wikipedia.svg'],
+        #engineSwitcherBar a.closeBtn svg {
+            filter: invert(100%);
+        }
+    }
     `
     const floatEl = document.createElement('div')
     floatEl.id = 'engineSwitcherBar'