Brainly Dark Mode

Transforms all Brainly websites into a clean, eye-friendly dark theme. Covering every regional domain automatically.
Ask a question, post a review, or report the script.
Wrap lines
// ==UserScript==
// @name         Brainly Dark Mode
// @namespace    https://greasyfork.org/en/users/1375891-wibu-elite
// @version      1.0
// @description  Transforms all Brainly websites into a clean, eye-friendly dark theme. Covering every regional domain automatically.
// @author       Kinnena
// @match        *://*brainly.in/*
// @match        *://*brainly.it/*
// @match        *://*brainly.co.id/*
// @match        *://*brainly.ro/*
// @match        *://*brainly.ph/*
// @match        *://*brainly.lat/*
// @match        *://*brainly.pl/*
// @match        *://*brainly.com.br/*
// @include      /^https?:\/\/[^/]*brainly[^/]*\//
// @icon         https://static.vecteezy.com/system/resources/thumbnails/067/941/716/small_2x/brainly-logo-rounded-transparent-background-for-homework-help-app-free-png.png
// @grant        GM_addStyle
// @license      MIT
// ==/UserScript==

(function() {
  'use strict';

  GM_addStyle(`
    :root {
      color-scheme: dark !important;
    }

    html, body {
      background-color: #121212 !important;
      color: #e0e0e0 !important;
    }

    *, *::before, *::after {
      background-color: inherit;
    }

    div, section, main, article,
    header, footer, nav, aside,
    form, fieldset, li, ul, ol,
    p, span, label {
      background-color: transparent !important;
      color: #e0e0e0 !important;
      border-color: #333 !important;
    }

    [class*="card"],
    [class*="Card"],
    [class*="box"],
    [class*="Box"],
    [class*="container"],
    [class*="Container"],
    [class*="panel"],
    [class*="Panel"],
    [class*="wrapper"],
    [class*="Wrapper"] {
      background-color: #1e1e1e !important;
      border-color: #333 !important;
    }

    nav, header, [class*="navbar"],
    [class*="Navbar"], [class*="sidebar"],
    [class*="Sidebar"], [class*="topbar"],
    [class*="Topbar"] {
      background-color: #1a1a1a !important;
      border-color: #333 !important;
    }

    input, textarea, select {
      background-color: #2a2a2a !important;
      color: #e0e0e0 !important;
      border-color: #444 !important;
    }

    input::placeholder,
    textarea::placeholder {
      color: #888 !important;
    }

    button {
      background-color: #2a2a2a !important;
      color: #e0e0e0 !important;
      border-color: #444 !important;
    }

    [class*="primary"], [class*="Primary"],
    [class*="btn-brand"], [class*="sg-button--solid-indigo"],
    [data-testid*="submit"] {
      background-color: #4a3fbf !important;
      color: #fff !important;
    }

    a {
      color: #7c9cff !important;
    }

    a:hover {
      color: #a0b8ff !important;
    }

    h1, h2, h3, h4, h5, h6 {
      color: #ffffff !important;
    }

    table, tr, td, th {
      background-color: #1e1e1e !important;
      border-color: #333 !important;
      color: #e0e0e0 !important;
    }

    [class*="modal"], [class*="Modal"],
    [class*="dialog"], [class*="Dialog"],
    [class*="popup"], [class*="Popup"],
    [class*="dropdown"], [class*="Dropdown"] {
      background-color: #252525 !important;
      border-color: #444 !important;
    }

    img, video, svg, canvas, iframe {
      filter: none !important;
    }

    ::-webkit-scrollbar {
      background-color: #1e1e1e;
      width: 8px;
    }
    ::-webkit-scrollbar-thumb {
      background-color: #444;
      border-radius: 4px;
    }
    ::-webkit-scrollbar-track {
      background-color: #1a1a1a;
    }
  `);

})();