Weasyl.com - Dark Theme by SeanTheSquirrel

/* ==UserStyle==
@name         Weasyl.com - Dark Theme
@version      20241023.01.16
@namespace    Sean_The_Squirrel
@description  A dark theme I made out of boredom, as the site does not offer any custom themes by default.
@author       Sean_The_Squirrel
@license      GPL-3.0-or-later
==/UserStyle== */

@-moz-document domain("weasyl.com") {
.content {
  background-color:#1d2224;
  color:#c5c5c5;
  padding-bottom:16px;
  padding-bottom:1rem;
  position:relative;
  z-index:1
}
a.more-block {
  background-color:#373737;
}
.content li.more,
.content a.more {
  border-color:#c0c0c0;
  color:#AAA;
}
.content h3 {
  text-shadow:0 1px 0 rgba(0, 0, 0, .8);
}
.comment .comment-content {
  border:1px solid #ccc;
  border-radius:5px;
  background-color:#373737;
  position:relative
}
.comment.hypothetical .comment-content {
  border:1px solid #bababa;
  padding-bottom:16px;
  padding-bottom:1rem
}
.button,
.content .button,
.stage .content .button {
  display:inline-block;
  vertical-align:baseline;
  padding:0.4em 1.2em;
  border:1px solid #bbb;
  border-top-color:#ccc;
  border-bottom-color:#aaa;
  border-radius:2px;
  color:#444;
  background-color:transparent;
  background-image:linear-gradient(rgba(255, 255, 255, .77), rgb(255, 255, 255));
  text-decoration:none;
  cursor:pointer;
  text-shadow:0 1px 0 #7373736e;
  transition:background-color 0.25s ease
}
.button:hover,
.button:focus,
.hover .button,
.stage .content .button:hover,
.stage .content .button:focus {
  background-color:#fff;
  text-decoration:none;
  box-shadow:0 1px 2px rgb(23, 147, 145);
  outline:none
}
@media (min-width: 60em) {
  .on-side a.more-block {
    background-color:#282828;
  }
@media (min-width: 60em) {
  #user-content {
    position:relative
  }
  #user-content::before {
    content:"";
    display:block;
    width:39%;
    height:auto;
    position:absolute;
    right:16px;
    right:2rem;
    top:0;
    bottom:0;
    z-index:1;
    background-color:#d2d2d2;
    box-shadow:inset 5px 0 15px -5px #b2b2b2
  }
    }
}
 #user-content::before {
    background-color:#373737;
    box-shadow:inset 5px 0 15px -5px #000;
    right: 0rem;
  }
.color-c,
.home-pane-link,
.title,
.content a {
  color:#00c5ff
}
.tag {
  display:inline-block;
  line-height:1.75rem;
  padding:0 1em;
  border:1px solid #ccc;
  border-radius:4px;
  background-color:#444;
  font-weight:normal
}
.marketplace-desc-fade {
  position:absolute;
  height:12em;
  width:100%;
  top:0;
  left:0;
  background-image:linear-gradient(to top, #000 2%, rgba(0,0,0,0) 15%);
  border-bottom:2px solid #929292;
  box-sizing:border-box;
  pointer-events:none
}
blockquote {
  background-color:#373737;
  border:1px dashed #c0c0c0;
  padding:8px 12px;
  padding:0.5rem 0.75rem;
  border-radius:4px
}
.text-post-item {
  background-color:#333;
  display:flex;
  margin:1em 0
}
.text-post-text {
  background-color: #000;
  flex:1;
  padding:1em
}
.input-checkbox:hover {
  background-color:#4e4e4e
}
.input-checkbox.checked {
  background-color:#4e4e4e;
  box-shadow:0 1px 0 rgba(0,0,0,0.1)
}
.comments li .comment+ul::before {
  content:"";
  display:block;
  width:50%;
  height:auto;
  position:absolute;
  left:2%;
  bottom:0;
  border-left:1px solid #b4b4b4;
  z-index:-1;
}
.comments li ul li::after {
  content:"";
  display:block;
  width:1%;
  height:8px;
  position:absolute;
  left:-2.1%;
  top:24px;
  border-top:1px solid #b4b4b4;
  border-left:1px solid #1d2224;
  background-color:#1d2224;
  box-shadow:inset 0 0.1px 0 #eee
}
.content .thumbnail-grid .title,
.content .thumbnail-grid .title a {
  color:#fff
}
.stage .content h3 {
  color:#c4c4c4;
}
.markdown-preview {
  position:relative;
  z-index:0;
  display:block;
  padding:14px 16px;
  padding:0.8rem 1rem;
  background-color:#383838de;
  border:1px solid #ccc
}
.markdown-preview::after {
  content:"PREVIEW";
  position:absolute;
  z-index:-1;
  top:0;
  right:0;
  bottom:0;
  left:0;
  padding:0.2em 0.2em 0 0;
  background:linear-gradient(-45deg, transparent 25%, rgba(0,0,0,0.02) 25%, rgba(0,0,0,0.02) 50%, transparent 50%, transparent 75%, rgba(0,0,0,0.02) 75%);
  background-size:50px 50px;
  text-align:right;
  font-size:1.8em;
  letter-spacing:4px;
  color:rgba(107, 107, 107, .43);
}
body>div#page-container>div.clear {
background: none !important;
}
blockquote blockquote {
  background-color:#242424
}
blockquote {
  background-color:#373737;
  border:1px dashed #606060;
  padding:8px 12px;
  padding:0.5rem 0.75rem;
  border-radius:4px
}
@media (min-width: 83em) {
  #user-content::before {
    width:34.5%;
  }
}
.formatted-content pre {
  background-color:#595353;
}
}