Mark your live deployments with userscripts

I recently launched a web service at its own domain. I am actively developing the service on my local machine, so I always have at least two instances running at the same time.

Thanks to that situation, I am scared whenever I change something that I'm doing the change to the wrong instance. Which would be bad.

So I built myself a little tool to help me discern between the two: a bright red tag that shows me which the live version is. It's really simple with a Userstyle. All I did was add a new userstyle for the domain name of my service:

@-moz-document domain("sixsafe.com") {

 body:before {

   content: "LIVE";

   font-size: 50px;
   background-color: red;
   color: #eee;

   margin: 0;
   padding: 100px 100px 5px 100px;

   position: absolute;
   top: -50px; left: -110px;

   -moz-transform: rotate(-45deg);
 }
}

You can see the result in the image: a bright red "LIVE" tag.

This solution is really great for me: It's non-intrusive, so no-one else can see it. It's easy to install without changing the service and it's pretty obvious which instance I am working with. Everything I wanted!