Update README.md

namespace animations to avoid conflicts

README.md

@@ -1,59 +1,90 @@
-# FediAct (v0.9.5)
-A Chrome/Firefox extension that simplifies following and post interactions on other Mastodon instances than your own.
+> **Note**  
+> LOOKING FOR AN ACTIVE MAINTAINER TO TAKE CARE OF THIS PROJECT!  
+> FediAct requires some major updates/rewriting to resolve issues, increase performance/reliability and to be easier to maintain, for which I do not have time currently. Please leave a message/issue.
+
+# FediAct (v0.9.8)
+A Chrome/Firefox extension that simplifies follow and post interactions on Mastodon servers other than your own.
 
 **Features**:
-- Supports Mastodon v3 + v4
-- Follow, boost, bookmark, reply and favourite on external instances while only being logged in to your home instance
-- Show following status and toot status (boosted, faved, bookmarked) on external instances
-- Single click to execute action only, double click to redirect to content on home instance
-- Reply button on external instances always redirects to home instance and enters reply-mode
-- Hide muted content on external instances if enabled
-- Customizable
-
-**Supported browsers**:
-- All up-to-date Chromium browsers, including Kiwi browser on Android
-- Up-to-date Firefox, including Firefox Nightly on Android
-
-**Important notes**:
-- All data is processed locally only
-- Performance depends on the performance (and rate limiting) of your home instance and to some degree of the external instance you are browsing (read more [below](#additional-notes))
-- Some toots cannot be resolved to your home (in cases where searching the post manually would also not work)
+- Supports Mastodon v3 + v4 (some features v4 only)
+- Follow, boost, bookmark, reply, fav, vote polls and mute/block on external servers while only being logged in to your home server
+- Show following state and toot state (boosted, faved, bookmarked, voted) on external servers
+- Single click to execute action only, double click to redirect to content on home server
+- Reply button on external servers always redirects to home server and enters reply-mode
+- Hide muted content on external servers if enabled
+- Needs nothing more than your home server domain to work
 
 ## Navigation
-  * [Installation](#installation)
-  * [Setup](#setup)
-  * [Screenshots / GIFs](#screenshots--gifs)
-  * [Manual installation](#manual-installation)
-      * [Install in Firefox for Android](#install-in-firefox-for-android)
-  * [Additional notes](#additional-notes)
-  * [Todos / Planned features](#todos--planned-features)
+- [Installation](#installation)
+- [Setup](#setup)
+- [FAQ](#faq)
+- [Screenshots / GIFs](#screenshots--gifs)
+- [Manual installation](#manual-installation)
+  - [Install in Firefox for Android](#install-in-firefox-for-android)
+- [Additional notes](#additional-notes)
+- [Todos / Planned features](#todos--planned-features)
+- [Contributing](#contributing)
 
 ## Installation
 
 [link-chrome]: https://chrome.google.com/webstore/detail/fediact/lmpcajpkjcclkjbliapfjfolocffednm 'Version published on Chrome Web Store'
 [link-firefox]: https://addons.mozilla.org/en-US/firefox/addon/fediact/ 'Version published on Mozilla Add-ons'
 
-[<img src="https://raw.githubusercontent.com/alrra/browser-logos/90fdf03c/src/chrome/chrome.svg" width="48" alt="Chrome" valign="middle">][link-chrome] [<img valign="middle" src="https://img.shields.io/chrome-web-store/v/lmpcajpkjcclkjbliapfjfolocffednm.svg?label=%20%20">][link-chrome] and other Chromium browsers (**currently in review** by Google)
+[<img src="https://raw.githubusercontent.com/alrra/browser-logos/90fdf03c/src/chrome/chrome.svg" width="48" alt="Chrome" valign="middle">][link-chrome] [<img valign="middle" src="https://img.shields.io/chrome-web-store/v/lmpcajpkjcclkjbliapfjfolocffednm.svg?label=%20">&nbsp;&nbsp;Chrome Webstore][link-chrome]  
+All up-to-date Chromium browsers, including Kiwi and Yandex browsers on Android
 
-[<img src="https://raw.githubusercontent.com/alrra/browser-logos/90fdf03c/src/firefox/firefox.svg" width="48" alt="Firefox" valign="middle">][link-firefox] [<img valign="middle" src="https://img.shields.io/amo/v/fediact.svg?label=%20%20">][link-firefox] including Firefox for Android
+[<img src="https://raw.githubusercontent.com/alrra/browser-logos/90fdf03c/src/firefox/firefox.svg" width="48" alt="Firefox" valign="middle">][link-firefox] [<img valign="middle" src="https://img.shields.io/amo/v/fediact.svg?label=%20%20">&nbsp;&nbsp;Mozilla Addon Store][link-firefox]  
+Up-to-date Firefox (v107+), including Firefox Nightly on Android
 
-> **Note**
-> 
-> - **If webstore release is outdated, use the [manual installation method](#manual-installation) to install the latest version**  
-> - **Special installation steps for [Firefox on Android](#install-in-firefox-for-android)**
+**Please note:**  
+- If webstore release is outdated, use the [manual installation method](#manual-installation) to install the latest version  
+- Special installation steps for [Firefox on Android](#install-in-firefox-for-android)  
+- Chrome store updates take 1-2 days longer  
+- If you like this addon, please consider donating: [paypal.me/lartsch](https://paypal.me/lartsch)
 
 ## Setup
 
-1. Make sure you are logged in to your home instance
+1. Make sure you are logged in to your home server
 2. Click the extension icon or open its settings page
-3. Set your home instance (required)
-4. Check the other settings (optional)
-5. Click the "Submit" button to save
+3. Set your home server domain (required)
+4. Check out the other settings (optional)
+5. Click the "Save" button to save
 
-**Please read the [additional notes](#additional-notes).**
+If you have set your home server correctly, you can now interact on other Mastodon servers.
+
+**Please note:**   
+- If FediAct is running, a small icon will be displayed in the bottom right corner  
+- Also, it is indicated while content is resolving or when it could not be resolved  
+- Performance depends on your home server and the external server you are browsing (read more [below](#additional-notes))  
+- Some toots can't be resolved to your home (e.g. when searching the post manually wouldn't work either)  
+- It's NOT recommended to disable the API delay (servers use rate limiting and might block your IP)
+
+## FAQ
+**Why does it need permission for all websites?**
+
+> The addon needs to determine whether or not the site you are currently browsing is a Mastodon server. For that to work, it requires access to all sites. Otherwise, each existing Mastodon server would have to be explicitly added.
+
+**Can I use this on Android?**
+
+> Yes! There are three options that I am aware of: Kiwi Browser, Yandex Browser and Firefox Nightly (see [below](#install-in-firefox-for-android))
+
+**Can I use this on iOS?**
+
+> Currently not in a reliable way, but:  
+> - It's possible that Orion Browser can soon be used (see issue [#16](https://github.com/Lartsch/FediAct/issues/16))  
+> - There are plans for Safari support (see issue [#17](https://github.com/Lartsch/FediAct/issues/17))
+
+**Can you add feature XY?**
+
+> Feel free to create an issue here on GitHub and I will look into it.
+
+**Is this safe to use?**
+
+> This project is open source. Anyone with some programming knowledge can check out the source code, either here on GitHub or by extracting the addon file from the addon stores. You can also make improvements. 
+> Considering the implementation, I am not aware of any risks. Efforts were made to prevent servers from abusing this addon to perform actions on the user's behalf. It does not require your username or password. All data is stored in your browser locally, with the API token being the only sensitive data. This token is **only** sent to your home server. No other data ever leaves your device. All requests are made from the background script, out-of-scope for websites you visit.
 
 ## Screenshots / GIFs
-v0.8.0
+v0.9.8
 <details>
   <summary>Extension popup / settings</summary>
   <img src="https://github.com/lartsch/FediAct/blob/main/img/settings.png?raw=true">
@@ -64,13 +95,13 @@ v0.8.0
 </details>
 
 ## Manual installation
-1. Download the [latest Github release](https://github.com/Lartsch/FediAct/releases/latest) for your browser (chrome or firefox)
+1. Download the [latest GitHub release](https://github.com/Lartsch/FediAct/releases/latest) for your browser (Chrome or Firefox)
 ### Chrome
 2. Unzip the downloaded file somewhere
 3. Go to your Chrome extension page (URL: chrome://extensions) and enable developer mode
 4. Click the "Load unpacked" button and then select the unzipped folder
 
-Note: Some Chromium browsers allow to directly load a .zip file - you can use it if available for you
+Note: Some Chromium browsers allow you to directly load a .zip file - you can use it if available
 
 ### Firefox
 2. Open the debugging page (URL: about:debugging)
@@ -78,14 +109,14 @@ Note: Some Chromium browsers allow to directly load a .zip file - you can use it
 4. Click the "Load Temporary Add-on" button and then select the downloaded Firefox ZIP file
 
 ### Install in Firefox for Android
-Since a while, Firefox on Android only allows a [curated list](https://addons.mozilla.org/en-US/android/search/?promoted=recommended&sort=random&type=extension) of addons to install, preventing installation of anything else. The following explanation will guide you how to install it from the webstore anyways.
+For a while now, Firefox on Android has only allowed installing from a [curated list](https://addons.mozilla.org/en-US/android/search/?promoted=recommended&sort=random&type=extension) of addons, preventing installation of anything else. The following instructions will guide you through installing it from the webstore anyway.
 
 **Requirements:**  
-- Firefox **Nightly** for Android  
+- Firefox [**Nightly**](https://play.google.com/store/apps/details?id=org.mozilla.fenix) for Android  
   
 **Steps:**  
 1. In Firefox, go to Settings > About Firefox Nightly
-2. Click the Firefox logo 5 times to enable developer options
+2. Click the Firefox logo 5 times to enable Developer options
 3. Go back to Settings > Custom Add-on Collection
 4. Enter the following data:
     - ID: 17665294
@@ -93,40 +124,33 @@ Since a while, Firefox on Android only allows a [curated list](https://addons.mo
 5. Click OK, Firefox will close - reopen it
 6. FediAct will now be available in the Add-ons menu of Firefox Nightly
 
-To update the addon instantly, simply remove and re-install it. Not sure when/if auto-update triggers in Firefox.
+To update the addon instantly, simply remove and re-install it. I don't know if or when auto-update triggers in Firefox.
   
 I included all of the default add-ons in the custom collection, so you will not miss out on any of those. Of course, you can create [your own collection](https://support.mozilla.org/en-US/kb/how-use-collections-addonsmozillaorg) as well.
 
 ## Additional notes
-1. Currently supports external Mastodon instances v3 + v4
-    - **I have not tested if Mastodon v3 works as home instance! v4 support is the main objective**
-    - Support for other Fedi software is still planned
-2. The whitelist mode can be useful if you do not want the extension to run basic checks on every site (since it needs to determine if its a Mastodon site). Not sure if blacklist is good for anything but I still included it.
-3. It can have several reasons why resolving/executing actions/redirection might not work:
-    - You're not logged in to your home instance (can't fix, log in lol)
-    - You're scrolling fast and posts are not resolved instantly (a delay is implemented to prevent 429 API errors - wait shortly and check again)
-    - Element identifiers have changed / instance uses a custom layout/flavour (identifiers need to be added / updated)
-    - The external instance you are browsing is not Mastodon (not supported yet)
-    - **Your home instance has strong rate limiting and blocks the API requests** (looking for a way to improve 429 prevention)
-    - The toot that was tried to resolve is from an original instance that is not Mastodon(-like) (not supported yet, at leat a fallback will be added)
-    - Your home instance or the original instance of a toot have defederated / are moderated in a way that affects the API search endpoint (can't fix)
-    - The instance you are browsing does not use 302 redirects for external toots (fallback will be added)
-    - Maybe it also plays a role if the toot is set to unlisted on its original instance (not sure yet)
-5. There can be short delays since external API calls have to be made
-6. If you only want redirects, simply turn off auto-action and leave redirect on - double click will then only redirect, not execute the action (alternatively, you can simply use the reply button, as it will always redirect to your home instance if redirects are enabled)
-7. If the extension fails to resolve content, the affected buttons will behave like usually
+1. Support for other Fedi software is planned
+2. There are several reasons why resolving/interacting might not work including:
+    - Not being logged in to your home server
+    - Element identifiers have changed / the server uses an unsupported flavour
+    - The external server you are browsing or the originating server of a toot is not Mastodon
+    - Your home server has strong rate limiting and limited your IP
+    - Your home server / the external server / the original server of a toot have defederated / are moderated
+    - The toot has not yet federated to your home instace (follow the account and toots should start federating)
+    - The server you are browsing does not use 302 redirects for external toots
+    - The network conditions of your home server or the external server are bad (slow speed)
+    - That a toot is set to unlisted on its original server may play a role
+3. There can be delays because API calls have to be made and it is tries to avoid error 429 (too many requests). Especially if a page has many toots or you are scrolling through a feed really fast.
+4. If the extension fails to resolve content, the affected buttons will behave as if the extension weren't active (popup modal) and a notice ("Unresolved") is added to the toot
+5. If "Collect errors" is enabled (Chrome), there can be uncatched errors being displayed for FediAct. This is not relevant to functionality.
 
 ## Todos / Planned features 
-- Fix last remaining resolve fails as far as **possible**
-- General performance and code improvements
-- Update settings in content script instantly (so no page reload is needed)
-- Improve 429 prevention and add resolving fallbacks
-- Add support for other implementations (Plemora, GNU Social, ...)
-- Find additional layouts/flavours to add identifiers for
-- Support for profiles views with follow button disabled
-- Implement caching where applicable to decrease required requests
-- If I find myself to be bored, probably more
+Check out the [GitHub project](https://github.com/users/Lartsch/projects/2) to see planned features and todos. They are sorted from most important to least important.
+
+## Contributing
+Feel free to create [issues](https://github.com/Lartsch/FediAct/issues) for bugs and feature suggestions. Even better: Create pull requests for whatever improvements you can make! :)
 
 ## Thanks to...
-@raikasdev because I stole his fix for cross-browser storage API support  
-@rosemarydotworld because I customized and use his awesome jQuery.DOMNodeAppear where MutationObservers and delegation failed
+- @raikasdev because I stole his fix for cross-browser storage API support  
+- @rosemarydotworld because I customized and use his awesome jQuery.DOMNodeAppear where MutationObservers and delegation failed
+- All the direct [contributors](https://github.com/Lartsch/FediAct/graphs/contributors) to this repository!

firefox/manifest.json

@@ -1,7 +1,7 @@
 {
   "name": "FediAct",
-  "version": "0.9.5.2",
-  "description": "Simplifies interactions on other Mastodon instances than your own. Visit https://github.com/lartsch/FediFollow-Chrome for more.",
+  "version": "0.9.8.7",
+  "description": "Simplifies interactions on other Mastodon instances than your own. Visit https://github.com/lartsch/FediAct for more.",
   "manifest_version": 2,
   "content_scripts": [
     {
@@ -13,7 +13,7 @@
         "src/inject.min.js"
       ],
       "css": [
-        "src/nodeinserted.min.css"
+        "src/content_styles.min.css"
       ],
       "run_at": "document_start"
     }
@@ -37,7 +37,7 @@
   "browser_action": {
     "default_popup": "src/popup.html",
     "default_icon": "src/icon/48.png",
-    "default_title": "FediFollow settings"
+    "default_title": "FediAct settings"
   },
   "icons": {
     "48": "src/icon/48.png"

manifest.json

@@ -1,7 +1,7 @@
 {
   "name": "FediAct",
-  "version": "0.9.5.2",
-  "description": "Simplifies interactions on other Mastodon instances than your own. Visit https://github.com/lartsch/FediFollow-Chrome for more.",
+  "version": "0.9.8.7",
+  "description": "Simplifies interactions on other Mastodon instances than your own. Visit https://github.com/lartsch/FediAct for more.",
   "manifest_version": 3,
   "content_scripts": [
     {
@@ -13,7 +13,7 @@
         "src/inject.min.js"
       ],
       "css": [
-        "src/nodeinserted.min.css"
+        "src/content_styles.min.css"
       ],
       "run_at": "document_start"
     }
@@ -36,9 +36,9 @@
   "action": {
     "default_popup": "src/popup.html",
     "default_icon": "src/icon/48.png",
-    "default_title": "FediFollow settings"
+    "default_title": "FediAct settings"
   },
   "icons": {
     "48": "src/icon/48.png"
   }
-}
+}

pack.sh

@@ -1,5 +1,6 @@
 # RUN FROM MAIN DIR
 # USE ./pack.sh <VERSION>
+# NOTE: requires uglifyjs and uglifycss in PATH
 
 # remove all minified files (excluding lib folder) and zip files
 find . -type d -name lib -prune -o -type f -name "*.min.js" -o -type f -name "*.min.css" -o -type f -name "*.zip" | grep -v "/lib" | tr '\n' '\0' | xargs -r0 rm
@@ -8,5 +9,5 @@ find . -type d -name lib -prune -o -type f -name "*.js" -exec bash -c 'uglifyjs
 # minify all css files, excluding lib folder
 find . -type d -name lib -prune -o -type f -name "*.css" -exec bash -c 'uglifycss $1 > "$(echo $1 | rev | cut -f 2- -d '.' | rev).min.css"' _ {} \;
 # zip release files
-zip -r "fediact-$1-chrome.zip" ./ -x "firefox/*" -x "img/*" -x ".git/*" -x "README.md" -x "NOTES.md" -x ".gitignore" -x "pack.sh" -x "LICENSE" -x "src/background.js" -x "src/inject.js" -x "src/popup.js" -x "src/nodeinserted.css" 1>/dev/null
-cd firefox && zip -r "../fediact-$1-firefox.zip" ./ -x "src/background.js" -x "src/inject.js" -x "src/popup.js" -x "src/nodeinserted.css" 1>/dev/null
+zip -r "fediact-$1-chrome.zip" ./ -x "firefox/*" -x "img/*" -x ".git/*" -x "README.md" -x "NOTES.md" -x ".gitignore" -x "pack.sh" -x "LICENSE" -x "src/background.js" -x "src/inject.js" -x "src/popup.js" -x "src/content_styles.css" -x "src/popup_styles.css" 1>/dev/null
+cd firefox && zip -r "../fediact-$1-firefox.zip" ./ -x "src/background.js" -x "src/inject.js" -x "src/popup.js" -x "src/content_styles.css" -x "src/popup_styles.css" 1>/dev/null

src/background.js

@@ -1,18 +1,16 @@
 var browser, chrome, settings
-const enableConsoleLog = true
+const enableConsoleLog = false
 const logPrepend = "[FediAct]"
 const tokenInterval = 1 // minutes
 const mutesApi = "/api/v1/mutes"
 const blocksApi = "/api/v1/blocks"
 const domainBlocksApi = "/api/v1/domain_blocks"
-
+const timeout = 15000
 const tokenRegex = /"access_token":".*?",/gm
-
 // required settings keys with defauls
 const settingsDefaults = {
 	fediact_homeinstance: null,
-    fediact_showfollows: true,
-    fediact_hidemuted: false,
+    fediact_token: null
 }
 
 // wrapper to prepend to log messages
@@ -23,10 +21,16 @@ function log(text) {
 }
 
 // get redirect url (it will be the url on the toot authors home instance)
-async function resolveToot(url) {
+async function resolveExternalTootHome(url) {
     return new Promise(async function(resolve) {
         try {
-            var res = await fetch(url, {method: 'HEAD'})
+            const controller = new AbortController()
+            const timeoutId = setTimeout(() => {
+                log("Timed out")
+                controller.abort()
+            }, timeout)
+            var res = await fetch(url, {method: 'HEAD', signal: controller.signal})
+            clearTimeout(timeoutId)
             if (res.redirected) {
                 resolve(res.url)
             } else {
@@ -39,6 +43,60 @@ async function resolveToot(url) {
     })
 }
 
+// get redirect url (it will be the url on the toot authors home instance)
+async function generalRequest(data) {
+    return new Promise(async function(resolve) {
+        try {
+            const controller = new AbortController()
+            const timeoutId = setTimeout(() => {
+                log("Timed out")
+                controller.abort()
+            }, timeout)
+            if (data[3]) {
+                // json body provided, post as body to target
+                data[2]["User-Agent"] = "FediAct Service"
+                data[2]["Content-Type"] = "application/json"
+                var res = await fetch(data[1], {
+                    method: data[0],
+                    signal: controller.signal,
+                    // if json body is provided, there is also header data
+                    headers: data[2],
+                    body: JSON.stringify(data[3])
+                })
+            } else if (data[2]) {
+                // header data provided
+                data[2]["User-Agent"] = "FediAct Service"
+                var res = await fetch(data[1], {
+                    method: data[0],
+                    signal: controller.signal,
+                    headers: data[2]
+                })
+            } else {
+                var res = await fetch(data[1], {
+                    method: data[0],
+                    signal: controller.signal,
+                    headers: {"User-Agent": "FediAct Service"}
+                })
+            }
+            clearTimeout(timeoutId)
+            if (res.status  >= 200 && res.status < 300 ) {
+                const contentType = res.headers.get("content-type")
+                if (contentType && contentType.indexOf("application/json") !== -1) {
+                    var restext = await res.text()
+                    resolve(restext)
+                } else {
+                    resolve(false)
+                }
+            } else {
+                resolve(false)
+            }
+        } catch(e) {
+            log(e)
+            resolve(false)
+        }
+    })
+}
+
 // fetch API token here (will use logged in session automatically)
 async function fetchBearerToken() {
     return new Promise(async function(resolve) {
@@ -76,60 +134,63 @@ async function fetchBearerToken() {
     })
 }
 
-// grab all accounts that are muted by the user
-async function fetchMutesAndBlocks() {
+// grab all accounts/instances that are muted/blocked by the user
+// this is only done here in the bg script so we have data available on load of pages without first performing 3 (!) requests
+// otherwise this would lead to problems with element detection / low performance (espcially v3 instances)
+// mutes/blocks are updated in content script on page context changes and after performing mutes/block actions
+function fetchMutesAndBlocks() {
     return new Promise(async function(resolve) {
-        if (settings.fediact_hidemuted) {
+        try {
             // set empty initially
-            [settings.fediact_mutesblocks, settings.fediact_domainblocks] = [[],[]]
+            [settings.fediact_mutes, settings.fediact_blocks, settings.fediact_domainblocks] = [[],[],[]]
             var [mutes, blocks, domainblocks] = await Promise.all([
                 fetch("https://" + settings.fediact_homeinstance + mutesApi, {headers: {"Authorization": "Bearer "+settings.fediact_token}}).then((response) => response.json()),
                 fetch("https://" + settings.fediact_homeinstance + blocksApi, {headers: {"Authorization": "Bearer "+settings.fediact_token}}).then((response) => response.json()),
                 fetch("https://" + settings.fediact_homeinstance + domainBlocksApi, {headers: {"Authorization": "Bearer "+settings.fediact_token}}).then((response) => response.json())
             ])
             if (mutes.length) {
-                settings.fediact_mutesblocks.push(...mutes.map(acc => acc.acct))
+                settings.fediact_mutes.push(...mutes.map(acc => acc.acct))
             }
             if (blocks.length) {
-                settings.fediact_mutesblocks.push(...blocks.map(acc => acc.acct))
+                settings.fediact_blocks.push(...blocks.map(acc => acc.acct))
             }
-            // filter duplicates
-            settings.fediact_mutesblocks = settings.fediact_mutesblocks.filter((element, index) => {
-                return (settings.fediact_mutesblocks.indexOf(element) == index)
-            })
             if (domainblocks.length) {
                 settings.fediact_domainblocks = domainblocks
             }
             resolve(true)
-        } else {
-            resolve(true)
+        } catch {
+            resolve(false)
         }
     })
 }
 
-async function fetchData() {
+async function fetchData(token, mutesblocks) {
     return new Promise(async function(resolve) {
+        var resolved = false
         try {
             settings = await (browser || chrome).storage.local.get(settingsDefaults)
+            if (settings.fediact_homeinstance) {
+                if (token || mutesblocks) {
+                    if (token || !(settings.fediact_token)) {
+                        await fetchBearerToken()
+                    }
+                    if (mutesblocks) {
+                        await fetchMutesAndBlocks()
+                    }
+                    try {
+                        await (browser || chrome).storage.local.set(settings)
+                        resolved = true
+                    } catch {
+                        log(e)
+                    }
+                }
+            } else {
+                log("Home instance not set")
+            }
         } catch(e) {
             log(e)
-            resolve(false)
-            return
-        }
-        if (settings.fediact_homeinstance) {
-            await fetchBearerToken()
-            await fetchMutesAndBlocks()
-        } else {
-            log("Home instance not set")
-            resolve(false)
-            return
-        }
-        try {
-            await (browser || chrome).storage.local.set(settings)
-            resolve(true)
-        } catch {
-            log(e)
         }
+        resolve(resolved)
     })
 }
 
@@ -147,21 +208,30 @@ async function reloadListeningScripts() {
 }
 
 // fetch api token right after install (mostly for debugging, when the ext. is reloaded)
-chrome.runtime.onInstalled.addListener(fetchData)
+chrome.runtime.onInstalled.addListener(function(){fetchData(true, true)})
 // and also every 3 minutes
 chrome.alarms.create('refresh', { periodInMinutes: tokenInterval })
-chrome.alarms.onAlarm.addListener(fetchData)
+chrome.alarms.onAlarm.addListener(function(){fetchData(true, true)})
 
 // different listeners for inter-script communication
 chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
     // the content script gave us an url to perform a 302 redirect with
-    if(request.url) {
-        resolveToot(request.url).then(sendResponse)
+    if(request.externaltoot) {
+        resolveExternalTootHome(request.externaltoot).then(sendResponse)
+        return true
+    }
+    // the content script gave us an url to perform a 302 redirect with
+    if(request.requestdata) {
+        generalRequest(request.requestdata).then(sendResponse)
         return true
     }
     // immediately fetch api token after settings are updated
     if (request.updatedsettings) {
-        fetchData().then(reloadListeningScripts)
+        fetchData(true, true).then(reloadListeningScripts)
+        return true
+    }
+    if (request.updatemutedblocked) {
+        fetchData(false, true).then(sendResponse)
         return true
     }
     // when the content script starts to process on a site, listen for tab changes (url)

src/background.min.js

@@ -1 +1 @@
-var browser,chrome,c;const t=!0,a="[FediAct]",n=1,i="/api/v1/mutes",s="/api/v1/blocks",o="/api/v1/domain_blocks",r=/"access_token":".*?",/gm,d={fediact_homeinstance:null,fediact_showfollows:!0,fediact_hidemuted:!1};function f(e){t&&console.log(a+" "+e)}async function u(a){return new Promise(async function(t){try{var e=await fetch(a,{method:"HEAD"});e.redirected?t(e.url):t(!1)}catch(e){f(e),t(!1)}})}async function h(){return new Promise(async function(t){var e="https://"+c.fediact_homeinstance;try{var a=await(await fetch(e)).text()}catch(e){return f(e),void t(!1)}if(a){e=a.match(r);if(e){var a=e[0].search(/"access_token":"/),n=e[0].search(/",/);if(-1<a&&-1<n){e=e[0].substring(a+=16,n);if(16<e.length)return c.fediact_token=e,void t(!0)}}}c.fediact_token=null,f("Token could not be found."),t(!1)})}async function l(){return new Promise(async function(e){var t,a,n;c.fediact_hidemuted&&([c.fediact_mutesblocks,c.fediact_domainblocks]=[[],[]],[t,a,n]=await Promise.all([fetch("https://"+c.fediact_homeinstance+i,{headers:{Authorization:"Bearer "+c.fediact_token}}).then(e=>e.json()),fetch("https://"+c.fediact_homeinstance+s,{headers:{Authorization:"Bearer "+c.fediact_token}}).then(e=>e.json()),fetch("https://"+c.fediact_homeinstance+o,{headers:{Authorization:"Bearer "+c.fediact_token}}).then(e=>e.json())]),t.length&&c.fediact_mutesblocks.push(...t.map(e=>e.acct)),a.length&&c.fediact_mutesblocks.push(...a.map(e=>e.acct)),c.fediact_mutesblocks=c.fediact_mutesblocks.filter((e,t)=>c.fediact_mutesblocks.indexOf(e)==t),n.length)&&(c.fediact_domainblocks=n),e(!0)})}async function m(){return new Promise(async function(t){try{c=await(browser||chrome).storage.local.get(d)}catch(e){return f(e),void t(!1)}if(c.fediact_homeinstance){await h(),await l();try{await(browser||chrome).storage.local.set(c),t(!0)}catch{f(e)}}else f("Home instance not set"),t(!1)})}async function _(){chrome.tabs.query({},async function(e){for(var t=0;t<e.length;++t)try{chrome.tabs.sendMessage(e[t].id,{updatedfedisettings:!0})}catch(e){continue}})}chrome.runtime.onInstalled.addListener(m),chrome.alarms.create("refresh",{periodInMinutes:n}),chrome.alarms.onAlarm.addListener(m),chrome.runtime.onMessage.addListener((e,n,t)=>e.url?(u(e.url).then(t),!0):e.updatedsettings?(m().then(_),!0):void(e.running&&chrome.tabs.onUpdated.addListener(async function(e,t,a){if(e===n.tab.id&&t.url)try{await chrome.tabs.sendMessage(e,{urlchanged:t.url})}catch(e){f(e)}})));
+var browser,chrome,c;const a=!1,n="[FediAct]",t=1,i="/api/v1/mutes",s="/api/v1/blocks",o="/api/v1/domain_blocks",r=15e3,d=/"access_token":".*?",/gm,u={fediact_homeinstance:null,fediact_token:null};function h(t){a&&console.log(n+" "+t)}async function f(i){return new Promise(async function(e){try{const n=new AbortController;var t=setTimeout(()=>{h("Timed out"),n.abort()},r),a=await fetch(i,{method:"HEAD",signal:n.signal});clearTimeout(t),a.redirected?e(a.url):e(!1)}catch(t){h(t),e(!1)}})}async function l(c){return new Promise(async function(e){try{const i=new AbortController;var t,a,n=setTimeout(()=>{h("Timed out"),i.abort()},r);t=c[3]?(c[2]["User-Agent"]="FediAct Service",c[2]["Content-Type"]="application/json",await fetch(c[1],{method:c[0],signal:i.signal,headers:c[2],body:JSON.stringify(c[3])})):c[2]?(c[2]["User-Agent"]="FediAct Service",await fetch(c[1],{method:c[0],signal:i.signal,headers:c[2]})):await fetch(c[1],{method:c[0],signal:i.signal,headers:{"User-Agent":"FediAct Service"}}),clearTimeout(n),200<=t.status&&t.status<300&&(a=t.headers.get("content-type"))&&-1!==a.indexOf("application/json")?e(await t.text()):e(!1)}catch(t){h(t),e(!1)}})}async function m(){return new Promise(async function(e){var t="https://"+c.fediact_homeinstance;try{var a=await(await fetch(t)).text()}catch(t){return h(t),void e(!1)}if(a){t=a.match(d);if(t){var a=t[0].search(/"access_token":"/),n=t[0].search(/",/);if(-1<a&&-1<n){t=t[0].substring(a+=16,n);if(16<t.length)return c.fediact_token=t,void e(!0)}}}c.fediact_token=null,h("Token could not be found."),e(!1)})}function g(){return new Promise(async function(t){try{[c.fediact_mutes,c.fediact_blocks,c.fediact_domainblocks]=[[],[],[]];var[e,a,n]=await Promise.all([fetch("https://"+c.fediact_homeinstance+i,{headers:{Authorization:"Bearer "+c.fediact_token}}).then(t=>t.json()),fetch("https://"+c.fediact_homeinstance+s,{headers:{Authorization:"Bearer "+c.fediact_token}}).then(t=>t.json()),fetch("https://"+c.fediact_homeinstance+o,{headers:{Authorization:"Bearer "+c.fediact_token}}).then(t=>t.json())]);e.length&&c.fediact_mutes.push(...e.map(t=>t.acct)),a.length&&c.fediact_blocks.push(...a.map(t=>t.acct)),n.length&&(c.fediact_domainblocks=n),t(!0)}catch{t(!1)}})}async function y(n,i){return new Promise(async function(t){var a=!1;try{if((c=await(browser||chrome).storage.local.get(u)).fediact_homeinstance){if(n||i){!n&&c.fediact_token||await m(),i&&await g();try{await(browser||chrome).storage.local.set(c),a=!0}catch{h(e)}}}else h("Home instance not set")}catch(t){h(t)}t(a)})}async function p(){chrome.tabs.query({},async function(t){for(var e=0;e<t.length;++e)try{chrome.tabs.sendMessage(t[e].id,{updatedfedisettings:!0})}catch(t){continue}})}chrome.runtime.onInstalled.addListener(function(){y(!0,!0)}),chrome.alarms.create("refresh",{periodInMinutes:t}),chrome.alarms.onAlarm.addListener(function(){y(!0,!0)}),chrome.runtime.onMessage.addListener((t,n,e)=>t.externaltoot?(f(t.externaltoot).then(e),!0):t.requestdata?(l(t.requestdata).then(e),!0):t.updatedsettings?(y(!0,!0).then(p),!0):t.updatemutedblocked?(y(!1,!0).then(e),!0):void(t.running&&chrome.tabs.onUpdated.addListener(async function(t,e,a){if(t===n.tab.id&&e.url)try{await chrome.tabs.sendMessage(t,{urlchanged:e.url})}catch(t){h(t)}})));

src/content_styles.css

@@ -0,0 +1,299 @@
+/*
+    Normal stylings
+*/
+
+:root { /* Modal Vars */
+    --bg: #eee;
+    --fg: #494949;
+    --border: rgba(120,120,130,0.3);
+    --hover: rgba(100,100,130,0.2);
+    --confirmation: rgb(38, 133, 0);
+}
+
+@media (prefers-color-scheme: dark) {
+    :root {
+        --bg: #24262d;
+        --fg: white;
+    }
+}
+
+/* Styles for the mute/block modal popup */
+
+.fediactmodal {
+    position: fixed;
+    z-index: 99999;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    background-color: rgba(0,0,0,0.4);
+    margin: 0;
+    padding: 0;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    font-size: 1rem;
+    -webkit-animation: fa_fadeIn .2s;
+        animation: fa_fadeIn .2s;
+}
+
+.fediactmodalinner {
+    background-color: var(--bg);
+    border: 1px solid var(--border);
+	width: 80%;
+	max-width: 300px;
+	margin: auto;
+	padding: .4em;
+    border-radius: 8px;
+    -webkit-animation: fa_scaleInSmall .2s;
+        animation: fa_scaleInSmall .2s;
+}
+.fediactmodalitem {
+    position: relative;
+    display: block;
+	padding: .7em;
+    border-radius: 6px;
+    cursor: pointer;
+	-webkit-box-sizing: border-box;
+	        box-sizing: border-box;
+    -webkit-transition: background-color .4s;
+    -o-transition: background-color .4s;
+    transition: background-color .4s;
+}
+.fediactmodalitem:hover, .fediactmodalitem:focus-within {
+    background-color: var(--hover);
+}
+.fediactmodallink {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    cursor: pointer;
+	text-decoration: none;
+	color: var(--fg);
+    margin: -.7em;
+    padding: .7em;
+    border-radius: inherit;
+    -webkit-box-shadow: inset 0 0 0 var(--confirmation);
+            box-shadow: inset 0 0 0 var(--confirmation);
+    -webkit-transition: padding .2s, color .2s, -webkit-box-shadow .2s cubic-bezier(.2,.2,0,1);
+    transition: padding .2s, color .2s, -webkit-box-shadow .2s cubic-bezier(.2,.2,0,1);
+    -o-transition: padding .2s, color .2s, box-shadow .2s cubic-bezier(.2,.2,0,1);
+    transition: padding .2s, color .2s, box-shadow .2s cubic-bezier(.2,.2,0,1);
+    transition: padding .2s, color .2s, box-shadow .2s cubic-bezier(.2,.2,0,1), -webkit-box-shadow .2s cubic-bezier(.2,.2,0,1);
+}
+.fediactmodallink span:not(:first-of-type) {
+    position: absolute;
+    right: .7em;
+    font-size: .8em;
+    padding: .2em .4em;
+    border-radius: 4px;
+    background-color: white;
+    color: var(--confirmation);
+    -webkit-animation: fa_scaleInFadeSmall .2s;
+        animation: fa_scaleInFadeSmall .2s;
+}
+.fediactmodallink.activated {
+    -webkit-box-shadow: inset 300px 0 0 var(--confirmation);
+            box-shadow: inset 300px 0 0 var(--confirmation);
+    color: white;
+    font-weight: 600;
+}
+
+/* Styles for "resolving..." indicator */
+.fediactprocessing {
+    display: inline-block;
+    height: 1.2em;
+    width: 1.2em;
+    background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHdpZHRoPSI0MHB4IiBoZWlnaHQ9IjQwcHgiIHZpZXdCb3g9IjAgMCA0MCA0MCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWw6c3BhY2U9InByZXNlcnZlIiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7c3Ryb2tlLWxpbmVqb2luOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEuNDE0MjE7IiB4PSIwcHgiIHk9IjBweCI+CiAgICA8ZGVmcz4KICAgICAgICA8c3R5bGUgdHlwZT0idGV4dC9jc3MiPjwhW0NEQVRBWwogICAgICAgICAgICBALXdlYmtpdC1rZXlmcmFtZXMgc3BpbiB7CiAgICAgICAgICAgICAgZnJvbSB7CiAgICAgICAgICAgICAgICAtd2Via2l0LXRyYW5zZm9ybTogcm90YXRlKDBkZWcpCiAgICAgICAgICAgICAgfQogICAgICAgICAgICAgIHRvIHsKICAgICAgICAgICAgICAgIC13ZWJraXQtdHJhbnNmb3JtOiByb3RhdGUoLTM1OWRlZykKICAgICAgICAgICAgICB9CiAgICAgICAgICAgIH0KICAgICAgICAgICAgQGtleWZyYW1lcyBzcGluIHsKICAgICAgICAgICAgICBmcm9tIHsKICAgICAgICAgICAgICAgIHRyYW5zZm9ybTogcm90YXRlKDBkZWcpCiAgICAgICAgICAgICAgfQogICAgICAgICAgICAgIHRvIHsKICAgICAgICAgICAgICAgIHRyYW5zZm9ybTogcm90YXRlKC0zNTlkZWcpCiAgICAgICAgICAgICAgfQogICAgICAgICAgICB9CiAgICAgICAgICAgIHN2ZyB7CiAgICAgICAgICAgICAgICAtd2Via2l0LXRyYW5zZm9ybS1vcmlnaW46IDUwJSA1MCU7CiAgICAgICAgICAgICAgICAtd2Via2l0LWFuaW1hdGlvbjogc3BpbiAxLjVzIGxpbmVhciBpbmZpbml0ZTsKICAgICAgICAgICAgICAgIC13ZWJraXQtYmFja2ZhY2UtdmlzaWJpbGl0eTogaGlkZGVuOwogICAgICAgICAgICAgICAgYW5pbWF0aW9uOiBzcGluIDEuNXMgbGluZWFyIGluZmluaXRlOwogICAgICAgICAgICB9CiAgICAgICAgXV0+PC9zdHlsZT4KICAgIDwvZGVmcz4KICAgIDxnIGlkPSJvdXRlciI+CiAgICAgICAgPGc+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0yMCwwQzIyLjIwNTgsMCAyMy45OTM5LDEuNzg4MTMgMjMuOTkzOSwzLjk5MzlDMjMuOTkzOSw2LjE5OTY4IDIyLjIwNTgsNy45ODc4MSAyMCw3Ljk4NzgxQzE3Ljc5NDIsNy45ODc4MSAxNi4wMDYxLDYuMTk5NjggMTYuMDA2MSwzLjk5MzlDMTYuMDA2MSwxLjc4ODEzIDE3Ljc5NDIsMCAyMCwwWiIgc3R5bGU9ImZpbGw6YmxhY2s7Ii8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8cGF0aCBkPSJNNS44NTc4Niw1Ljg1Nzg2QzcuNDE3NTgsNC4yOTgxNSA5Ljk0NjM4LDQuMjk4MTUgMTEuNTA2MSw1Ljg1Nzg2QzEzLjA2NTgsNy40MTc1OCAxMy4wNjU4LDkuOTQ2MzggMTEuNTA2MSwxMS41MDYxQzkuOTQ2MzgsMTMuMDY1OCA3LjQxNzU4LDEzLjA2NTggNS44NTc4NiwxMS41MDYxQzQuMjk4MTUsOS45NDYzOCA0LjI5ODE1LDcuNDE3NTggNS44NTc4Niw1Ljg1Nzg2WiIgc3R5bGU9ImZpbGw6cmdiKDIxMCwyMTAsMjEwKTsiLz4KICAgICAgICA8L2c+CiAgICAgICAgPGc+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0yMCwzMi4wMTIyQzIyLjIwNTgsMzIuMDEyMiAyMy45OTM5LDMzLjgwMDMgMjMuOTkzOSwzNi4wMDYxQzIzLjk5MzksMzguMjExOSAyMi4yMDU4LDQwIDIwLDQwQzE3Ljc5NDIsNDAgMTYuMDA2MSwzOC4yMTE5IDE2LjAwNjEsMzYuMDA2MUMxNi4wMDYxLDMzLjgwMDMgMTcuNzk0MiwzMi4wMTIyIDIwLDMyLjAxMjJaIiBzdHlsZT0iZmlsbDpyZ2IoMTMwLDEzMCwxMzApOyIvPgogICAgICAgIDwvZz4KICAgICAgICA8Zz4KICAgICAgICAgICAgPHBhdGggZD0iTTI4LjQ5MzksMjguNDkzOUMzMC4wNTM2LDI2LjkzNDIgMzIuNTgyNCwyNi45MzQyIDM0LjE0MjEsMjguNDkzOUMzNS43MDE5LDMwLjA1MzYgMzUuNzAxOSwzMi41ODI0IDM0LjE0MjEsMzQuMTQyMUMzMi41ODI0LDM1LjcwMTkgMzAuMDUzNiwzNS43MDE5IDI4LjQ5MzksMzQuMTQyMUMyNi45MzQyLDMyLjU4MjQgMjYuOTM0MiwzMC4wNTM2IDI4LjQ5MzksMjguNDkzOVoiIHN0eWxlPSJmaWxsOnJnYigxMDEsMTAxLDEwMSk7Ii8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8cGF0aCBkPSJNMy45OTM5LDE2LjAwNjFDNi4xOTk2OCwxNi4wMDYxIDcuOTg3ODEsMTcuNzk0MiA3Ljk4NzgxLDIwQzcuOTg3ODEsMjIuMjA1OCA2LjE5OTY4LDIzLjk5MzkgMy45OTM5LDIzLjk5MzlDMS43ODgxMywyMy45OTM5IDAsMjIuMjA1OCAwLDIwQzAsMTcuNzk0MiAxLjc4ODEzLDE2LjAwNjEgMy45OTM5LDE2LjAwNjFaIiBzdHlsZT0iZmlsbDpyZ2IoMTg3LDE4NywxODcpOyIvPgogICAgICAgIDwvZz4KICAgICAgICA8Zz4KICAgICAgICAgICAgPHBhdGggZD0iTTUuODU3ODYsMjguNDkzOUM3LjQxNzU4LDI2LjkzNDIgOS45NDYzOCwyNi45MzQyIDExLjUwNjEsMjguNDkzOUMxMy4wNjU4LDMwLjA1MzYgMTMuMDY1OCwzMi41ODI0IDExLjUwNjEsMzQuMTQyMUM5Ljk0NjM4LDM1LjcwMTkgNy40MTc1OCwzNS43MDE5IDUuODU3ODYsMzQuMTQyMUM0LjI5ODE1LDMyLjU4MjQgNC4yOTgxNSwzMC4wNTM2IDUuODU3ODYsMjguNDkzOVoiIHN0eWxlPSJmaWxsOnJnYigxNjQsMTY0LDE2NCk7Ii8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8cGF0aCBkPSJNMzYuMDA2MSwxNi4wMDYxQzM4LjIxMTksMTYuMDA2MSA0MCwxNy43OTQyIDQwLDIwQzQwLDIyLjIwNTggMzguMjExOSwyMy45OTM5IDM2LjAwNjEsMjMuOTkzOUMzMy44MDAzLDIzLjk5MzkgMzIuMDEyMiwyMi4yMDU4IDMyLjAxMjIsMjBDMzIuMDEyMiwxNy43OTQyIDMzLjgwMDMsMTYuMDA2MSAzNi4wMDYxLDE2LjAwNjFaIiBzdHlsZT0iZmlsbDpyZ2IoNzQsNzQsNzQpOyIvPgogICAgICAgIDwvZz4KICAgICAgICA8Zz4KICAgICAgICAgICAgPHBhdGggZD0iTTI4LjQ5MzksNS44NTc4NkMzMC4wNTM2LDQuMjk4MTUgMzIuNTgyNCw0LjI5ODE1IDM0LjE0MjEsNS44NTc4NkMzNS43MDE5LDcuNDE3NTggMzUuNzAxOSw5Ljk0NjM4IDM0LjE0MjEsMTEuNTA2MUMzMi41ODI0LDEzLjA2NTggMzAuMDUzNiwxMy4wNjU4IDI4LjQ5MzksMTEuNTA2MUMyNi45MzQyLDkuOTQ2MzggMjYuOTM0Miw3LjQxNzU4IDI4LjQ5MzksNS44NTc4NloiIHN0eWxlPSJmaWxsOnJnYig1MCw1MCw1MCk7Ii8+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4K') no-repeat center center;
+    background-size: 1em 1em;
+    padding-left: 10px; /* for instances where action bar is not full width */
+    padding-right: 10px;
+}
+
+/* Styles for unresolved indicator */
+
+.fediactunresolved {
+    display: inline-block;
+    height: 1.2em;
+    width: 1.2em;
+    color: orange;
+    font-weight: bold;
+    padding-right: 10px;
+    padding-left: 10px
+}
+
+/* Styles for after a poll was voted */
+
+.fediactvoted {
+    font-style: italic;
+}
+
+.fediactvoted > a {
+    font-weight: bold !important;
+    color: orange !important;
+}
+
+/* Inserted in the bottom right of any external instance where FediAct is running */
+
+.fediacticon {
+    height: 32px;
+    width: 32px;
+    position: fixed;
+    z-index: 99998;
+    bottom: 50px;
+    right: 20px;
+    background: url('data:image/png;base64,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');
+    background-size: 32px 32px;
+    cursor: pointer;
+}
+
+.fediactsettings_onsite {
+    position: fixed;
+    z-index: 99998;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    background-color: rgba(0,0,0,0.4);
+    margin: 0;
+    padding: 0;
+    display: none;
+}
+
+.fediactsettings_onsite  .fediactsettings_onsite_inner {
+    position: absolute;
+    bottom: 15px;
+    right: 15px;
+    padding: 10px 15px;
+    background: white;
+    border-radius: 5px;
+}
+
+.fediactsettings_onsite  .fediactsettings_onsite_inner a {
+    color: blue !important;
+}
+
+/* keyframes fa_*/
+
+@-webkit-keyframes fa_fadeIn {
+    from {
+        -webkit-filter: opacity(0);
+                filter: opacity(0);
+    }
+}
+@keyframes fa_fadeIn {
+    from {
+        -webkit-filter: opacity(0);
+                filter: opacity(0);
+    }
+}
+@-webkit-keyframes fa_fadeOut {
+    to {
+        -webkit-filter: opacity(0);
+                filter: opacity(0);
+    }
+}
+@keyframes fa_fadeOut {
+    to {
+        -webkit-filter: opacity(0);
+                filter: opacity(0);
+    }
+}
+@-webkit-keyframes fa_scaleInSmall {
+    from {
+        -webkit-transform: scale(.98);
+                transform: scale(.98);
+    }
+}
+@keyframes fa_scaleInSmall {
+    from {
+        -webkit-transform: scale(.98);
+                transform: scale(.98);
+    }
+}
+@-webkit-keyframes fa_scaleInFadeSmall {
+    from {
+        -webkit-transform: scale(.98);
+                transform: scale(.98);
+        -webkit-filter: opacity(0);
+                filter: opacity(0);
+    }
+}
+@keyframes fa_scaleInFadeSmall {
+    from {
+        -webkit-transform: scale(.98);
+                transform: scale(.98);
+        -webkit-filter: opacity(0);
+                filter: opacity(0);
+    }
+}
+
+
+/*
+    We insert these styles for the DOMNodeAppeared function as separate stylesheet (see manifest) to fix
+    Firefox blocking script-inserted <style> elements due to the site's CSP (long time bug)
+*/
+
+@-moz-keyframes fa_nodeInserted {
+    from {
+        opacity: 1;
+    } to {
+        opacity: 1;
+    }
+}
+@-webkit-keyframes fa_nodeInserted {
+    from {
+        opacity: 1;
+    } to {
+        opacity: 1;
+    }
+}
+@-ms-keyframes fa_nodeInserted {
+    from {
+        opacity: 1;
+    } to {
+        opacity: 1;
+    }
+}
+@-o-keyframes fa_nodeInserted {
+    from {
+        opacity: 1;
+    } to {
+        opacity: 1;
+    }
+}
+@keyframes fa_nodeInserted {
+    from {
+      opacity: 1;
+  } to {
+      opacity: 1;
+  }
+}
+
+div.status,
+div.detailed-status,
+div.detailed-status__action-bar,
+div.account__header button.logo-button,
+div.account__header button.button--follow,
+div.public-account-header a.logo-button,
+div.account-card a.logo-button,
+div.directory-card a.icon-button,
+div.detailed-status a.logo-button,
+button.remote-button,
+script#initial-state {
+    -webkit-animation-name: fa_nodeInserted !important;
+    -webkit-animation-duration: 0.001s !important;
+    -ms-animation-name: fa_nodeInserted !important;
+    -ms-animation-duration: 0.001s !important;
+    -moz-animation-name: fa_nodeInserted !important;
+    -moz-animation-duration: 0.001s !important;
+    -o-animation-name: fa_nodeInserted !important;
+    -o-animation-duration: 0.001s !important;
+    animation-name: fa_nodeInserted !important;
+    animation-duration: 0.001s !important;
+}

src/nodeinserted.css

@@ -1,60 +0,0 @@
-/*  
-    We insert these styles for the DOMNodeAppeared function as separate stylesheet (see manifest) to fix
-    Firefox blocking script-inserted <style> elements due to the site's CSP (long time bug)
-*/
-
-@-moz-keyframes nodeInserted { 
-    from {
-        opacity: 1;
-    } to {
-        opacity: 1;
-    }
-}
-@-webkit-keyframes nodeInserted { 
-    from {
-        opacity: 1;
-    } to {
-        opacity: 1;
-    }
-}
-@-ms-keyframes nodeInserted { 
-    from {
-        opacity: 1;
-    } to {
-        opacity: 1;
-    }
-}
-@-o-keyframes nodeInserted {
-    from {
-        opacity: 1;
-    } to {
-        opacity: 1;
-    }
-}
-@keyframes nodeInserted { 
-  from { 
-      opacity: 1;
-  } to {
-      opacity: 1;
-  }
-}
-
-div.status,
-div.detailed-status,
-div.detailed-status__action-bar,
-div.account__header button.logo-button,
-div.public-account-header a.logo-button,
-div.account-card a.logo-button,
-div.directory-card a.icon-button,
-div.detailed-status a.logo-button { 
-    -webkit-animation-name: nodeInserted !important;
-    -webkit-animation-duration: 0.001s !important;
-    -ms-animation-name: nodeInserted !important;
-    -ms-animation-duration: 0.001s !important;
-    -moz-animation-name: nodeInserted !important;
-    -moz-animation-duration: 0.001s !important;
-    -o-animation-name: nodeInserted !important;
-    -o-animation-duration: 0.001s !important;
-    animation-name: nodeInserted !important;
-    animation-duration: 0.001s !important;
-}

src/nodeinserted.min.css

@@ -1 +0,0 @@
-@-moz-keyframes nodeInserted{from{opacity:1}to{opacity:1}}@-webkit-keyframes nodeInserted{from{opacity:1}to{opacity:1}}@-ms-keyframes nodeInserted{from{opacity:1}to{opacity:1}}@-o-keyframes nodeInserted{from{opacity:1}to{opacity:1}}@keyframes nodeInserted{from{opacity:1}to{opacity:1}}div.status,div.detailed-status,div.detailed-status__action-bar,div.account__header button.logo-button,div.public-account-header a.logo-button,div.account-card a.logo-button,div.directory-card a.icon-button,div.detailed-status a.logo-button{-webkit-animation-name:nodeInserted !important;-webkit-animation-duration:.001s !important;-ms-animation-name:nodeInserted !important;-ms-animation-duration:.001s !important;-moz-animation-name:nodeInserted !important;-moz-animation-duration:.001s !important;-o-animation-name:nodeInserted !important;-o-animation-duration:.001s !important;animation-name:nodeInserted !important;animation-duration:.001s !important}

src/popup.html

@@ -1,63 +1,127 @@
 <!DOCTYPE html>
 <html>
   <head>
-		<style>
-			.hide {
-				display: none;
-			}
-			label.pad {
-				margin-bottom: 4px;
-				display: block;
-			}
-			p {
-				margin-bottom: 5px;
-			}
-		</style>
+		<link rel="stylesheet" href="chrome://browser/content/extension.css">
+		<meta name="color-scheme" content="dark light">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0">
 		<script src="lib/jquery-3.6.1.min.js"></script>
 		<script src="popup.min.js"></script>
+		<link rel="stylesheet" href="popup_styles.min.css">
   </head>
-  <body style="min-width: 300px">
-   <div id="mhi-wrapper">
-    <div id="mhi-containers">
+  <body>
+	<div id="mhi-wrapper">
+		<div id="mhi-containers">
 			<form id="fediact-settings">
-				<p><b>General</b></p>
-				<label class="pad" for="homeinstance">Home instance (make sure you are logged in):</label>
-				<input type="text" id="homeinstance" name="homeinstance" placeholder="example.social"><br>
-				<p><b>Redirect settings</b></p>
-				<input type="checkbox" id="redirects" name="redirects">
-				<label for="redirects">Enable</label><br>
-				<input type="checkbox" id="alert" name="alert">
-				<label for="alert">Alert on redirect</label><br>
-				<label style="padding-right: 5px" for="target">Open in</label>
-				<select style="margin-top: 5px;" name="target" id="target" selected="_blank">
-					<option id="target_blank" value="_blank">New tab</option>
-					<option id="target_self" value="_self">Same tab</option>
-				</select><br>
-				<p><b>Other</b></p>
-				<input type="checkbox" id="autoaction" name="autoaction">
-				<label for="autoaction">Auto-action</label><br>
-				<input type="checkbox" id="showfollows" name="showfollows">
-				<label for="showfollows">Show external follows</label><br>
-				<input type="checkbox" id="hidemuted" name="hidemuted">
-				<label for="hidemuted">Hide muted</label><br>
-				<input type="checkbox" id="delay" name="delay">
-				<label for="delay">Enable API delay</label><br>
-				<p><b>Mode</b></p>
-				<select name="mode" id="mode" selected="blacklist">
-					<option id="blacklist" value="blacklist">All (with blacklist)</option>
-					<option id="whitelist" value="whitelist">Whitelist</option>
-				</select><br>
-				<div class="hide" id="blacklist_input">
-					<label for="blacklist_content">Blacklist:</label><br>
-					<textarea id="blacklist_content" name="blacklist_content" placeholder="example.social&#10;example2.social"></textarea><br>
+				<div class="scroller">
+					<fieldset aria-labelledby="homeServerDomainLabel">
+						<div class="row">
+							<label for="homeinstance">
+								<legend id="homeServerDomainLabel"><h1>Home Server Domain</h1></legend>
+								<span>
+									Make sure you are logged in to your home server
+								</span>
+							</label>
+							<div class="text-input-container">
+								<span>https://</span>
+								<input type="text" id="homeinstance" name="homeinstance" placeholder="example.social">
+							</div>
+						</div>
+					</fieldset>
+					<fieldset>
+						<legend>Redirect Settings</legend>
+						<div class="row">
+							<label for="redirects">Enable
+								<span>
+									Redirect on double click and reply
+								</span>
+							</label>
+							<input type="checkbox" id="redirects" name="redirects">
+						</div>
+						<div class="row">
+							<label for="alert">Prompt
+								<span>
+									Show confirmation dialog before redirecting
+								</span>
+							</label>
+							<input type="checkbox" id="alert" name="alert">
+						</div>
+						<div class="row">
+							<label for="target">Open in...</label>
+							<select name="target" id="target" selected="_blank">
+								<option id="target_blank" value="_blank">New tab&nbsp;</option>
+								<option id="target_self" value="_self">Same tab&nbsp;</option>
+							</select>
+						</div>
+					</fieldset>
+					<fieldset>
+						<legend>Other Settings</legend>
+						<div class="row">
+							<label for="autoaction">Actions
+								<span>
+									Enable follow, boost, etc. on other servers 
+								</span>
+							</label>
+							<input type="checkbox" id="autoaction" name="autoaction">
+						</div>
+						<div class="row">
+							<label for="hidemuted">Hide muted/blocked
+								<span>
+									Can fail / decrease performance in some cases
+								</span>
+							</label>
+							<input type="checkbox" id="hidemuted" name="hidemuted">
+						</div>
+						<div class="row">
+							<label for="delay">API delay
+								<span>
+									Only allow one API request every 500ms
+								</span>
+							</label>
+							<input type="checkbox" id="delay" name="delay">
+						</div>
+					</fieldset>
+					<fieldset>
+						<legend>Mode</legend>
+						<div class="row">
+							<label for="runifloggedin">Ignore sessions
+								<span>
+									Run FediAct on instances where I'm logged in
+								</span>
+							</label>
+							<input type="checkbox" id="runifloggedin" name="runifloggedin">
+						</div>
+					</fieldset>
+					<fieldset>
+						<legend>Filtered servers</legend>
+						<div class="row">
+							<label for="mode">Mode
+								<span class="hide" id="allowlabel">
+									Only run on the following domains...
+								</span>
+								<span class="hide" id="denylabel">
+									Run on all domains except the following...
+								</span>
+							</label>
+							<select name="mode" id="mode" selected="blacklist">
+								<option id="blacklist" value="blacklist">Denylist&nbsp;</option>
+								<option id="whitelist" value="whitelist">Allowlist&nbsp;</option>
+							</select>
+						</div>
+						<div class="row">
+							<div class="hide textarea-container" id="blacklist_input">
+								<textarea id="blacklist_content" name="blacklist_content" placeholder="example.social&#10;example2.social"></textarea>
+							</div>
+							<div class="hide textarea-container" id="whitelist_input">
+								<textarea id="whitelist_content" name="whitelist_content" placeholder="example.social&#10;example2.social"></textarea>
+							</div>
+						</div>
+					</fieldset>
+				</div>
+				<div class="footer">
+					<input type="submit" value="Save">
+					<span id="indicator" style="display:none">Settings saved!</span>
+					<span><a target="_blank" href="https://github.com/lartsch/FediAct">More info / help on Github</a></span>
 				</div>
-				<div class="hide" id="whitelist_input">
-					<label for="whitelist_content">Whitelist:</label><br>
-					<textarea id="whitelist_content" name="whitelist_content" placeholder="example.social&#10;example2.social"></textarea><br>
-				</div><br>
-				<input type="submit" value="Submit">
-				<span id="indicator" style="display:none">Settings saved!</span>
-				<br><br><span>Made by <a target="_blank" href="https://github.com/lartsch">github.com/lartsch</a></span>
 			</form>
     </div>
    </div>

src/popup.js

@@ -8,10 +8,10 @@ const settingsDefaults = {
 	fediact_blacklist: null,
 	fediact_target: "_self",
 	fediact_autoaction: true,
-	fediact_showfollows: true,
 	fediact_redirects: true,
 	fediact_enabledelay: true,
-	fediact_hidemuted: false
+	fediact_hidemuted: false,
+	fediact_runifloggedin: false,
 }
 
 // fix for cross-browser storage api compatibility
@@ -38,17 +38,17 @@ function popupTasks() {
 	// get all current values and write them to the local storage
 	async function updateSettings(){
 		// update settings values
-		settings.fediact_homeinstance = $("input#homeinstance").val().trim()
+		settings.fediact_homeinstance = $("input#homeinstance").val().trim().toLowerCase()
 		settings.fediact_alert = $("input#alert").is(':checked')
 		settings.fediact_mode = $("select#mode").val()
 		settings.fediact_whitelist = $("textarea#whitelist_content").val()
 		settings.fediact_blacklist = $("textarea#blacklist_content").val()
 		settings.fediact_target = $("select#target").val()
 		settings.fediact_autoaction = $("input#autoaction").is(':checked')
-		settings.fediact_showfollows = $("input#showfollows").is(':checked')
 		settings.fediact_redirects = $("input#redirects").is(':checked')
 		settings.fediact_enabledelay = $("input#delay").is(':checked')
 		settings.fediact_hidemuted = $("input#hidemuted").is(':checked')
+		settings.fediact_runifloggedin = $("input#runifloggedin").is(':checked')
 		// write to storage
 		try {
 			await (browser || chrome).storage.local.set(settings)
@@ -69,24 +69,30 @@ function popupTasks() {
 		$("select#target").val(settings.fediact_target)
 		$("input#alert").prop('checked', settings.fediact_alert)
 		$("input#autoaction").prop('checked', settings.fediact_autoaction)
-		$("input#showfollows").prop('checked', settings.fediact_showfollows)
 		$("input#redirects").prop('checked', settings.fediact_redirects)
 		$("input#delay").prop('checked', settings.fediact_enabledelay)
 		$("input#hidemuted").prop('checked', settings.fediact_hidemuted)
+		$("input#runifloggedin").prop('checked', settings.fediact_runifloggedin)
 		// both containers are hidden by default
 		if ($("select#mode").val() == "whitelist") {
-			$("div#whitelist_input").show()
+			$("div#whitelist_input").removeClass("hide")
+			$("span#allowlabel").removeClass("hide")
 		} else {
-			$("div#blacklist_input").show()
+			$("div#blacklist_input").removeClass("hide")
+			$("span#denylabel").removeClass("hide")
 		}
 		// check changes of the select to update whitelist/blacklist input
 		$("select#mode").change(function() {
 			if ($("select#mode").val() == "whitelist") {
-				$("div#blacklist_input").hide()
-				$("div#whitelist_input").show()
+				$("div#blacklist_input").addClass("hide")
+				$("span#denylabel").addClass("hide")
+				$("div#whitelist_input").removeClass("hide")
+				$("span#allowlabel").removeClass("hide")
 			} else {
-				$("div#whitelist_input").hide()
-				$("div#blacklist_input").show()
+				$("div#whitelist_input").addClass("hide")
+				$("span#allowlabel").addClass("hide")
+				$("div#blacklist_input").removeClass("hide")
+				$("span#denylabel").removeClass("hide")
 			}
 		})
 	}

src/popup.min.js

@@ -1 +1 @@
-const t={fediact_homeinstance:null,fediact_alert:!1,fediact_mode:"blacklist",fediact_whitelist:null,fediact_blacklist:null,fediact_target:"_self",fediact_autoaction:!0,fediact_showfollows:!0,fediact_redirects:!0,fediact_enabledelay:!0,fediact_hidemuted:!1};var browser,chrome,a;const i=!0,c="[FediAct]";function d(t){i&&console.log(c+" "+t)}function n(){async function i(){a.fediact_homeinstance=$("input#homeinstance").val().trim(),a.fediact_alert=$("input#alert").is(":checked"),a.fediact_mode=$("select#mode").val(),a.fediact_whitelist=$("textarea#whitelist_content").val(),a.fediact_blacklist=$("textarea#blacklist_content").val(),a.fediact_target=$("select#target").val(),a.fediact_autoaction=$("input#autoaction").is(":checked"),a.fediact_showfollows=$("input#showfollows").is(":checked"),a.fediact_redirects=$("input#redirects").is(":checked"),a.fediact_enabledelay=$("input#delay").is(":checked"),a.fediact_hidemuted=$("input#hidemuted").is(":checked");try{await(browser||chrome).storage.local.set(a)}catch{return d(e),!1}$("span#indicator").show(),setTimeout(function(){$("span#indicator").hide()},1500)}$(document).ready(function(){$("input#homeinstance").val(a.fediact_homeinstance),$("textarea#blacklist_content").val(a.fediact_blacklist),$("textarea#whitelist_content").val(a.fediact_whitelist),$("select#mode").val(a.fediact_mode),$("select#target").val(a.fediact_target),$("input#alert").prop("checked",a.fediact_alert),$("input#autoaction").prop("checked",a.fediact_autoaction),$("input#showfollows").prop("checked",a.fediact_showfollows),$("input#redirects").prop("checked",a.fediact_redirects),$("input#delay").prop("checked",a.fediact_enabledelay),$("input#hidemuted").prop("checked",a.fediact_hidemuted),("whitelist"==$("select#mode").val()?$("div#whitelist_input"):$("div#blacklist_input")).show(),$("select#mode").change(function(){("whitelist"==$("select#mode").val()?($("div#blacklist_input").hide(),$("div#whitelist_input")):($("div#whitelist_input").hide(),$("div#blacklist_input"))).show()}),$("form#fediact-settings").on("submit",async function(t){t.preventDefault(),i();try{await chrome.runtime.sendMessage({updatedsettings:!0})}catch(t){d(t)}})})}async function l(){try{a=await(browser||chrome).storage.local.get(t)}catch(t){return d(t),!1}a&&n()}l();
+const t={fediact_homeinstance:null,fediact_alert:!1,fediact_mode:"blacklist",fediact_whitelist:null,fediact_blacklist:null,fediact_target:"_self",fediact_autoaction:!0,fediact_redirects:!0,fediact_enabledelay:!0,fediact_hidemuted:!1,fediact_runifloggedin:!1};var browser,chrome,i;const a=!0,c="[FediAct]";function d(e){a&&console.log(c+" "+e)}function l(){async function t(){i.fediact_homeinstance=$("input#homeinstance").val().trim().toLowerCase(),i.fediact_alert=$("input#alert").is(":checked"),i.fediact_mode=$("select#mode").val(),i.fediact_whitelist=$("textarea#whitelist_content").val(),i.fediact_blacklist=$("textarea#blacklist_content").val(),i.fediact_target=$("select#target").val(),i.fediact_autoaction=$("input#autoaction").is(":checked"),i.fediact_redirects=$("input#redirects").is(":checked"),i.fediact_enabledelay=$("input#delay").is(":checked"),i.fediact_hidemuted=$("input#hidemuted").is(":checked"),i.fediact_runifloggedin=$("input#runifloggedin").is(":checked");try{await(browser||chrome).storage.local.set(i)}catch{return d(e),!1}$("span#indicator").show(),setTimeout(function(){$("span#indicator").hide()},1500)}$(document).ready(function(){$("input#homeinstance").val(i.fediact_homeinstance),$("textarea#blacklist_content").val(i.fediact_blacklist),$("textarea#whitelist_content").val(i.fediact_whitelist),$("select#mode").val(i.fediact_mode),$("select#target").val(i.fediact_target),$("input#alert").prop("checked",i.fediact_alert),$("input#autoaction").prop("checked",i.fediact_autoaction),$("input#redirects").prop("checked",i.fediact_redirects),$("input#delay").prop("checked",i.fediact_enabledelay),$("input#hidemuted").prop("checked",i.fediact_hidemuted),$("input#runifloggedin").prop("checked",i.fediact_runifloggedin),("whitelist"==$("select#mode").val()?($("div#whitelist_input").removeClass("hide"),$("span#allowlabel")):($("div#blacklist_input").removeClass("hide"),$("span#denylabel"))).removeClass("hide"),$("select#mode").change(function(){("whitelist"==$("select#mode").val()?($("div#blacklist_input").addClass("hide"),$("span#denylabel").addClass("hide"),$("div#whitelist_input").removeClass("hide"),$("span#allowlabel")):($("div#whitelist_input").addClass("hide"),$("span#allowlabel").addClass("hide"),$("div#blacklist_input").removeClass("hide"),$("span#denylabel"))).removeClass("hide")}),$("form#fediact-settings").on("submit",async function(e){e.preventDefault(),t();try{await chrome.runtime.sendMessage({updatedsettings:!0})}catch(e){d(e)}})})}async function n(){try{i=await(browser||chrome).storage.local.get(t)}catch(e){return d(e),!1}i&&l()}n();

src/popup_styles.css

@@ -0,0 +1,227 @@
+html, body {
+    margin: 0;
+    height: var(--popup-height);
+    min-width: 300px;
+    max-height: 900px;
+}
+html {
+    --highlight: rgba(130,130,150,0.1);
+    --confirmation: rgb(38, 133, 0);
+    --hover: rgba(120,120,130,0.15);
+    --border: rgba(120,120,130,0.3);
+    --border-2: rgba(130,130,150,0.3);
+    --radius: 12px;
+    --popup-height: 450px;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    height: 100%;
+}
+body {
+    -webkit-box-flex: 1;
+        -ms-flex-positive: 1;
+            flex-grow: 1;
+    min-height: var(--popup-height);
+}
+.hide {
+    display: none;
+}
+h1 {
+    font-size: 1em;
+    margin-block: .2em;
+}
+h2 {
+    font-size: 1em;
+}
+#mhi-wrapper, #mhi-containers {
+    display: contents;
+}
+form {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    height: 100%;
+}
+.scroller {
+    height: 0;
+    overflow-y: auto;
+    -webkit-box-flex: 1;
+        -ms-flex-positive: 1;
+            flex-grow: 1;
+    padding: 10px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+}
+fieldset {
+    all: unset;
+    display: block;
+}
+legend {
+    all: unset;
+}
+fieldset > legend, summary {
+    margin-inline: .6em;
+    padding-top: .6em;
+    margin-bottom: .4em;
+    font-weight: 700;
+}
+.row {
+    background-color: var(--highlight);
+    padding: .8em;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-wrap: wrap;
+        flex-wrap: wrap;
+    margin-bottom: 2px;
+    position: relative;
+    gap: .4em;
+    -webkit-transition: background-color .1s;
+    -o-transition: background-color .1s;
+    transition: background-color .1s;
+}
+.row:hover, .row:focus-within {
+    background: var(--hover);
+}
+.row:first-of-type {
+    border-top-left-radius: var(--radius);
+    border-top-right-radius: var(--radius);
+}
+.row:last-of-type {
+    border-bottom-left-radius: var(--radius);
+    border-bottom-right-radius: var(--radius);
+}
+label {
+    width: 0;
+    -webkit-box-flex: 9999;
+        -ms-flex-positive: 9999;
+            flex-grow: 9999;
+}
+label::before { /* Make entire .row clickable */
+    content: "";
+    position: absolute;
+    inset: 0;
+}
+label span {
+    display: block;
+    font-size: .9em;
+    opacity: .7;
+    margin-top: .2em;
+}
+.text-input-container {
+    width: 100%;
+    display: flex;
+    border: 1px solid var(--border);
+    border-radius: calc(var(--radius) / 2);
+    overflow: hidden;
+}
+.text-input-container span {
+    padding: .7em;
+    background-color: var(--highlight);
+}
+.text-input-container input {
+    border: 0 !important;
+    border-radius: 0 !important;
+    outline: 0;
+}
+.text-input-container:focus-within {
+    outline: auto; /* This is the browser's default focus outline */
+}
+input, textarea, select {
+    border: 1px solid var(--border);
+    padding: .7em;
+    border-radius: calc(var(--radius) / 2);
+    font-size: inherit;
+    -webkit-box-flex: 1;
+        -ms-flex-positive: 1;
+            flex-grow: 1;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    position: relative;
+    z-index: 2;
+}
+.textarea-container {
+    width: calc(100% - .14em);
+    border-radius: inherit;
+}
+textarea {
+    resize: vertical;
+    width: 100%;
+}
+select {
+    margin-block: -.8em;
+    padding-block: .4em;
+    border: 0;
+    background: none;
+    text-align: right;
+}
+.footer {
+    padding: 10px;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-wrap: wrap;
+        flex-wrap: wrap;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: justify;
+        -ms-flex-pack: justify;
+            justify-content: space-between;
+    border-top: 1px dashed var(--border-2);
+    position: relative;
+    background-color: var(--highlight);
+    -webkit-box-shadow: 0 0 24px rgba(0,0,0,0.1);
+            box-shadow: 0 0 24px rgba(0,0,0,0.1);
+}
+[type="submit"] {
+    -webkit-box-flex: 0;
+        -ms-flex-positive: 0;
+            flex-grow: 0;
+    padding-inline: 2em;
+}
+[type="submit"]:not(:hover):not(:focus) {
+    background: none;
+}
+.footer span {
+    width: 0;
+    -webkit-box-flex: 1;
+        -ms-flex-positive: 1;
+            flex-grow: 1;
+    text-align: right;
+    padding-inline: 1em;
+}
+.footer a {	
+    opacity: .7;
+    text-underline-offset: .2em;
+    color: inherit;
+}
+#indicator {
+    -webkit-box-ordinal-group: 0;
+        -ms-flex-order: -1;
+            order: -1;
+    width: calc(100% + 20px);
+    font-weight: 600;
+    padding: .7em;
+    margin: -10px;
+    margin-bottom: 8px;
+    background-color: var(--confirmation);
+    text-align: center;
+    color: white;
+}
+@media (prefers-color-scheme: dark) {
+    body {
+        color: white;
+        background-color: #1c1b22;
+    }
+}

src/popup_styles.min.css

@@ -0,0 +1 @@
+html,body{margin:0;height:var(--popup-height);min-width:300px;max-height:900px}html{--highlight:rgba(130,130,150,0.1);--confirmation:#268500;--hover:rgba(120,120,130,0.15);--border:rgba(120,120,130,0.3);--border-2:rgba(130,130,150,0.3);--radius:12px;--popup-height:450px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:100%}body{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;min-height:var(--popup-height)}.hide{display:none}h1{font-size:1em;margin-block:.2em}h2{font-size:1em}#mhi-wrapper,#mhi-containers{display:contents}form{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:100%}.scroller{height:0;overflow-y:auto;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box}fieldset{all:unset;display:block}legend{all:unset}fieldset>legend,summary{margin-inline:.6em;padding-top:.6em;margin-bottom:.4em;font-weight:700}.row{background-color:var(--highlight);padding:.8em;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-bottom:2px;position:relative;gap:.4em;-webkit-transition:background-color .1s;-o-transition:background-color .1s;transition:background-color .1s}.row:hover,.row:focus-within{background:var(--hover)}.row:first-of-type{border-top-left-radius:var(--radius);border-top-right-radius:var(--radius)}.row:last-of-type{border-bottom-left-radius:var(--radius);border-bottom-right-radius:var(--radius)}label{width:0;-webkit-box-flex:9999;-ms-flex-positive:9999;flex-grow:9999}label::before{content:"";position:absolute;inset:0}label span{display:block;font-size:.9em;opacity:.7;margin-top:.2em}.text-input-container{width:100%;display:flex;border:1px solid var(--border);border-radius:calc(var(--radius) / 2);overflow:hidden}.text-input-container span{padding:.7em;background-color:var(--highlight)}.text-input-container input{border:0 !important;border-radius:0 !important;outline:0}.text-input-container:focus-within{outline:auto}input,textarea,select{border:1px solid var(--border);padding:.7em;border-radius:calc(var(--radius) / 2);font-size:inherit;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;z-index:2}.textarea-container{width:calc(100% - .14em);border-radius:inherit}textarea{resize:vertical;width:100%}select{margin-block:-.8em;padding-block:.4em;border:0;background:0;text-align:right}.footer{padding:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;border-top:1px dashed var(--border-2);position:relative;background-color:var(--highlight);-webkit-box-shadow:0 0 24px rgba(0,0,0,0.1);box-shadow:0 0 24px rgba(0,0,0,0.1)}[type="submit"]{-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0;padding-inline:2em}[type="submit"]:not(:hover):not(:focus){background:0}.footer span{width:0;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;text-align:right;padding-inline:1em}.footer a{opacity:.7;text-underline-offset:.2em;color:inherit}#indicator{-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1;width:calc(100% + 20px);font-weight:600;padding:.7em;margin:-10px;margin-bottom:8px;background-color:var(--confirmation);text-align:center;color:white}@media(prefers-color-scheme:dark){body{color:white;background-color:#1c1b22}}