diff options
| -rw-r--r-- | README.md | 19 | ||||
| -rw-r--r-- | manifest.json | 4 | ||||
| -rw-r--r-- | package.json | 2 | ||||
| -rw-r--r-- | styles/websites/bing.css | 55 |
4 files changed, 76 insertions, 4 deletions
@@ -2,6 +2,22 @@ Transparent Zen is a browser extension specifically designed for Zen Browser. This extension injects styles into supported websites to make them transparent, providing a new experience.
+<a href="https://addons.mozilla.org/de/firefox/addon/transparent-zen">
+ <img alt="Firefox Add-Ons" src="https://blog.mozilla.org/addons/files/2015/11/get-the-addon.png" height="40">
+</a>
+
+## Table of Contents
+
+- [Transparent Zen](#transparent-zen)
+- [Supported Websites](#supported-websites)
+- [Prerequisites](#prerequisites)
+ - [Windows 11](#windows-11)
+- [Installation](#installation)
+ - [Dark Reader](#dark-reader)
+- [Usage](#usage)
+- [Contributing](#contributing)
+- [License](#license)
+
## Supported Websites
🔴 = Not working / Broken
<br>
@@ -43,6 +59,9 @@ The following websites are currently supported by Transparent Zen: To install Transparent Zen, you can either download it from the [Firefox Add-Ons Store](https://addons.mozilla.org/de/firefox/addon/transparent-zen) or grab the latest release from github and manually install it through the Zen Browser settings.
+#### Dark Reader
+If you are using Dark Reader, ensure that it is disabled for the websites you want to view as transparent.
+
## Usage
Once installed, Transparent Zen will automatically apply transparent styles to the supported websites listed above. No further configuration is required.
diff --git a/manifest.json b/manifest.json index bfe0549..68c5e82 100644 --- a/manifest.json +++ b/manifest.json @@ -1,8 +1,8 @@ { "manifest_version": 2, "name": "Transparent Zen", - "version": "0.1.1", - "description": "Inject custom styles to make your favorite websites transparent", + "version": "0.1.2", + "description": "Inject custom styles to make your favorite websites transparent. PLEASE KEEP IN MIND THAT THIS IS STILL WORK IN PROGRESS, SO THINGS MIGHT BREAK!", "browser_specific_settings": { "gecko": { "id": "{74186d10-f6f2-4f73-b33a-83bb72e50654}" diff --git a/package.json b/package.json index 202b358..40af6f2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "transparent-zen", - "version": "0.1.1", + "version": "0.1.2", "description": "A browser extension for Zen Browser to inject custom styles to make your favorite websites transparent", "scripts": { "build": "web-ext build --config web-ext-config.mjs", diff --git a/styles/websites/bing.css b/styles/websites/bing.css index e9e93cb..2288666 100644 --- a/styles/websites/bing.css +++ b/styles/websites/bing.css @@ -1,5 +1,57 @@ @import url("../global/base.css");
+#hp_app {
+ .hp_body {
+ .hp_top_cover {
+ display: none !important;
+ }
+
+ .hp_media_container {
+ #img_cont {
+ display: none !important;
+ }
+ }
+
+ .hp_cont {
+ header {
+ background: var(--transparent-background) !important;
+ backdrop-filter: var(--backdrop-blur);
+ }
+
+ #sb_form {
+ background: var(--transparent-background-dark) !important;
+ backdrop-filter: var(--backdrop-blur);
+
+ input,
+ textarea {
+ color: var(--color-text) !important;
+ }
+
+ .tooltip {
+ background: none !important;
+ backdrop-filter: none !important;
+ }
+ }
+ }
+
+ .bottom_row {
+ #vs_cont {
+ .vs {
+ .modules_wrapper {
+ .moduleCont {
+ background: var(--transparent-background) !important;
+
+ .module {
+ background: none !important;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+}
+
#id_hbfo,
#sb_sbipane,
#id_d,
@@ -24,7 +76,8 @@ box-shadow: none !important;
}
-.b_icon.tooltip {
+.b_icon.tooltip,
+header .tooltip {
background: none !important;
backdrop-filter: none !important;
}
|