Sleazy Fork is available in English.

CSS for coronabuddy

@require library

Version vom 23.05.2020. Aktuellste Version

Dieses Skript sollte nicht direkt installiert werden. Es handelt sich hier um eine Bibliothek für andere Skripte, welche über folgenden Befehl in den Metadaten eines Skriptes eingebunden wird // @require https://update.sleazyfork.org/scripts/403974/808214/CSS%20for%20coronabuddy.js 

// CSS rules for coronabuddy
let darkModeSet = false;
let darkModeEnabled = true;
let darkModeInjected = false;


let darkCSS = /*css*/ `
@import url('https://fonts.googleapis.com/css?family=Press+Start+2P&display=swap');

::selection {
  background: #B4D5FE;
}

::-moz-selection {
  background: #B4D5FE;
}

blockquote {
  border: 1px solid linen !important;
}

html:not(root) body {
  background-color: #121212 !important;
}

html:not(root) div {
  border: 0px !important;
}

html:not(root) p {
  color: white !important;
}

#af-wrapper a {
  color: lime !important;
  outline: 0;
}

#af-wrapper small .profile-link {
  /* This fixes a critical bug with the forum addon that seems to allow arbitrarily long user names without truncation, breaking UX */
  display: inline-block !important;
  vertical-align: bottom !important;
  max-width: 5vw !important;
  max-height: 2em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

#af-wrapper .forum-description {
  color: linen;
}

#af-wrapper #forum-header {
  background-color: #006600 !important;
}

#af-wrapper #forum-navigation a {
  border-color: green !important;
}

#af-wrapper .pages > strong {
  background-color: rgba(50, 255, 50, 0.6) !important;
  color: linen !important;
}

#af-wrapper #profile-content {
  background-color: #232323 !important;
  color: linen !important;
}

#af-wrapper #profile-layer {
  background-color: #232323 !important;
}

#af-wrapper #profile-navigation {
  /* Override random !important in the WP CSS */
  background-color: green !important;
}

#af-wrapper #profile-navigation a.active {
  /* Override random !important in the WP CSS */
  background-color: #006600 !important;
}

#af-wrapper .button-normal {
  /* Override random !important in the WP CSS */
  background-color: #006600 !important;
  border: 0px;
}

#af-wrapper .content-element:nth-child(2n):not(.topic-sticky) {
  background-color: #121212 !important;
}

#af-wrapper .topic-sticky {
  background-color: #121212 !important;
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
}

#af-wrapper .topic-sticky .fa-comments {
  color: tomato !important;
}

#af-wrapper .topic-sticky .topic-name > a {
  color: #d6203b !important;
  font-weight: 700 !important;
}

#af-wrapper .editor-row-subject {
  background-color: black !important;
  color: gray !important;
}

#af-wrapper .editor-row-subject > span > input {
  background-color: #232323 !important;
  color: linen !important;
}


#af-wrapper .forum-post-menu a {
  color: green !important;
}

#af-wrapper .pages {
  background-color: #232323 !important;
  border-color: gray !important;
  border: 1px solid gray !important;
}

#af-wrapper .pages > a {
  border-right: 1px solid gray !important;
  border-left: 1px solid gray !important;
  color: lime !important;
}

#af-wrapper .pages a:hover {
  background-color: lime !important;
  color: black !important;
}

#af-wrapper .pages strong {
  border-right: none;
  color: black !important;
}

#af-wrapper .post-author .topic-author {
  color: red !important;
  font-weight: 900;
  font-size: 1.1em;
  -webkit-text-stroke: 1px black !important;
}

#af-wrapper .post-message > blockquote::after {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(249, 249, 249, .4)) !important;
}

#af-wrapper .post-element {
  border: 2px gray solid !important;
}

#af-wrapper .title-element {
  background-color: #006600 !important;
}

#af-wrapper .topic-sticky .topic-poster {
  border-left: 0px;
  background: none !important;
}

#af-wrapper .unread {
  color: lime !important;
}

#forum-breadcrumbs > span > a > span {
  color: linen;
}

#forum-search {
  background-color: #232323 !important;
}

#poll-panel {
  background-color: #000000 !important;
  color: linen !important;
}

#read-unread {
  display: none !important;
}

.avatar {
  border: none !important;
}

.background-contrast {
  background-color: #232323 !important;
}

.content-container {
  background-color: #232323 !important;
  border-color: black !important;
}

.dark .site-container {
  background-color: #121212 !important;
}

.editor-row {
  background-color: #121212 !important;
}

.forum {
  border-bottom: 0px !important;
}

.forum-editor-button {
  border: none !important;
}

.forum-poster {
  border-left: 0px !important;
}

.forum-post-date:after {
  content: '';
  width: 40vw !important;
  height: 1px !important;
  display: block;
  position: absolute;
  border-bottom: 1px solid gray !important;
}

.forum-post-header {
  border-color: gray !important;
}

.footer-widgets {
  background-color: #232323;
}

.mce-container-body {
  background-color: #121212 !important;
}

.poll-result-numbers {
  color: linen !important;
}

.poll-result-total {
  color: linen !important;
}

.post-counter {
  color: linen;
}

.post-element {
  background-color: #232323 !important;
}

.post-wrapper {
  background-color: #121212 !important;
  color: linen !important;
  border: 0px !important;
  border-right: 1px gray solid !important;
}

.quotetitle {
  color: linen;
}

.reaction.up:hover {
  color: lime !important;
}

.reaction.up > .reaction-icon {
  color: lime !important;
}

.reaction.up > .reaction-icon.reaction-inactive {
  color: gray !important;
}

.reaction.up > .reaction-number {
  color: lime !important;
}

.reaction.down:hover {
  color: red !important;
}

.reaction.down > .reaction-icon {
  color: red !important;
}

.reaction.down > .reaction-icon.reaction-inactive {
  color: gray !important;
}
.reaction.down > .reaction-number {
  color: red !important;
}

.spoiler-head {
  background-color: black !important;
  border: 1px solid linen !important;
}

.topic {
  border-bottom: 0px !important;
}

.topic-poster {
  border-left: 0px !important;
}

.popup {
position: relative;
}

.popup__banner {
  background-color: $black;
  height: 2.5em;
  margin-top: 2em;
  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2), 0px 4px 5px 0px rgba(0,0,0,0.14), 0px 1px 10px 0px rgba(0,0,0,0.12);
}

.popup__banner--text {
  color: lime !important;
  font-size: 0.8em;
  font-family: 'Press Start 2P', cursive;
  text-align: center;
}

.popup__textarea {
  color: lime !important;
  background-color: black !important;
  font-size: 1.1em;
  padding: 0.5em 0.5em 0.5em 0.5em;
  width: 60%;
  height: 20em;
  resize: none;
  margin-bottom: 0.3em;
  margin-top: 1em;
}

.popup__textarea:focus {
 outline: none;
}

.popup__button {
  background-color: rgb(45, 45, 45);
  width: 50%;
  height: 3em;
  border: 0px solid lime !important;
  font-size: 1em;
  display: block;
  margin: 0 auto;
  border: none;
  box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.2), 0px 2px 2px 0px rgba(0,0,0,0.14), 0px 3px 1px -2px rgba(0,0,0,0.12);
  transition: border 0.3s;

}

.popup__button:focus {
    outline: none;
}

.popup__button:hover {
    border: 4px solid lime !important;
    transition: border 0.3s;
}

.popup__button:active {
    background-color: lime !important;

}

.popup__button--invert {
  background-color: lime !important;
  color: $black !important;
}

.popup__button--black {
  background-color: rgb(45, 45, 45);
}

.popup__button--center {
  display: block;
  text-align: center;
}

.popup__button--text {
  color: lime !important;
  font-weight: 500;
  font-family: 'Press Start 2P', cursive;
  margin: 0;
  font-size: 0.5em;
  &:active {
    color: $black !important;
  }
}

.popup__button--save {
  margin-bottom: 0.5em;
}

.popup__button--clear {
}

.popup__notification {
  color: $red;
  font-weight: 700;
  margin-top: 0.5em;
}

.popup__darkmode {
  margin-top: 1em;
  text-align: center;
}

.popup__darkmode--text {
  display: inline-block;
  color: lime !important;
  font-size: 0.6em;
  font-family: 'Press Start 2P', cursive;
  margin-right: 0.5em;
}

.popup__darkmode--checkbox {
  display: inline-block;
  height: 0.8em;
  width: 0.8em;
  background-color: #555;
  border-radius: 0.1em;
  margin-bottom: -0.08em;
  user-select: none;
}

.popup__darkmode--checkbox--check:after {
  content: '✓';
  position: absolute;
  color: lime !important;
  font-size: 0.6em;
  font-weight: 900;
  margin-left: -0.42em;
  margin-top: 0.1em;
}
`;

const OBSERVER = new MutationObserver(parseNodes);

OBSERVER.observe(document, {
  attributes: true,
  childList: true,
  subtree: true,
});

function parseNodes(mutations) {
  if (darkModeEnabled && document.head && darkModeSet === false) {
    darkModeSet = true;
    document.head.lastChild.after(
      templateDOMElement({
        tag: "style",
        innerHTML: darkCSS,
        id: "coronaBuddyDarkMode__selector",
        classList: "",
        style: "",
      })
    );
  }
  // sloppy injection fix for iframes
  try {
    if (
      document.querySelector("#message_ifr") &&
      document.querySelector("#message_ifr").contentWindow.document.body &&
      !darkModeInjected &&
      darkModeEnabled
    ) {
      document.head.lastChild.after(
        templateDOMElement({
          tag: "style",
          innerHTML: darkCSS,
          id: "coronaBuddyDarkMode__selector",
          classList: "",
          style: "",
        })
      );

      console.log("Injected darkmode.");
      darkModeInjected = true;
      document
        .querySelector("#message_ifr")
        .contentWindow.document.head.querySelector("style").innerHTML +=
        "body {background-color: #121212 !important; color: white !important;} blockquote {border: 1px solid linen !important;}";
    }
  } catch (error) {
    console.log(error);
  }
}