GitXplorerGitXplorer
b

ninja-mode

public
3 stars
0 forks
0 issues

Commits

List of commits on branch main.
Verified
f6cee92140ce488814fafde1fb31e9da10dfb01b

🥷🏻

bborisdiakur committed 2 years ago
Verified
6e598ebb6b5ee437200b83e6100dc5e4d83f663a

🥷🏻

bborisdiakur committed 2 years ago
Verified
a8f76a8b43b9678e80c91bd810fe85d2acbf1ce8

🥷🏻

bborisdiakur committed 2 years ago
Verified
79a2813330be2a4cb5f5f2b65ad30de9c9ed7b59

🥷🏻

bborisdiakur committed 2 years ago
Verified
1a65f4bf44da8bf69665c1aa3e101809857537c9

🥷🏻

bborisdiakur committed 2 years ago
Verified
bf8c31980deac746ccd57661afc72d5a9f1c00a0

🥷🏻

bborisdiakur committed 2 years ago

README

The README file for this repository.

Ninja Mode

Dark mode enabled
Finally, eyes at ease
Wandering the dusk

Installation

Chromium based browsers

  1. Download the source code of this repository.
  2. In your browser go to chrome://extensions/ or opera://extensions/ or use the Cmd/Ctrl Shift E shortcut.
  3. Enable the "Developer Mode".
  4. Click the "Load Unpacked" button.
  5. Select the directory of the downloaded extension.

Firefox and similar

  1. Download the source code of this repository.
  2. Run mkdir -p build && cp -r src build/src && cp -r icons build/icons && cp manifest-ff.json build/manifest.json && cd build && zip -r -FS ../ninja-mode.zip * inside the project root directory (on Windows you'll have to figure this one out by yourself).
  3. In your browser go to about:config.
  4. Search for xpinstall.signatures.required and set it to false.
  5. Go to about:addons.
  6. Click the gearwheel and then on "Install Add-on From File".
  7. Select the ninja-mode.zip file in the project root directory.
  8. In the plugin settings, make sure the setting "Access your data for all websites" is enabled.

How it works

The extension uses a content script which runs on document start, meaning that the script is run before the DOM is constructed. This is important, as it allows to change styles, before the page is rendered, effectively preventing a bright flash on load. It uses localStorage to persist the user's preference for each page: A boolean variable is persisted, if the user enables ninja mode, and is deleted if the user disables ninja mode. The content script communicates with a background script which updates the visual state of the extension's toggle button. The background script notifies the content script when the user clicks the toggle, which then in turn updates the styles on the page. When enabled, the content script adds a CSS filter which inverts colors and rotates the color hue by 180° of the html element and again inverts colors and rotates the color hue by 180° of all image like elements.