1. Aaron DC

    Aaron DC Contributing Member Contributor

    Joined:
    May 12, 2015
    Messages:
    2,609
    Likes Received:
    1,317
    Location:
    At my keyboard

    Aaron's stylish stuff

    Discussion in 'Support & Feedback' started by Aaron DC, Aug 19, 2015.

    Stylish is a plugin for Firefox. It allows you to modify CSS on the fly for websites / URLs of your choice. Possibly completely stepping on toes or of no interest but thought I'd share.

    1. First change is max width of text. My 1920 px wide monitor makes reading full-width text uncomfortable, so I limit it to 800px.
      Code:
      .messageText, .messagetext pre {
          max-width: 800px;
      }
    2. Next, I finally found the "Edited" text, way over the RHS of the screen, in light, unobtrusive grey. To make it stand out I am going to colour it red and bold it.
      Code:
      .message .editDate {
          color: #FF0000;
          font-weight: bold;
      }

    WF before 1.PNG

    WF after 1.PNG
     
    Last edited by a moderator: Aug 20, 2015
    Daniel and OurJud like this.
  2. OurJud

    OurJud Contributing Member Contributor

    Joined:
    May 21, 2009
    Messages:
    2,374
    Likes Received:
    1,114
    Location:
    England
    I use Firebug all the time when customising blog templates, but that only acts as a preview and code finder tool. Any changes you make aren't permanent.

    Didn't realise there was one that allowed permanent changes to website layouts. I only have a 17" monitor, so width is rarely a problem, but good to know it's out there.
     
  3. Komposten

    Komposten Insanitary pile of rotten fruit Staff Supporter Contributor

    Joined:
    Oct 18, 2012
    Messages:
    1,756
    Likes Received:
    766
    Location:
    Sweden
    I wrapped the code snippets in [code][/code] BBCode to make it easier to read. :)
     
    Last edited: Aug 20, 2015
    Aaron DC likes this.
  4. Aaron DC

    Aaron DC Contributing Member Contributor

    Joined:
    May 12, 2015
    Messages:
    2,609
    Likes Received:
    1,317
    Location:
    At my keyboard
    Thanks! I so rarely post code I forgot about it! :oops:
     
  5. Aaron DC

    Aaron DC Contributing Member Contributor

    Joined:
    May 12, 2015
    Messages:
    2,609
    Likes Received:
    1,317
    Location:
    At my keyboard
    I turned this: public controls.JPG
    into this:
    public controls after.JPG

    by adding the following Stylish style:

    Code:
    .message .publicControls {
        float: none;
    }
    
     
    Daniel likes this.
  6. Daniel

    Daniel I'm sure you've heard the rumors. Founder Staff Contributor

    Joined:
    May 14, 2006
    Messages:
    2,690
    Likes Received:
    485
    Location:
    Peoria, Illinois
    Very cool plugin. I use a large monitor and I don't think I'd like the excess white space, but definitely a cool adjustment. Definitely like the second one.

    Feel free to keep us apprised of these. I'm certainly open to CSS/design improvements that could be rolled over into the default design.
     
    Aaron DC likes this.

Share This Page