nForum Dark by paoloperrone

/* ==UserStyle==
@name           nForum Dark
@namespace      USO Archive
@author         Paolo Perrone
@version        1.1
@description    Accessible dark theme for the nForum (nforum.ncatlab.org) to be paired with the "nLab Dark" theme. 
@license        CC0-1.0
@preprocessor   uso
==/UserStyle== */

@-moz-document url-prefix("https://nforum.ncatlab.org/") {
        
    /* Main background color */
    body {
        background: hsl(198, 30%, 10%);
    }
               
    /* Main text color */
    html, body, div, 
    h1, h2, h3, h4, h5, h6,
    #Header h1,
    #Panel h2,
    #AccountProfile h2 {
        color: #fffe;
    }
        
    /* Secondary text color */
    #TagLine, 
    #Session,
    .ContentInfo h1,
    #AccountProfile .ProfileTitle p {
        color: #fffb;
    }
    
    #logo {
        filter: invert(100%);
        opacity: 90%;
        mix-blend-mode: lighten;
    }
      
    /* Links */
    a, .PageList a, .PageList li a,
    .DiscussionTopic a, .User.Name a,
    .CategoryName a,
    #Discussions ul a:hover {
        color: hsla(212, 35%, 70%, 0.95) !important;
    }    
    
    /* Links to nlab pages */
    a[href^="ncatlab.org/"],
    a[href^="http://ncatlab.org/"],
    a[href^="https://ncatlab.org/"] {
        color: hsla(120, 20%, 65%, 1) !important;
    }
    
    /* Header */
    #Header {
        background: hsla(198, 26.25%, 21.25%);
        border-top: 1px solid hsl(198, 10%, 41.5%);
        border-bottom: 1px solid hsl(198, 10%, 41.5%);
    }
    #TagLine a, #Session a {
        color: #fffe !important;
    }
        
    /* Navigation bar */    
    #Header ul li a {
        background-color: hsl(198, 21.75%, 34.75%);
        color: #fffe !important;
        border-bottom: 1px solid #fff6;
    }
    #Header ul li a:hover {
        background-color: hsl(198, 19.5%, 41.5%);
    }
    #Header ul li.TabOn{
        background: none;
        border: none;
    }
    #Header ul li.TabOn a, #Header ul li.TabOn a:hover {
        background-color: hsl(198, 18%, 46%) !important;
        border: 1px solid #fff6;
    }
        
    /* Left panel */
    #Panel {
        background: hsl(198, 29.75%, 12.25%);
        margin-left: 0px;
        padding-left: 18px;
        border-right: 1px solid hsl(198, 13.5%, 19%);
    }
    #Panel h1 {
        background: none;
    }
    #Panel h2 {
        border-bottom: 1px solid hsl(198, 10%, 41.5%);
    }
    #Panel a:hover, #Panel h1:hover {
        background: hsl(198, 25.5%, 23.5%) !important;
    }
    #AboutVanilla {
        border-top: 1px solid hsl(198, 10%, 41.5%);
        background: none;
        color: #fff8 !important;
    }
    #AboutVanilla a, #AboutVanilla a:hover {
        color: #fffb !important;
    }
    #Panel ul, #Panel p {
        color: #fffe;
    }
    #GuestSignIn p {
        background: hsl(198, 27%, 19%);
        border: 1px solid hsl(198, 10%, 41.5%);
        color: #fffc;
    }
    .Button {
        background: hsl(198, 24%, 28%);
        border: 1px solid hsl(198, 10%, 41.5%);
    }
    #openid_choice {
        filter: invert(100%) saturate(0%) brightness(120%);
        mix-blend-mode: screen;
    }
    
    /* Welcome to the nForum */
    .Notice {
        background: hsl(198, 27%, 19%);
        border: 1px solid hsl(198, 10%, 41.5%);
        color: #fffc;
    }
    
    /* Discussions */
    .PageInfo {
        color: hsl(198, 15%, 55%);
        border-top: 1px solid hsl(198, 10%, 41.5%);
        border-bottom: 1px solid hsl(198, 10%, 41.5%);
    }
    #Discussions li ul {
        border-bottom: 1px solid hsl(198, 10.25%, 38.5%);      
    }    
    .NoNewComments {
        background: none !important;
        border-top-right-radius: 0px;
    }   
    #Discussions li.Read.NewComments ul,
    #Discussions li.Unread.NewComments ul,
    .NewComments{
        background: hsl(198, 27.75%, 16.75%) !important;        
    }
    #Discussions li.Read.NoNewComments ul {
        background: hsl(198, 29%, 13%) !important;
        border-bottom: none;
    }
    #Discussions ul span, #Discussions ul span a, #Discussions ul a {
        color: #fffb;
    }
    #Discussions li ul {
        color: #fff9;
    }
    .NewComments .DiscussionNew a {
        color: #fffe !important;
    }
    #frmPostComment * { 
        color: #fffc !important;
    }
    #Comments li
    {
        background: none;
        border-bottom: 1px solid hsl(198, 10%, 41.5%);
    }
    #Comments .CommentBody {
        background: none;
    }
    #Comment_Preview {
        background: none !important;
    }
    
    /* Forms */
    #Form form {
        background: hsl(198, 27.75%, 16.75%);
        border: 1px solid hsl(198, 10.5%, 37%);
    }
    #Form.AddComments label, #Form li {
        color: #fffe;
    }
    #Form label a {
        background: hsl(198, 11.5%, 32.5%);
        border: 1px solid hsl(198, 7.5%, 55%);
        color: #fffe !important;
    }
    textarea {
        border: 1px solid hsl(198, 10%, 41.5%) !important;
        background-color: hsl(198, 30%, 10%) !important;
        color: #fffe !important;
    }
    input {
        border: 1px solid hsl(198, 7.5%, 55%) !important;
        background: hsl(198, 30%, 10%);
        color: #fffe;
    }
    #Form .Button {
        background: hsl(198, 11.5%, 32.5%);
        color: #fffd !important;
    }
    #Form fieldset legend,
    #Form.Account legend,
    #Form.Account *, #frmPostDiscussion * {
        color: #fffe !important;
    }
    /* Advanced search */
    .SearchSwitch {
        color: #fffe !important;
        background: hsl(198, 24%, 28%);
        border: 1px solid hsl(198, 7.5%, 55%);
    }
    .SearchInput,
    .SearchSelect, .CategorySelect  {
        color: #fffe !important;
        background: hsl(198, 30%, 10%);
        border: 1px solid hsl(198, 7.5%, 55%);
    }
    .SearchSelect option, .CategorySelect option {
        color: #fffe !important;
        background: hsl(198, 30%, 10%);
    }
    
    /* Log in */
    #Form label {
        color: #fffe;
    }
    fieldset p {
        color: #fffc;
    }
    .ForgotPasswordLink a, .ApplyForMembershipLink a {
        background: hsl(198, 30%, 10%) !important;
        color: #fffc !important;
    }
    .ForgotPasswordLink a:hover, .ApplyForMembershipLink a:hover {
        background: hsl(198, 25.5%, 23.5%) !important;
    }
    
    /* Log out */
    .SiteContainer {
        background: none;
        border: 1px solid hsl(198, 7.5%, 55%);
    }
    .FormComplete {
        background: none;
    }
    .FormComplete h2 {
        color: #fffe;
    }
    .FormComplete a:hover {
        background: none;
    }
    .SiteContainer h1 {
        background: hsl(198, 25.5%, 23.5%);
        border-bottom: 1px solid hsl(198, 15%, 55%);
    }
    
    /* Categories list */
    .UnblockedCategory {
        background: none;
    }
    #Categories {
        border-top: 1px solid hsl(198, 10.25%, 38.5%);
    }
    #Categories li ul {
        border-bottom: 1px solid hsl(198, 10.25%, 38.5%);
    }
    
    /* Misc */
    #Comments pre,
    #Comments blockquote {
        border-left: 6px solid hsl(198, 25.5%, 23.5%);
        background: hsl(198, 27.75%, 16.75%);
        color: #fffe;
    }
    #Comments code {
        background: none;
    }
    #AccountProfile .Tagline {
        border-top: 1px solid hsl(198, 10%, 41.5%);
        border-bottom: 1px solid hsl(198, 10%, 41.5%);
        background: hsl(198, 27%, 19%);
        color: #fffe !important;
    }
    
    /* Starting to make it responsive - it will need more work. */
    @media only screen and (max-width: 680px){
        #TagLine {
            margin-top: 30px;
            width: 70%;
        }
        #Session {
            top: 50px;
        }
        #Header ul li {
            display: inline-block;
            margin-top: 1px;
        }
    }
    
}