Simplify ticket state circles (#35)

* Simplify state circles

This removes duplicate directives from tabs.rst which will help if we have to reference the exact same code somewhere else. This commit can't be merged before 50bd993 because of compatibility

* QA: Fix whitspace and move style attrs to CSS

Co-authored-by: Ryan Lue <hello@ryanlue.com>

_static/theme/theme_overrides.css

@@ -1,10 +1,35 @@
 .wy-table-responsive table td {
-	white-space: normal !important;
+    white-space: normal !important;
 }
 
 .wy-table-responsive table td img {
     display: block;
     margin-left: auto;
     margin-right: auto;
     width: 50%;
-}
+}
+
+.zammad-state-circle {
+    width: 1em;
+    height: 1em;
+    border-radius: 50%;
+    border-width: 3px;
+    border-style: solid;
+    margin: -18px auto;
+}
+
+.border-green {
+    border-color: #31af68;
+}
+
+.border-charcoal {
+    border-color: #43484c;
+}
+
+.border-yellow {
+    border-color: #fcac01;
+}
+
+.border-red {
+    border-color: #f45801;
+}

advanced/tabs.rst

@@ -47,19 +47,19 @@ menu area. These are your **open tabs.**
 
      .. |grn| raw:: html
 
-        <div style="width: 1em; height: 1em; border-radius: 50%; border: 3px solid #31af68; margin: 0 auto"></div>
+        <div class="zammad-state-circle border-green"></div>
 
      .. |blk| raw:: html
 
-        <div style="width: 1em; height: 1em; border-radius: 50%; border: 3px solid #43484c; margin: 0 auto"></div>
+        <div class="zammad-state-circle border-charcoal"></div>
 
      .. |ylw| raw:: html
 
-        <div style="width: 1em; height: 1em; border-radius: 50%; border: 3px solid #fcac01; margin: 0 auto"></div>
+        <div class="zammad-state-circle border-yellow"></div>
 
      .. |red| raw:: html
 
-        <div style="width: 1em; height: 1em; border-radius: 50%; border: 3px solid #f45801; margin: 0 auto"></div>
+        <div class="zammad-state-circle border-red"></div>
 
    * A **pulsing dot** means that a ticket has new activity since you last viewed it.
    * Drag and drop tabs to rearrange them.

conf.py

@@ -34,4 +34,4 @@ def setup(app):
             'https://media.readthedocs.org/css/readthedocs-doc-embed.css',
             '_static/theme/theme_overrides.css'
         ],
-    }
+    }