Brainly Dark Mode

Transforms all Brainly websites into a clean, eye-friendly dark theme. Covering every regional domain automatically.

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램을 설치해야 합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

// ==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;
    }
  `);

})();