1 files changed, 198 insertions, 0 deletions
diff --git a/static/style.css b/static/style.css
new file mode 100644
index 0000000..d206836
--- /dev/null
+++ b/static/style.css
@@ -0,0 +1,198 @@
+body {
+  color: white;
+  background-color: #1d1d1d;
+  font-family: sans-serif;
+}
+a {
+  color: white;
+  text-decoration: none;
+}
+
+ul#flash {
+  padding:10px;
+  margin:10px 0;
+  background-color: #FFBABA;
+  color: #D8000C;
+}
+
+ul#flash > li:before {
+  content: "\26A0";
+}
+
+ul#flash > li {
+  font-style:normal;
+  font-weight:400;
+  speak:none;
+  display:inline-block;
+  text-decoration:inherit;
+  margin-right:.2em;
+  text-align:center;
+  font-variant:normal;
+  text-transform:none;
+  line-height:1em;
+  margin-left:.2em;
+}
+
+ul#menu {
+  list-style-type: none;
+  margin-bottom: 20px;
+  padding: 0px;
+  overflow: hidden;
+  /* background-color: #ff00ff; */
+}
+
+li.menu {
+  float: left;
+  padding: 0px 5px;
+}
+
+li a {
+  display: block;
+  width: 150px;
+  text-align: center;
+  text-decoration: none;
+}
+
+li.app {
+  float: right;
+}
+
+li a:hover {
+  background-color: #ff0000;
+}
+
+.joinbutton {
+  color: white;
+  background-origin: padding-box;
+  background-image: linear-gradient(to bottom, rgb(164, 208, 7) 5%, rgb(83, 105, 4) 95%);
+  font-size: 12px;
+  line-height: 20px;
+  padding: 4px 6px 4px 6px;
+  border-radius: 4px;
+}
+
+.joinbutton:hover {
+  background-image: linear-gradient(to bottom, rgb(164, 208, 7) 25%, rgb(83, 105, 4) 75%);
+}
+
+/* Playerbox with Playerstats / Gamestats inside */
+div.player {
+  display: inline-block;
+  width: 330px;
+  min-height: 150px;
+  text-align: center;
+  margin: 2px 5px 2px 5px;
+  padding: 0px;
+  /* border: 1px solid black; */
+}
+/* Intern box of playerbox */
+div.interna {
+  display: inline-block;
+  vertical-align: top;
+  width: 120px;
+  height: 165px;
+  margin: 0px;
+  padding-bottom: 5px;
+  overflow: hidden;
+  /* background-color: pink; */
+}
+/* Additional settings for box with serverstats */
+div.stats {
+  font-size: small;
+  width: 200px;
+  /* background-color: purple; */
+}
+div.form {
+  border: 1px dashed gray;
+  text-align: center;
+}
+div#premades {
+  border: 1px dashed rgb(150, 150, 0);
+  height: 500px;
+}
+div#info {
+  text-align: center;
+}
+
+div.error {
+  border: 1px dashed red;
+  padding: 50px;
+  font-size: 150%;
+  text-align: center;
+}
+
+svg {
+  width: 100%;
+  height: 100%;
+}
+xmp {
+  margin: 5px;
+}
+
+/* Some special colors for 3rdpartygames, serverinfo, warnings etc */
+.error { color: rgb(200, 0, 0); font-weight: bold; }
+.info { color: rgb(200, 200, 0); font-size: smaller; font-weight: bold; }
+#disclaimer {
+  color: rgb(150, 150, 0);
+  font-size: smaller;
+  padding-left: 50px;
+  margin-top: 20px;
+  margin-bottom: 10px;
+}
+div.buttons { margin-top: 10px; }
+div.serverinfo { margin-top: 10px; margin-bottom: 10px; font-size: x-small; }
+img.avatar { width: 100px; height: 100px; margin: 1px 5px 1px 5px; }
+span.gamename { font-size: small; color: rgb(87, 203, 222); }
+span.ingameother { color: rgb(52, 132, 0); font-style: italic; }
+span.maininfo { font-size: x-small; }
+span.steamname { font-size: medium; /* font-family: serif; */ font-weight: bold; width: 110px; word-wrap: break-word; }
+img.gameimage { width: 95%; }
+
+/***************************************/
+/* Colors for different online states: */
+/*   offline online busy away snooze   */
+/*    lookingtotrade lookingtoplay     */
+/***************************************/
+/* Whole player info box */
+div.online  { border: 1px solid rgb(87, 203, 222); }
+div.ingame  { border: 1px solid rgb(144, 186, 60); }
+div.away { border: 1px solid rgb(255, 235, 0);
+  opacity: 0.6;
+  filter: alpha(opacity=60);
+}
+div.busy { border: 1px solid rgb(48, 134, 149);
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+div.snooze { border: 1px solid rgb(135, 134, 135);
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+div.lookingtotrade { border: 1px solid rgb(255, 255, 0); }
+div.lookingtoplay  { border: 1px solid rgb(0, 255, 0); }
+div.offline {
+  border: 1px dashed rgb(137, 137, 137);
+  opacity: 0.4;
+  filter: alpha(opacity=40);
+}
+
+/* avatar */
+img.online         { border: 1px solid rgb(87, 203, 222); }
+img.ingame         { border: 1px solid rgb(144, 186, 60); }
+img.away           { border: 1px solid rgb(255, 235, 0); }
+img.busy           { border: 1px solid rgb(48, 134, 149); }
+img.snooze         { border: 1px solid rgb(135, 134, 135); }
+img.lookingtotrade { border: 1px solid rgb(255, 255, 0); }
+img.lookingtoplay  { border: 1px solid rgb(0, 255, 0); }
+img.offline        { border: 1px dashed rgb(137, 137, 137); filter: grayscale(1); -webkit-filter: grayscale(1); }
+
+/* color for username / gameinfo */
+span.ingame,a.ingame   { color: rgb(144, 186, 60); }
+span.online,a.online   { color: rgb(87, 203, 222); }
+span.away,a.away       { color: rgb(255, 235, 0); }
+span.busy              { color: rgb(48, 134, 149); }
+span.snooze            { color: rgb(135, 134, 135); }
+span.lookingtotrade    { color: rgb(255, 255, 0); }
+span.lookingtoplay     { color: rgb(0, 255, 0); }
+span.offline,a.offline { color: rgb(137, 137, 137); }
+