MU Soapbox

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Muxify
    • Mustard

    Reskinning via CSS shenanigans

    Suggestions & Questions
    forum css
    2
    5
    2545
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Chime
      Chime last edited by

      Hello peoples. One of the more prominent things affecting my life lately has been an increasingly frequent and crippling set of headaches. Strangely enough, bold white backgrounds cause actual physical pain and mean I need to go rest that much sooner.

      So. I like gentler, low-ish contrast color-neutral light-on-dark themes for everything whenever and where-ever possible. There are a variety of ways to do this, but I'm on Chrome now and the easiest plugin for doing this programmatically on a site-by-site basis is Stylebot. There might be better ways, but this worked for me and may help others.

      It's still very much a work in progress, but this has made the forum much more manageable for me:

      .post-bar {
          background-color: #555;
          border: none;
      }
      
      a {
          color: #aaf;
      }
      
      div.category-body {
          background-color: #444;
          color: #ddd;
      }
      
      div.category-info {
          background-color: #444;
      }
      
      div.category-text p small {
          color: #888;
          font-size: 80%;
          font-style: italic;
      }
      
      div.container-fluid {
          background: inherit;
      }
      
      div.navbar-collapse.collapse.navbar-ex1-collapse {
          background-color: #444;
      }
      
      div.panel-body {
          background-color: #555;
      }
      
      div.post-content blockquote {
          border-color: #aaa;
          border-left: solid 2px;
      }
      
      div.row {
          background-color: #333;
      }
      
      div.topic-body {
          background-color: #333;
          border-style: none;
      }
      
      h1.navbar-brand.forum-title {
          color: #ddd;
          border-style: none;
      }
      
      html body {
          background-color: #333;
          color: #ddd;
      }
      
      li.category-item {
          background-color: #555;
          border-left-width: 0;
      }
      
      li.category-item.unread {
          background-color: #faa;
      }
      
      li.post-row {
          border: none;
      }
      
      ol.breadcrumb {
          background-color: #333;
      }
      
      button {
          color: #ddd;
          background-color: #666;
      }
      
      textarea.write {
          background-color: #333;
          color: #ddd;
      }
      
      div.preview.well {
          background-color: #333;
      }
      
      div.composer-container {
          background-color: #222;
          color: #ddd;
      }
      
      i {
          color: #ddd;
      }
      
      input.title.form-control {
          color: #ddd;
          background-color: #333;
      }
      
      button.navbar-toggle {
          border: none;
      }
      
      div.navbar {
          border: none;
      }
      
      .navbar-default {
          background-color: #333;
      }
      

      Not done yet:

      • Certain text entry widgets e.g. for tags
      • The chat system
      • Various dropdowns

      Anyone else interested or have thoughts/recommendations?

      It is by will alone I set my mind in motion. It is by the juice of Coffea arabica that thoughts acquire speed, the table acquires stains, the stains become a warning. It is by will alone I set my mind in motion.

      1 Reply Last reply Reply Quote 0
      • purldator
        purldator last edited by purldator

        If you like pleasing, dark, low-contrast palettes, then I fully suggest Solarized. It also has a contrasting lighter palette to go with it. I use it for Sublime Text when I'm coding. At one point I switched potatoMU to it and turned off COLOR256 in any MU* I was on, but kept the default 16-color ANSI.

        1 Reply Last reply Reply Quote 0
        • Chime
          Chime last edited by

          Solarized (dark) is a nice idea. The light one hurts as much as most of the rest. I'm still not a big fan of their color choices, but it does work.

          I'm mostly using Emacs in dark-mode with the wombat color theme, as I've probably shared before-- complete with large fonts for reducing eye-strain.

          If someone produced a solarized-dark option that I could just click on and enable for this forum, I'd use that. In the absence of it, this is what I have so far.

          If it seems a bit too gray, well. Better that than garish (nsfw).

          It is by will alone I set my mind in motion. It is by the juice of Coffea arabica that thoughts acquire speed, the table acquires stains, the stains become a warning. It is by will alone I set my mind in motion.

          purldator 1 Reply Last reply Reply Quote 0
          • purldator
            purldator @Chime last edited by

            @Chime Here's even more, which I admit to using for web design as much as for my coding environment.

            Chime 1 Reply Last reply Reply Quote 0
            • Chime
              Chime @purldator last edited by

              @purldator Oooh, that's actually got some very nice ones. A nice spread of clearly discernible but heavily desaturated colors is exactly what I'm looking for.

              It is by will alone I set my mind in motion. It is by the juice of Coffea arabica that thoughts acquire speed, the table acquires stains, the stains become a warning. It is by will alone I set my mind in motion.

              1 Reply Last reply Reply Quote 0
              • 1 / 1
              • First post
                Last post