Update the CSS, make it easier to generate them.

[xonotic/xonstat.git] / xonstat / static / css / app.css

diff --git a/xonstat/static/css/app.css b/xonstat/static/css/app.css
index 8202e04a1f8a402afd8f4ca22c1006b36ff5ad38..17c6a1108778c065c29461ce71099d9cee3d05cb 100644 (file)
--- a/xonstat/static/css/app.css
+++ b/xonstat/static/css/app.css
@@ -1,25 +1,25 @@
 /* Fonts */
 @font-face {
-    font-family: 'Xolonium';
-    src: url('fonts/xolonium.eot');
-    src: url('fonts/xolonium.eot?#iefix') format('embedded-opentype'),
-         url('fonts/xolonium.ttf') format('truetype'),
-         url('fonts/xolonium.woff') format('woff'),
-         url('fonts/xolonium.svg#xoloniumregular') format('svg');
-    font-weight: normal;
-    font-style: normal;
+  font-family: 'Xolonium';
+  src: url('fonts/xolonium-regular.eot');
+  src: url('fonts/xolonium-regular.eot?#iefix') format('embedded-opentype'),
+       url('fonts/xolonium-regular.woff2') format('woff2'),
+       url('fonts/xolonium-regular.woff') format('woff'),
+       url('fonts/xolonium-regular.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
 }
 
 body {
   background-color: #0F0F0F;
   background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)) repeat scroll 0% 0%, url("img/bg.jpg") no-repeat fixed center center / cover black;
   color: #9B9B9B;
-  font-family: "Xolonium", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: Xolonium, sans-serif;
 }
 
 h1, h2, h3, h4, h5 {
-  color: #C3C3C3;;
-  font-family: "Xolonium", Helvetica, Arial, sans-serif;
+  color: #C3C3C3;
+  font-family: Xolonium, sans-serif;
 }
 
 p {
@@ -50,7 +50,7 @@ table tr td {
   font-size: 10px;
 }
 
-table thead {
+table thead, table th {
   background-color: #001021;
 }
 
@@ -71,6 +71,10 @@ table thead tr th, table thead tr td, table tr th, table tr td {
   width: 100%;
 }
 
+.table-hover tr:hover {
+    background-color: #222;
+}
+
 .table-condensed th, .table-condensed td {
   padding: 4px 5px;
 }
@@ -85,6 +89,10 @@ table thead tr th, table thead tr td, table tr th, table tr td {
   height: 50px;
 }
 
+.top-bar, .top-bar-section {
+  display: inline-block;
+}
+
 .top-bar .name h1 a {
   color: rgb(200, 200, 200);
   font-size: 1.1rem;
@@ -97,7 +105,7 @@ table thead tr th, table thead tr td, table tr th, table tr td {
 
 .top-bar-section ul li > a {
   color: rgb(200, 200, 200);
-  font-family: 'Xolonium';
+  font-family: Xolonium, sans-serif;
   font-size: 1rem;
   text-shadow: 0px 1px 1px rgba(200, 200, 200, 0.4);
 }
@@ -140,6 +148,31 @@ table thead tr th, table thead tr td, table tr th, table tr td {
   box-shadow: 0 0 6px 1px rgba(0, 140, 186, 0.7);
 }
 
+/* accordion overrides */
+.accordion .accordion-navigation, .accordion dd {
+  border: 1px solid #222222;
+  margin-bottom: 5px;
+}
+
+.accordion .accordion-navigation > a, .accordion dd > a {
+  background: none;
+  color: #C3C3C3;
+  font-family: Xolonium, sans-serif;
+  font-size: 0.8rem;
+}
+
+.accordion .accordion-navigation > .content.active, .accordion dd > .content.active {
+  background: none;
+}
+
+.accordion .accordion-navigation.active > a, .accordion .accordion-navigation > a:hover {
+  background: #242424;
+}
+
+ul.accordion {
+  margin-left: 0;
+}
+
 /* Footer */
 #footer {
   background: linear-gradient( rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 95% );
@@ -216,6 +249,64 @@ table thead tr th, table thead tr td, table tr th, table tr td {
   color: gray;
 }
 
+.game {
+  margin-bottom: 1rem;
+}
+
+.game a {
+    color: #CCC;
+}
+
+.game a:hover {
+    color: #d95f00;
+    text-decoration: none;
+}
+
+.game tr {
+    background-color: #000;
+}
+
+.game tr.red {
+  background-color: #4d0000;
+}
+
+.game tr.blue {
+  background-color: #00004d;
+}
+
+.game tr.yellow {
+  background-color: #4d4d00;
+}
+
+.game tr.pink {
+  background-color: #4d004d;
+}
+
+.teamscore {
+  text-shadow: -1px -1px 0 #222;
+  font-weight: bold;
+}
+
+.teamscore .red {
+  color: #ad0000;
+}
+
+.teamscore .blue {
+  color: #0000ad;
+}
+
+.teamscore .yellow {
+  color: #adad00;
+}
+
+.teamscore .pink {
+  color: #ad00ad;
+}
+
+.player-score {
+  color: #FEFF3A;
+}
+
 .tabs-content {
   margin-bottom: 0;
 }