Discourse Auto Dark Theme

Loads the Dracula color scheme for any discourse forum
Faça uma pergunta, publique uma avaliação, ou denuncie o script.
Quebra de linha automática
// ==UserScript==
// @name         Discourse Auto Dark Theme
// @namespace    http://tampermonkey.net/
// @version      1
// @description  Loads the Dracula color scheme for any discourse forum
// @author       gfish
// @license      MIT
// @match        *://*/*
// @grant        GM_addStyle
// @grant        unsafeWindow
// ==/UserScript==

(function() {
    let attempts = 0;
	let interv = setInterval(findDiscourse, 250);
	findDiscourse();
	function findDiscourse() {
        if (unsafeWindow.Discourse) {
            clearInterval(interv);
            console.log('[Discourse Auto Dark Theme] Found Discourse, injecting Dracula theme')
            GM_addStyle(`
:root {
     --primary: #f2f2f2 !important;
     --primary-high: #9da0b5 !important;
     --primary-very-high: #9da0b5 !important;
     --primary-medium: #727694 !important;
     --primary-low-mid: #727694 !important;
     --primary-low: #44475A !important;
     --primary-very-low: #44475A !important;
     --primary-high-or-secondary-low: #9da0b5 !important;
     --secondary: #282a36 !important;
     --secondary-high: #44475A !important;
     --tertiary: #bd93f9 !important;
     --tertiary-low: #44475A !important;
     --tertiary-very-low: #44475A !important;
     --quaternary: #8be9fd !important;
     --header_background: #282a36 !important;
     --header_primary: #f2f2f2 !important;
     --highlight: #f1fa8c !important;
     --danger: #ff5555 !important;
     --success: #50fa7b !important;
     --love: #ff79c6 !important;
     --hover: #44475A !important;
     --selected: #44475A !important;
     --d-sidebar-highlight-color: var(--primary) !important;
     --primary-700: var(--primary-high) !important;
     --primary-500: var(--primary-high) !important;
     --primary-400: var(--primary-medium) !important;
     --primary-300: var(--primary-medium) !important;
     --highlight-bg: var(--d-hover) !important;
     --inline-code-bg: var(--primary-low) !important;
}
// DRACULA THEME
:root {
  --d-sidebar-highlight-color: var(--primary) !important;
  --primary-700: var(--primary-high) !important;
  --primary-500: var(--primary-high) !important;
  --primary-400: var(--primary-medium) !important;
  --primary-300: var(--primary-medium) !important;
  --highlight-bg: var(--d-hover) !important;
}

@keyframes background-fade-highlight {
  0% {
    background-color: var(--d-hover) !important;
  }
  100% {
    background-color: transparent !important;
  }
}

textarea,
input {
  &::placeholder {
    color: var(--secondary-medium) !important;
  }
}

tbody {
  border-top: 3px solid var(--secondary-high) !important;
  tr.topic-list-item {
    border-bottom: 1px solid var(--secondary-high) !important;
    background-color: var(--secondary) !important;
  }
}

.alert.alert-info {
  background-color: var(--secondary-high) !important;
}

.topic-list td {
  color: var(--primary) !important;
}

// Header
.d-header {
  box-shadow: none !important;
  border-bottom: 1px solid var(--secondary-high) !important;
  height: 75px !important;
}

// Menu Panel Links
.panel-body-contents {
  a {
    color: var(--primary) !important;
  }
  .badge-wrapper.bullet span.badge-category {
    color: var(--primary) !important;
    font-weight: 400 !important;
  }
}

.user-menu .quick-access-panel li {
  .d-icon {
    color: var(--primary) !important;
  }
}

.user-menu .quick-access-panel .d-icon,
.user-menu .quick-access-panel:hover .d-icon,
.user-notifications-list .d-icon,
.user-notifications-list:hover .d-icon {
  color: currentColor !important;
}

.user-menu.revamped .tabs-list .btn.active {
  background: var(--tertiary) !important;
  color: var(--primary) !important;
  .d-icon {
    color: var(--primary) !important;
  }
  .badge-notification {
    background: var(--primary) !important;
  }
}

// notifications
.d-header .unread-notifications {
  background-color: var(--success) !important;
}
.unread-private-messages {
  background-color: var(--love) !important;
}

// Last visit line + text
.topic-list .topic-list-item-separator td {
  border-bottom: 1px solid $highlight-high#{90} !important;
  span {
    color: var(--highlight-high) !important;
  }
}

// title when injected on top of topics
.extra-info-wrapper {
  .topic-link {
    color: var(--primary) !important;
  }
  .categories-wrapper .badge-wrapper .badge-category {
    color: var(--primary) !important;
  }
}

// not visited topics
tr:not(.visited) .link-top-line .title {
  font-weight: 600 !important;
}

td .link-bottom-line .badge-category {
  font-weight: 400 !important;
}

.new-user-wrapper .user-navigation .nav-pills li a.active {
  color: var(--quaternary) !important;
  border-color: var(--quaternary) !important;
}

.new-user-wrapper .user-navigation .nav-pills li a:hover,
.new-user-wrapper .user-navigation .nav-pills li a:focus {
  color: var(--tertiary) !important;
  border-color: var(--tertiary) !important;
}

.nav-pills > li a.active,
.nav-pills > li button.active,
.nav-pills > li > a:hover,
.nav-pills > li button:hover {
  background: var(--tertiary) !important;
  color: var(--secondary) !important;
}

// create topic
button#create-topic {
  background-color: var(--success) !important;
  color: var(--secondary) !important;
  border-radius: 4px;
  .d-icon {
    color: var(--secondary) !important;
  }
  &:hover {
    background-color: var(--success-medium) !important;
  }
}

// header icons
.header-sidebar-toggle,
.d-header-icons {
  a,
  button {
    .d-icon {
      color: var(--primary) !important;
    }
  }
}

// category box color
.category-boxes .category-box-inner,
.category-boxes-with-topics .category-box-inner {
  border: 1px solid var(--secondary-high) !important;
}

// select kit collection
.select-kit-row .category-name,
.select-kit-row .name {
  color: var(--primary) !important;
}
.select-kit-row.is-highlighted[title='no tags'] span.name {
  color: var(--tertiary) !important;
}

// post notice
.post-notice {
  background-color: var(--secondary-high) !important;
}

// user name on posts and chat

.topic-meta-data {
  .names .username a {
    color: var(--success) !important;
  }
}

.chat-message-info__username__name {
  color: var(--success) !important;
}

// custom side bar styles
.custom-nav-list {
  li:hover,
  h3 a:hover {
    background-color: var(--tertiary-500) !important;
  }
}

.custom-nav-list h3 {
  border-color: var(--secondary-high) !important;
}

// avatar white background
img.avatar {
  background-color: var(--primary) !important;
}

.directory .me {
  background-color: var(--tertiary-medium) !important;
}

// topic progress
.timeline-container .topic-timeline .timeline-scrollarea {
  border-color: var(--love) !important;
  .timeline-handle {
    background-color: var(--love) !important;
  }
}

#topic-progress {
  color: var(--love-low) !important;
  background-color: var(--secondary) !important;
  border-color: var(--love) !important;
  .bg {
    background-color: var(--love) !important;
    border-color: var(--love) !important;
  }
}

// composer popup
.composer-popup {
  background: var(--secondary-high) !important;
}

// /top

.select-kit.dropdown-select-box.period-chooser
  .period-chooser-row
  .top-date-string,
.select-kit.dropdown-select-box.period-chooser
  .period-chooser-header
  h2.selected-name
  .top-date-string {
  color: var(--quaternary) !important;
}

// posts

.read-state {
  color: var(--quaternary) !important;
}

blockquote,
aside.quote .title {
  background: var(--primary-low) !important;
  border-color: var(--primary-medium) !important;
}

nav.post-controls .actions button.create,
nav.post-controls .actions a,
nav.post-controls .actions button {
  color: var(--primary-medium) !important;
  .d-icon {
    color: currentColor !important;
  }
  &.d-hover {
    color: var(--primary) !important;
  }
}

.discourse-no-touch .topic-body .actions .fade-out {
  opacity: 1;
}

pre code {
  background: var(--secondary-high) !important;
}

// chat

.no-touch {
  .chat-message-container:hover,
  .chat-transcript:hover,
  .chat-message-container.-active,
  .-active.chat-transcript {
    pre code {
      background: var(--secondary) !important;
    }
  }
}

.chat-transcript {
  border: 1px solid var(--primary-low) !important;
  background: var(--secondary) !important;
  .discourse-no-touch & {
    &:hover {
      background: inherit;

      pre code {
        background: rgba(var(--primary-rgb), 0.05) !important;
      }
    }
  }
}

// code

p > code {
  background: var(--primary-medium) !important;
}
`)
            return;
        }
        if (attempts > 30) {
			clearInterval(interv);
            console.log('[Discourse Auto Dark Theme] Could not find Discourse')
			return;
		}
		++attempts;
    }
})();