Theme

@import url("https://cdn.scpwiki.com/theme/en/black-highlighter/css/min/black-highlighter.min.css");
 
/* https://coolors.co/0c1713-cc3300-ff531f-49111c-674345-85756e-c0b39c-faf0ca */
 
:root {
  --deep-black: 12, 23, 19;
  --deep-rouge: 73, 17, 28;
  --medium-rouge: 103, 67, 69;
  --medium-nothingness: 133, 117, 110;
  --medium-straw: 192, 179, 156;
  --pale-straw: 250, 240, 202;
  --bright-orange: 204, 51, 0;
  --neon-orange: 255, 83, 31;
 
  --logo-image: url("http://notifications.wdfiles.com/local--files/theme/envelope-solid-straw.svg");
  --header-title: "Forum Notifications";
  --header-subtitle: "Get notified of new replies";
  --topbar-height-on-desktop: 0.5rem;
  --topbar-height-on-mobile: 0.5rem;
 
  /* Disable responsivity based on screen height */
  --base-font-size: 15px;
 
  --white-monochrome: var(--pale-straw);
  --gray-monochrome: var(--medium-nothingness);
  --light-gray-monochrome: var(--medium-nothingness);
  --very-light-gray-monochrome: var(--medium-straw);
  --black-monochrome: var(--deep-black);
  --bright-accent: var(--deep-rouge);
  --medium-accent: var(--medium-nothingness);
  --dark-accent: var(--bright-orange);
  --pale-accent: var(--neon-orange);
 
  --header-gradient-color-top: var(--deep-rouge);
  --header-gradient-color-middle: var(--deep-rouge);
  --header-gradient-color-bottom: var(--medium-rouge);
  --swatch-menubg-medium-dark-color: var(--deep-black);
 
  --link-color: var(--bright-orange);
  --visited-link-color: var(--bright-orange);
  --hover-link-color: var(--neon-orange);
 
  --tables-border: var(--medium-rouge);
}
 
#header {
  --swatch-headerh2-color: var(--medium-straw);
}
 
#main-content {
  --toc-header-bg-color: var(--bright-orange);
}
 
/* Jazz up links */
#page-content a {
  text-decoration-line: underline;
  text-decoration-color: rgb(var(--medium-straw));
}
#page-content a:hover {
  text-decoration-color: rgb(var(--hover-link-color));
  text-decoration-thickness: 2px;
}
 
/* Add some spacing between page sections */
#page-content h1 {
  margin-top: 2rem;
}
#page-content h2 {
  margin-top: 1.5rem;
}
#page-content h3 {
  margin-top: 1rem;
}
 
#page-title::after,
.meta-title::after {
  height: 0.5rem;
}
 
/* Never create a line break in a nametag */
.printuser a {
  display: inline-block;
}
 
/* Clean up horizontal rules */
hr {
  height: 0;
  background: none;
  border-top: none;
  border-bottom: thin solid rgb(var(--medium-straw));
}
 
/* TOCs */
 
/* Reduce the space allocated to the fold button */
#page-content div#toc {
  grid-template-areas: "fold title" "list list";
  grid-template-columns: 1rem 1fr;
}
/* Hide the fold button */
#toc #toc-action-bar > a:nth-child(1) {
  display: none !important; /* Override BHL important flex */
}
/* Recover the native TOC title; remove the BHL one */
#toc #toc-action-bar a::after {
  content: none;
}
#toc .title {
  margin: 0;
  color: rgb(var(--toc-header-text-color));
}
/* Thicken up the border */
#toc {
  border: 2px solid rgb(var(--toc-header-bg-color));
}
/* Remove the width limit and maximum height */
#toc, #toc-list {
  max-width: inherit !important;
  max-height: none !important;
}
/* Don't underline TOC links */
#toc a {
  text-decoration: none;
}
/* Bold H1 TOC links */
#toc-list [style$="1em;"] > a {
  font-weight: bold;
  --wght: 700; /* BHL compatibility hack */
}
 
/* Undo BHL font sizing */
.form-row,
#edit-page-form.data-form .form-row textarea {
  font-size: var(--base-font-size) !important;
}
 
/* Use default font for forms */
form#edit-page-form .form-labels {
  font-family: var(--header-font);
}
 
/* Undo all BHL styling to dropdowns */
#edit-page-form.data-form .form-row .form-values select,
#edit-page-form.data-form .form-row .form-values option {
  all: revert !important;
}
#edit-page-form.data-form .form-row td.form-labels select,
#edit-page-form.data-form .form-row td.form-labels option {
  border: thin solid rgb(var(--dark-accent));
  border-radius: 0;
}
.form-row:has(select, textarea, input) {
  margin-block: 0 3rem !important;
}
input.text, textarea {
  background-color: #fffde2 !important;
}
 
/* Remove BHL pseudo-fieldsets */
#edit-page-form.data-form .form-row .form-values,
#edit-page-form.data-form .form-row {
  box-shadow: none;
}
#edit-page-form.data-form .form-row .form-labels span::before {
  content: none;
}
#edit-page-form.data-form .form-row .form-labels span {
  text-transform: initial;
  padding: 0;
  font-size: 2em;
  font-weight: 800;
  --wght: 800;
}
#edit-page-form.data-form .form-row .form-labels {
  margin-left: 0;
}
#edit-page-form.data-form .form-row .form-labels span {
  padding: 0 !important;
}
.form-row * {
  transform: none !important;
}
 
/* Fix BHL radio buttons */
.radio-inline {
  display: flex;
  align-items: center;
}
.radio-inline input[type=radio] {
  margin-right: 0.5em !important;
}
input[type="radio"], input[type="radio"]:not(:checked)::before {
  background: none;
}
 
/* Make sidebar button have larger tap area */
@media (max-width: 56.25rem) {
  #header div.open-menu > p > a {
    min-height: 2rem;
    min-width: 2rem;
    background: rgb(var(--deep-black)) !important;
    transform: translateX(1rem);
  }
}
 
/* Add a thingy to the Your Config link to make it more noticeable */
.menu-item--your-config { position: relative; }
.menu-item--your-config a::after {
  content: "→ ";
  display: inline !important;
  color: rgb(var(--neon-orange));
  order: -1;
  margin-left: -1ch;
}
 
/* Hide unnecessary edit buttons */
#tags-button,
#files-button,
#print-button,
#site-tools-button,
#edit-sections-button,
#edit-append-button,
#edit-meta-button,
#watchers-button,
#parent-page-button,
#page-block-button,
#rename-move-button,
.page-watch-options,
.do-not-notify {
  display: none !important;
}