From 1dea7b20e0f4eb19bbfaeb76c3ef5ea118f199b9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adrian=20F=C3=BCrschu=C3=9F?= <adrian.fuerschuss@epunkt.net>
Date: Sat, 21 Jan 2017 22:19:21 +0100
Subject: [PATCH] #5 Style teams page.

---
 src/Wuzlstats/Views/Teams/Index.cshtml |  2 +-
 src/Wuzlstats/wwwroot/css/site.css     | 30 ++++++++++++++--
 src/Wuzlstats/wwwroot/css/site.scss    | 47 ++++++++++++++++++++++++--
 3 files changed, 72 insertions(+), 7 deletions(-)

diff --git a/src/Wuzlstats/Views/Teams/Index.cshtml b/src/Wuzlstats/Views/Teams/Index.cshtml
index aa2cb78..037d0f0 100644
--- a/src/Wuzlstats/Views/Teams/Index.cshtml
+++ b/src/Wuzlstats/Views/Teams/Index.cshtml
@@ -43,7 +43,7 @@ else
                 <td>
                     @(rank++)
                 </td>
-                <td>
+                <td class="team">
                     @Html.Partial("_Player", team.Player1)
                     @Html.Partial("_Player", team.Player2)
                 </td>
diff --git a/src/Wuzlstats/wwwroot/css/site.css b/src/Wuzlstats/wwwroot/css/site.css
index e076f62..8a7698e 100644
--- a/src/Wuzlstats/wwwroot/css/site.css
+++ b/src/Wuzlstats/wwwroot/css/site.css
@@ -140,16 +140,40 @@ footer {
     footer {
       margin-top: 50px; } }
 
-.players td > a:focus, .players td > a:hover {
+.players td > a:focus, .players td > a:hover, .teams td > a:focus, .teams td > a:hover {
   text-decoration: none; }
 
-.players .player-name {
+.players .player-name, .teams .player-name {
   font-weight: bold;
   display: inline; }
 
-.players .player-score {
+.players .player-score, .teams .player-score {
   color: #999; }
 
+.teams .team {
+  display: inline-block; }
+
+.teams .player {
+  float: right;
+  display: block; }
+  .teams .player:first-child {
+    float: left;
+    margin-right: 1.5em; }
+    .teams .player:first-child .player-name {
+      margin-left: 50px; }
+  .teams .player:nth-of-type(2) > a {
+    float: right; }
+  .teams .player:nth-of-type(2) .player-name {
+    display: inline-block;
+    text-align: right;
+    margin-right: 0.6em;
+    top: 0.9em; }
+
+.teams .player-name {
+  display: block;
+  position: relative;
+  top: -2em; }
+
 footer .nav > li {
   padding-bottom: 15px;
   padding-top: 15px;
diff --git a/src/Wuzlstats/wwwroot/css/site.scss b/src/Wuzlstats/wwwroot/css/site.scss
index f2a0344..2f623cd 100644
--- a/src/Wuzlstats/wwwroot/css/site.scss
+++ b/src/Wuzlstats/wwwroot/css/site.scss
@@ -210,7 +210,7 @@ footer {
     }
 }
 
-.players {
+.players, .teams {
     td > a {
         &:focus, &:hover {
             text-decoration: none;
@@ -227,6 +227,47 @@ footer {
     }
 }
 
+.teams {
+    .team {
+        display: inline-block;
+    }
+
+    .player {
+        float: right;
+        display: block;
+
+        &:first-child {
+            float: left;
+            margin-right: 1.5em;
+
+            & .player-name {
+                margin-left: 50px;
+            }
+        }
+
+        &:nth-of-type(2) {
+            & > a {
+                float: right;
+            }
+
+            & .player-name {
+                display: inline-block;
+                text-align: right;
+                margin-right: 0.6em;
+                top: 0.9em;
+            }
+        }
+    }
+
+    .player-name {
+        display: block;
+        //margin-left: 50px;
+        //margin-right: 50px;
+        position: relative;
+        top: -2em;
+    }
+}
+
 footer {
     .nav > li {
         padding-bottom: 15px;
@@ -235,7 +276,7 @@ footer {
     }
 
     .nav > li > a {
-            display: inline;
-            padding: 0;
+        display: inline;
+        padding: 0;
     }
 }