Custom style makeover guide

Did you know that browser add-ons let you add custom styling to websites?  If the default Oneslate appearance is too Plain Jane (or Average Joe) for you, you can change its appearance using this method!

Here’s a line of CSS that you can add using the Stylish add-on in Firefox, for example:

@-moz-document domain(demo.oneslate.com) { body { background-image: url('https://oneslate.com/hosted/rockywall.png') !important; background-repeat: repeat !important; } .topbar { background-color: black !important; } .node-container { border-radius:9px !important; box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.5); } .node-placeholder { border-radius:9px !important; } }

This example specifies that for the demo.oneslate.com site, the browser adds a subtle background pattern, darkens the topbar color, rounds the node edges, and applies a light shadow the the nodes. Check out the difference it makes:

After Custom Style:
Tree After Custom CSS
Standard Style:
Tree After Custom CSS

After Custom Style:
Tree After Custom CSS
Standard Style:
Tree After Custom CSS

After Custom Style:
Tree After Custom CSS
Standard Style:
Tree After Custom CSS

After Custom Style:
Tree After Custom CSS
Standard Style:
Tree After Custom CSS

If you need any assistance with a Oneslate deployment, personal help is just an email away: info@oneslate.com.