Kotlin docs dark theme

Forked from https://userstyles.org/styles/145525/kotlin-site-dark-design-v2017-2

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(У мене вже є менеджер скриптів, дайте мені встановити його!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name         Kotlin docs dark theme
// @namespace    https://greasyfork.org/en/users/10848-sergio91pt
// @version      1.0.1
// @description  Forked from https://userstyles.org/styles/145525/kotlin-site-dark-design-v2017-2
// @author       sergio91pt
// @match        https://kotlinlang.org/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    document.querySelectorAll('.sample').forEach(node => {
        node.setAttribute('theme', 'darcula');
    });

    const css = `
/*home page tiles*/
  .kotlin-overview-section._get-kotlin .get-kotlin-options-list .option-item,
  .kotlin-overview-section._testimonials .testimonial,
  .kotlin-overview-section._features .kotlin-features-list .kotlin-feature
  {
    background-color: #222;
  }

  .kotlin-overview-section._features, .kotlin-overview-section._testimonials
  {
    background-color: #333;
    background-image: none;
  }

  .kotlin-overview-section._features .kotlin-features-list .feature-description
  {
    color: #B7D6F5;
  }

  .kotlin-overview-section._features .kotlin-features-list .feature-example-link
  {
    color: #87A7CD;
  }

  .kotlin-overview-section._features .kotlin-features-list .feature-example-link:hover
  {
    color: #EEE;
  }

/*main body*/
  body
  {
    color: #EEE;
    background-color: #222;
  }

/*API declarations*/
  .page-content .declarations
  {
    background: #313335;
  }

  .page-content .declarations a
  {
    color: #87A7CD !important;
  }

/*keywords in the body*/
  .page-content .keyword
  {
    color: #CC7832;
  }
/*code expressions in the body*/
  .page-content li>code,
  .page-content p>code
  {
    color: #A9D7E6;
    background-color: #2B2B2B;
  }

  .page-content table td, .page-content table th
  {
    background-color: #2B2B2B;
  }

  .page-content blockquote,
  .page-content blockquote.note
  {
    background-color: #2B2B2B;
  }

/*navigation buttons*/
  .docs-nav .nav-item-text
  {
    color: #B7D6F5;
    background-color: #252525;
    border-color: #EEE;
  }

/*selected navigation button*/
  .docs-nav .nav-item.is_active .nav-item-text
  {
    color: #252525;
    background-color: #EEF;
    border-color: #EEE;
  }
/*triangle under navigation button*/
  .docs-nav .nav-item-text:after
  {
    border-top-color: #EEF;
  }

  .docs-nav .nav-item-text:before
  {
    border-top-color: #EEE;
  }

/*navigation panel on the left*/
  .tree-branch-title
  {
    background-color: #222;
    color: #B7D6F5;
  }

  .tree-branch-title:hover
  {
    background-color: #222;
    color: #FFF;
  }

  .tree-branch-title.is_active
  {
    background-color: #222;
    color: #B7D6F5;
  }

  .tree-branch-title.is_active:hover
  {
    background-color: #222;
    color: #FFF;
  }

  .tree-branch._opened
  {
    background-color: #252525;
  }

  .tree-leaf-title.is_active
  {
    color: #EEE;
  }

  .tree-branch.js-item.js-branch._opened  a,
  a
  {
    color: #87A7CD;
  }

  .tree-branch.js-item.js-branch._opened  a:hover,
  a:hover
  {
    color: #EEE;
  }

/*code blocks*/
  .page-content .code._highlighted,
.page-content .code._highlighted span.cm-def, .cm-s-default .cm-def,
.page-content .code._highlighted span.cm-variable, .cm-s-default .cm-variable,
.page-content .code._highlighted span.cm-variable-2, .cm-s-default .cm-variable-2,
.page-content .code._highlighted span.cm-variable-3, .cm-s-default .cm-variable-3,
.page-content .code._highlighted span.cm-operator, .cm-s-default .cm-operator,
.page-content .code._highlighted span.cm-property, .cm-s-default .cm-property
.page-content .code._highlighted span.cm-qualifier,
.page-content .signature
  {
    color: #A9B7C6;
    background: #2B2B2B;
  }

  .page-content .code._highlighted span.cm-keyword, .cm-s-default .cm-keyword
  {
    color: #CB772F;
  }

  .page-content .code._highlighted span.cm-string, .cm-s-default .cm-string
  {
    color: #A5C25C;
  }

  .page-content .code._highlighted span.cm-comment, .cm-s-default .cm-comment
  {
    color: #808080;
  }

  .page-content .code._highlighted span.cm-number, .cm-s-default .cm-number
  {
    color: #6897BB;
  }

  .page-content .code._highlighted span.cm-atom, .cm-s-default .cm-atom
  {
    color: #9876AA;
  }

  .page-content .code._highlighted span.cm-tag
  {
    color: #E8BF6A;
  }

  .page-content .code._highlighted span.cm-attribute
  {
    color: #BABABA;
  }

  .page-content .code._highlighted span.cm-meta
  {
    color: #E8BF6A;
  }

  .standard-output
  {
    color: #EEE!important;
  }

  .error-output
  {
    color: #CD3524!important;
  }
/*dropdowns*/
  .dropdown-items
  {
    background: #2B2B2B!important;
  }

  .dropdown.js-dropdown
  {
    background: #252525!important;
  }

  .dropdown-selected-value
  {
    background: #313335 !important;
  }

  .dropdown-item:hover
  {
    background-color: #555555;
  }
    `;

    const style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    document.body.appendChild(style);
})();