Updates to matches page

Tweaked layout for contest page
Various styling updates

app/assets/stylesheets/components/_comments.scss

@@ -1,24 +1,18 @@
+/*
+  Thread List
+*/
+
 #comments-thread {
   @include span-columns(12);
   
   h3 {
     margin: 1em 0;
   }
-
-  .comment-form {
-    @include span-columns(12);
-    margin-bottom: em(20);
-
-    h5 {
-      margin-top: 0;
-      margin-bottom: 1em;
 }
 
-    .fields {
+/*
-      margin-bottom: em(20);
+  Comment
-    }    
+*/
-  }
-}
 
 .comment {
   $comment-gutter: 1.4em;
@@ -100,3 +94,22 @@
     }
   }
 }
+
+/*
+  Comment Form
+*/
+
+.comment-form {
+  @include span-columns(12);
+  margin-bottom: em(20);
+
+  h1,
+  h5 {
+    margin-top: 0;
+    margin-bottom: 1em;
+  }
+
+  .fields {
+    margin-bottom: em(20);
+  }    
+}

app/assets/stylesheets/components/_shoutbox.scss

@@ -6,12 +6,6 @@
   margin-bottom: em(5);
 
   .timestamp {
-    font-size: em(14);
+    @extend .highlight;
-    border-radius: em(3);
-    background: $blue;
-    color: white;
-    display: inline-block;
-    font-style: italic;
-    padding: 0 em(6);
   }
 }

app/assets/stylesheets/layout/_body.scss

@@ -56,6 +56,7 @@ body {
 h1, h2, h3, h4, h5, h6 {
 
   &.fancy {
+    clear: both;
     text-align: center;
     position: relative;
     background-color: white;

app/assets/stylesheets/layout/_navigation.scss

@@ -26,7 +26,7 @@ ul.navigation {
 
   > li {
     float: left;
-    width: ($max-width - em(1))/7;
+    width: (100%/7);
     border-right: em(1) solid transparent;
 
     .count {

app/assets/stylesheets/mixins/_buttons.scss

@@ -24,7 +24,8 @@
 }
 
 button,
-a.button {
+a.button,
+.button {
   @include button;
 
   &.tiny {

app/assets/stylesheets/mixins/_flashes.scss

@@ -29,3 +29,17 @@
     text-align: center;
   }
 }
+
+/* 
+  Text Highlights
+*/
+
+.highlight {
+  font-size: em(14);
+  border-radius: em(3);
+  background: $blue;
+  color: white;
+  display: inline-block;
+  font-style: italic;
+  padding: 0 em(6);
+}

app/assets/stylesheets/pages/_contests.scss

@@ -71,6 +71,23 @@ table.contest {
   }
 }
 
+div.widget.contest {
+
+  a.button {
+    margin: em(20) 0 0;
+    text-align: center;
+    width: 100%;
+  }
+}
+
+/*
+  Standings
+*/
+
+div.standings {
+  @include span-columns(12);
+}
+
 /*
   Brackets
 */

app/assets/stylesheets/pages/_forums.scss

@@ -147,6 +147,17 @@ div#categories {
         @include span-columns(12);
         padding: em(20) 0;
       }
+
+      .text {
+        border-radius: $base-border-radius;
+        background: $light-gray;
+        margin-top: em(20);
+        padding: em(20);
+
+        fieldset {
+          border-color: $light-blue;
+        }
+      }
     }
 
     .header {

app/assets/stylesheets/pages/_matches.scss

@@ -22,3 +22,208 @@ table#matches {
     text-align: right;
   }
 }
+
+/*
+  Match Page
+*/
+
+div#match {
+  @include span-columns(12);
+  border-bottom: em(3) solid $light-gray;
+
+  .contesters,
+  .details,
+  .referee,
+  .predictions,
+  .report {
+    @include span-columns(12);
+  }
+
+  .contesters {
+    margin-bottom: em(20);
+
+    .vs {
+      margin: 0 auto;
+      display: block;
+      font: 50px $montserrat;
+      border-radius: 50px;
+      background: $blue;
+      width: 100px;
+      height: 100px;
+      text-align: center;
+      line-height: 100px;
+      color: white;
+      font-style: italic;
+      text-transform: uppercase;
+      padding-right: 10px;
+      font-weight: bold;
+    }
+
+    .team-1,
+    .team-2 {
+      max-height: 100px;
+      overflow: hidden;
+    }
+
+    .team-1 {
+      @include span-columns(5);
+      line-height: 100px;
+      text-align: right;
+    }
+
+    .team-2 {
+      @include span-columns(5);
+      line-height: 100px;
+      text-align: left;
+    }
+
+    .versus {
+      @include span-columns(2);
+      position: relative;
+      font-weight: bold;
+
+      &.split:before {
+        content: "";
+        display: block;
+        position: absolute;
+        background: white;
+        width: 1px;
+        height: 100px;
+        margin: 0 auto;
+        left: 50%;
+        top: 0;
+      }
+
+      .score-1,
+      .score-2 {
+        font: 50px $montserrat;
+        color: white;
+        width: 50%;
+        position: absolute;
+        top: 0;
+        text-align: center;
+        line-height: 100px;
+        font-weight: bold;
+      }
+
+      .score-1 {
+        padding-left: 15px;
+        left: 0;
+      }
+      
+      .score-2 {
+        padding-right: 15px;
+        right: 0;
+      }
+    }
+  }
+
+  .details {
+    margin-bottom: em(20);
+    text-align: center;
+
+    .contest,
+    .date {
+      text-align: center;
+    }
+
+    .date {
+      font-style: italic;
+      font-weight: normal;
+    }
+
+    .contest {
+      margin-bottom: em(10);
+    }
+  }
+
+  .lineups {
+    @include span-columns(12);
+    margin: em(20) 0 em(40);
+
+    i {
+      color: $gold;
+    }
+
+    .team-1 {
+      @include span-columns(6);
+      text-align: right;
+
+      .flag {
+        margin: 0 0 0 em(10);
+      }
+    }
+
+    .team-2 {
+      @include span-columns(6);
+      @include omega;
+    }
+
+    &.shift .team-2 {
+      @include shift(6);
+    }
+  }
+
+  .predictions {
+    text-align: center;
+
+    h4 {
+      margin-bottom: 1em;
+    }
+
+    input {
+      text-align: center;
+    }
+
+    .add {
+      @include span-columns(12);
+      text-align: center;
+
+      input {
+        float: none;
+        margin: em(20) 0 0 0;
+      }
+    }
+
+    .team-1 {
+      @include span-columns(6);
+      text-align: right;
+
+      .highlight {
+        margin-left: em(10);
+      }
+    }
+
+    .team-2 {
+      @include span-columns(6);
+      @include omega;
+      text-align: left;
+
+      .highlight {
+        margin-right: em(10);
+      }
+    }
+  }
+
+  .report {
+    margin: em(20) 0;
+    padding-top: em(20);
+    border-top: em(3) solid $light-gray;
+  }
+}
+
+/*
+  Map Page
+*/
+
+div#map {
+
+  .preview {
+    @include span-columns(12);
+    text-align: center;
+
+    img {
+      margin: em(20) 0;
+    }
+  }
+}

app/assets/stylesheets/pages/_news.scss

@@ -16,11 +16,7 @@ div.article {
     margin-bottom: em(40);
 
     ul {
-      list-style-type: disc;
+      @extend ul.disc;
-
-      li {
-        margin-left: em(20);
-      }
     }
   }
 

app/helpers/application_helper.rb

@@ -49,7 +49,7 @@ module ApplicationHelper
   end
 
   def longdate time
-    printtime time, "%d %B %Y"
+    printtime time, "%e %B %Y"
   end
 
   def printtime time, format

app/models/match.rb

@@ -158,11 +158,11 @@ class Match < ActiveRecord::Base
   end
 
   def team1_lineup
-    matchers.all(:conditions => {:contester_id => contester1_id}).collect{|matcher| matcher.user.username} * ", "
+    matchers.all(:conditions => {:contester_id => contester1_id})
   end
 
   def team2_lineup
-    matchers.all(:conditions => {:contester_id => contester2_id}).collect{|matcher| matcher.user.username} * ", "
+    matchers.all(:conditions => {:contester_id => contester2_id})
   end
 
   def get_friendly param = nil

app/views/comments/_new.html.erb

@@ -1,5 +1,5 @@
 <div id="reply" class="comment-form">
-  <h5>New comment</h5>
+  <h5>New Comment</h5>
 
   <% if cuser %>
     <%= form_for(@comment, remote: true) do |f| %>

app/views/comments/edit.html.erb

@@ -1,23 +1,15 @@
-<div class="box wide">
+<div class="comment-form">
-  <h1>Editing comment</h1>
+  <h1>Editing Comment</h1>
 
   <%= form_for(@comment) do |f| %>
-    <div id="error_explanation">
+    <%= render 'shared/errors', messages: @comment.errors.full_messages %>
-      <ul>
-        <% @comment.errors.full_messages.each do |msg| %>
-          <li><%= msg %></li>
-        <% end %>
-      </ul>
-    </div>
 
-    <p>
+    <div class="fields">
-      <%= f.label :text %><br />
+      <%= f.text_area :text, rows: 5 %>
-      <%= f.text_area :text, :rows => 15, :cols => 60 %>
+    </div>
-    </p>
+    <div class="controls">
-    <p>
       <%= f.submit 'Update' %>
-    </p>
+    </div>
   <% end %>
 </div>
   
-<%= link_to 'Back', :back %>

app/views/contesters/_list.html.erb

@@ -47,7 +47,6 @@
           <% if cuser and cuser.admin? %>
             <%= link_to icon('pencil'), edit_contester_path(contester) %>
             <%= link_to icon('times'), contester, confirm: 'Are you sure?', method: :delete %>
-            <%= link_to icon('refresh'), controller: "contesters", action: "recalc", id: contester %>
           <% end %>
         </td>
       <% end %>

app/views/contesters/show.html.erb

@@ -7,7 +7,7 @@
 
   <% if @contester.team.logo %>
     <div class="logo">
-      <%= image_tag @contester.team.logo.url, class: 'logo' %>
+      <%= image_tag @contester.team.logo.url, class: 'logo', alt: h(@contester.team.name) %>
     </div>
   <% end %>
 </div>
@@ -65,8 +65,6 @@
   <%= render partial: 'teamers/list', locals: { teamers: @members, blacklist: nil, comment: false } %>
 </div>
 
-<%= link_to 'Back', @contester.contest, class: 'button' %>
-
 <% if @contester.can_update? cuser %>
   <%= link_to 'Edit', edit_contester_path(@contester), class: 'button' %>
 <% end %>

app/views/contests/show.html.erb

@@ -1,7 +1,10 @@
-<h1><%= @contest.name %></h1>
+<h1 class="fancy">
+  <span><%= @contest.name %></span>
+</h1>
 
-<div class="contest info">
+<% content_for :sidebar do %>
-  <h3>Details</h3>
+  <div class="widget contest">
+    <h4>Contest Details</h4>
 
     <dl>
       <dt>Start - End</dt>
@@ -14,22 +17,25 @@
       <dt>Status</dt>
       <dd><%= @contest.statuses[@contest.status] %></dd>
       <dt>Default</dt>
-    <dd>Sunday: <%=h @contest.default_time.strftime("%H:%M") %></dd>
+      <dd>Sunday: <%= Time.use_zone(timezone_offset) { @contest.default_time.strftime("%H:%M %Z") } %></dd>
     </dl>
 
     <% if @contest.contest_type == Contest::TYPE_LADDER %>
-    <%= link_to 'Scoring', "/contests/#{@contest}/score" %>
+      <%= link_to 'Scoring', "/contests/#{@contest}/score", class: 'button' %>
     <% end %>
     <% if cuser and cuser.admin? %>
-    <%= link_to 'Edit', edit_contest_path(@contest) %>
+      <%= link_to 'Edit Contest', edit_contest_path(@contest), class: 'button' %>
     <% end %>
   </div>
+<% end %>
 
+<div class="standings">
   <% if @contest.contest_type == Contest::TYPE_BRACKET %>
     <%= render partial: 'bracket', locals: { contest: @contest } %>
   <% else %>
     <%= render partial: 'normal' %>
   <% end %>
+</div>
 
 <div id="contest" class="tabbed">
   <ul id="contest-nav" class="tabs">
@@ -47,7 +53,7 @@
       <% if @contest.weeks.count > 0 %>
         <table class="data">
           <% @contest.weeks.ordered.each do |week| %>
-            <% next if week.matches.count == 0 %>
+            <% next if week.matches.realfinished.size == 0 %>
             <tr>
               <th><%= week.name %></th>
               <th>Date</th>

app/views/layouts/application.html.erb

@@ -21,6 +21,7 @@
             <%= yield %>
           </div>
           <div id="sidebar">
+            <%= yield :sidebar %>
             <% ['calendar', 'shoutbox', 'highlights', 'posts', 'poll'].each do |widget| %>
               <%= render partial: "widgets/#{widget}" %>  
             <% end %>

app/views/maps/_form.html.erb

@@ -1,25 +1,28 @@
-<div class="wide box">
+<%= form_for @map, html: { multipart: true, class: 'square' } do |f| %>
-  <%= form_for @map, :html => { :multipart => true } do |f| %>
+  <%= render 'shared/errors', messages: @map.errors.full_messages %>
-    <%= f.error_messages %>
 
-    <p>
+  <div class="fields horizontal">
-      <%= f.label :name %><br />
+    <%= f.label :name %>
     <%= f.text_field :name %>
-    </p>
-    <p>
-      <%= f.label :category_id %><br />
-      <%= f.select :category_id, Category.ordered.domain(Category::DOMAIN_GAMES).collect{|c| [c, c.id]} %>
-    </p>
-    <p>
-      <%= f.label :download %><br />
-      <%= f.text_field :download %>
-    </p>
-    <p>
-      <%= f.label :picture %><br />
-      <%= f.file_field :picture %>
-    </p>
-    <p>
-      <%= f.submit 'Update' %>
-    </p>
-  <% end %>
   </div>
+  <div class="fields horizontal">
+    <%= f.label :category_id %>
+    <%= f.select :category_id, Category.ordered.domain(Category::DOMAIN_GAMES).collect { |c| [c, c.id] } %>
+  </div>
+  <div class="fields horizontal">
+    <%= f.label :download %>
+    <%= f.text_field :download %>
+  </div>
+  <div class="fields horizontal">
+    <%= f.label :picture %>
+    <div class="inputs">
+      <% if @map.picture.length > 0 %>
+        <%= image_tag @map.picture %><br>
+      <% end %>
+      <%= f.file_field :picture %>
+    </div>
+  </div>
+  <div class="controls">
+    <%= f.submit 'Update Map' %>
+  </div>
+<% end %>

app/views/maps/edit.html.erb

@@ -1,6 +1,3 @@
-<h1>Editing map</h1>
+<h1>Editing Map</h1>
 
-<%= render :partial => "form" %>
+<%= render partial: 'form' %>
-
-<%= link_to 'Show', @map %> |
-<%= link_to 'Back', maps_path %>

app/views/maps/index.html.erb

@@ -1,6 +1,6 @@
 <h1>Listing maps</h1>
 
-<table class="data">
+<table class="striped">
   <tr>
     <th>Name</th>
     <th>Download</th>
@@ -8,17 +8,15 @@
   </tr>
 
   <% @maps.each do |map| %>
-    <tr class="<%= cycle('even', 'odd') %>">
+    <tr>
       <td><%= namelink map %></td>
       <td><%= h map.download %></td>
       <td>
-        <%= link_to 'Edit', edit_map_path(map) %>
+        <%= link_to icon('pencil'), edit_map_path(map) %>
-        <%= link_to 'Destroy', map, :confirm => 'Are you sure?', :method => :delete %>
+        <%= link_to icon('times'), map, confirm: 'Are you sure?', method: :delete %>
       </td>
     </tr>
   <% end %>
 </table>
 
-<br />
+<%= link_to 'New Map', new_map_path, class: 'button' %>
-
-<%= link_to 'New map', new_map_path %>

app/views/maps/new.html.erb

@@ -1,5 +1,3 @@
-<h1>New map</h1>
+<h1>New Map</h1>
 
-<%= render :partial => "form" %>
+<%= render partial: 'form' %>
-
-<%= link_to 'Back', maps_path %>

app/views/maps/show.html.erb

@@ -1,21 +1,25 @@
-<h1>
+<div id="map">
-  <%=h @map.name %>
+  <h1 class="fancy">
+    <span><%=h @map.name %></span>
   </h1>
 
-<div class="wide box">
+  <% if @map.picture.length > 0 %>
-  <p class="bold">
+    <div class="preview">
-    Download: <%= link_to (h @map.download), (h @map.download) %>
+      <%= image_tag @map.picture %>
-</p>
+    </div>
+  <% end %>
 
-<p class="bold">
+  <% if @map.download.length > 0 %>
-  Used in contests:
+    <strong>Download</strong><br>
-</p>
+    <p><%= link_to (h @map.download), (h @map.download) %></p>
-<ul>
+  <% end %>
+
+  <h4>Played in Contests</h4>
+  <ul class="disc">
     <% @map.contests.each do |contest| %>
       <li><%= namelink contest %></li>
     <% end %>  
   </ul>
-</div>
 
-<%= link_to 'Edit', edit_map_path(@map) %> |
+  <%= link_to 'Edit Map', edit_map_path(@map), class: 'button' %>
-<%= link_to 'Back', maps_path %>
+</div>

app/views/matches/_match.html.erb

@@ -1,4 +1,4 @@
-<table id="matches" class="data">
+<table id="matches" class="striped">
   <tr>
     <th>Date and Time</th>
     <th>Contest</th>
@@ -17,11 +17,14 @@
       <td><% if match.map1 and match.map2 %>
         <%= link_to match.map1, :controller => :maps, :action => :show, :id => match.map1 %>, 
         <%= link_to match.map2, :controller => :maps, :action => :show, :id => match.map2 %>
-      <% end %></td>
+        <% end %>
+      </td>
       <td><%= match.preds(1) %>% - <%= match.preds(2) %>%</td>
-    <td><%= link_to match, :class => "bold #{match.score_color}" do %>
+      <td>
+        <%= link_to match, :class => "bold #{match.score_color}" do %>
           <%= h match.score1 %> - <%= h match.score2 %>
-    <% end %></td>
+        <% end %>
+      </td>
     </tr>
   <% end %>
 </table>

app/views/matches/index.html.erb

@@ -1,36 +1,34 @@
-<h2 class="center">
+<h1>Matches</h1>
-  Matches
+<h3>Of currently active contests</h3>
-</h2>
-<h3 class="center">
-  Of currently active contests
-</h3>
 
-<div class="wide box">
+<div id="matches" class="tabbed">
-  <div id="matchesTab">
+  <ul id="matches-nav" class="tabs">
-    <ul id="matchesTab-nav" class="tabs">
+    <li><a href="#upcoming">Upcoming</a></li>
-      <li><a href="#UpcomingTab">Upcoming</a></li>
+    <li><a href="#recent">Recent</a></li>
-      <li><a href="#RecentTab">Recent</a></li>
+    <li><a href="#your">Your Matches</a></li>
-      <li><a href="#YourTab">Your matches</a></li>
   </ul>
-    <div class="box wide tabs">
+  <div class="tabbed-contents">
-      <div class="tab" id="UpcomingTab">
+    <div class="tab" id="upcoming">
-        <h3 class="center">Upcoming Matches</h3>
+      <h3>Upcoming Matches</h3>
-        <%= render :partial => "matches/match", :locals => {:matches => @matches.unfinished.chrono} %>
+
+      <%= render partial: "matches/match", locals: { matches: @matches.unfinished.chrono } %>
     </div>
-      <div class="tab" id="RecentTab">
+    <div class="tab" id="recent">
-        <h3 class="center">Recent Matches</h3>
+      <h3>Recent Matches</h3>
-        <%= render :partial => "matches/match", :locals => {:matches => @matches.realfinished.reverse_order.chrono} %>
+
+      <%= render partial: "matches/match", locals: { matches: @matches.realfinished.reverse_order.chrono } %>
     </div>
-      <div class="tab" id="YourTab">
+    <div class="tab" id="your">
-        <h3 class="center">Your Matches (<%= if cuser then @matches.of_user(cuser).count else 0 end %>)</h3>
+      <h3>Your Matches (<%= if cuser then @matches.of_user(cuser).count else 0 end %>)</h3>
       <% if cuser then %>
-            <%= render :partial => "matches/match", :locals => {:matches => @matches.of_user(cuser).reverse_order.chrono} %>
+        <%= render partial: "matches/match", locals: { matches: @matches.of_user(cuser).reverse_order.chrono } %>
       <% end %>
     </div>
   </div>
 </div>
-    <script type="text/javascript">
-      var tabber1 = new Yetii({id: 'matchesTab'});
-      </script>
-    </div>
 
+<script type="text/javascript">
+  new Yetii({
+    id: 'matches'
+  });
+</script>

app/views/matches/show.html.erb

@@ -1,90 +1,118 @@
-<div class="box wide center">
+<div id="match">
-  <h1>
+  <div class="contesters">
     <% if @match.score1 and @match.score2 %>
-      <% if @match.score1 > @match.score2; c1 = 'green'; c2 = 'red' end %>
+      <h1 class="team-1"><%= namelink @match.contester1.team if @match.contester1 %></h1>
-        <% if @match.score1 < @match.score2; c1 = 'red'; c2 = 'green' end %>
+      <div class="versus split">
-          <% if @match.score1 == @match.score2; c1 = 'yellow'; c2 = 'yellow' end %>
+        <div class="score-1">
-            <%= namelink @match.contester1.team if @match.contester1 %>
+          <%= h @match.score1 %>
-            <span class="<%= c1 %>"><%= h @match.score1 %></span>
+        </div>
-            -
+        <span class="vs"></span>
-            <span class="<%= c2 %>"><%= h @match.score2 %></span>
+        <div class="score-2">
-            <%= namelink @match.contester2.team if @match.contester2 %>
+          <%= h @match.score2 %>
+        </div>
+      </div>
+      <h1 class="team-2"><%= namelink @match.contester2.team if @match.contester2 %></h1>
     <% else %>
-            <%= namelink @match.contester1.team if @match.contester1 %>
+      <h1 class="team-1"><%= namelink @match.contester1.team if @match.contester1 %></h1>
-            vs
+      <div class="versus">
-            <%= namelink @match.contester2.team if @match.contester2 %>
+        <span class="vs">VS</span>
+      </div>
+      <h1 class="team-2"><%= namelink @match.contester2.team if @match.contester2 %></h1>
     <% end %>
-        </h1>
+  </div>
 
-        <h4 class="center">
+  <% if @match.team1_lineup.any? || @match.team2_lineup.any? %>
-          <%= longtime @match.match_time %>
+    <div class="lineups <%= 'shift' if !@match.team1_lineup.any? %>">
-        </h4>
+      <% if @match.team1_lineup.any? %>
-
+        <div class="team-1">
-        <%= cascade @match, [:contest, :server, :hltv, :demo, :referee, [@match.contester1, "team1_lineup"], [@match.contester2, "team2_lineup"], ["Man of the Match", :motm]] %>
+          <ul>
-
+            <% @match.team1_lineup.each do |teamer| %>
-        <p>
+              <li>
-          <b>Maps:</b>
+                <% if teamer.user == @match.motm %>
-          <%= namelink @match.map1 %>, <%= namelink @match.map2 %>
+                  <%= icon 'star' %>
-        </p>
+                <% end %>
-
+                <%= teamer.user.username %>
-        <% if @match.hltv %>
+                <%= flag teamer.user.country %>
-          <p>
+              </li>
-            <%= link_to "Connect to HLTV", "steam://connect/#{@match.hltv.addr}" %>
+            <% end %>  
-          </p>
+          </ul>
+        </div>
       <% end %>
 
-        <%# if cuser and @match.can_update? cuser, [:matchers_attributes] %>
+      <% if @match.team2_lineup.any? %>
-          <%# if cuser and cuser.admin? %>
+        <div class="team-2">
-          <!--p-->
+          <ul>
-            <%#= link_to "Scoring and lineup", :action => "score", :id => @match %>
+            <% @match.team2_lineup.each do |teamer| %>
-          <!--/p-->
+              <li>
-        <%# end %>
+                <%= flag teamer.user.country %>
-
+                <%= teamer.user.username %>  
-        <% if cuser and @match.can_update? cuser, [:report] %>
+                <% if teamer.user == @match.motm %>
-          <p>
+                  <%= icon 'star' %>
-            <%= link_to "Referee (Scoring, Line-Ups, Man of the match)", :controller => :matches, :action => "ref", :id => @match %>
+                <% end %>
-          </p>
+              </li>
+            <% end %>  
+          </ul>
+        </div>
+      <% end %>
+    </div>
   <% end %>
 
-        <%# if cuser and @match.can_update? cuser, [:hltv] %>
+  <div class="details">
-          <!--p-->
+    <h3 class="contest"><%= @match.contest %></h3>
-            <%#= link_to "Extras", :action => "extra", :id => @match %>
+    <h5 class="date"><%= @match.match_time.strftime("%A %e %B %Y") %></h5>
-          <!--/p-->
+    <h5 class="date"><%= Time.use_zone(timezone_offset) { @match.match_time.strftime("%H:%M %Z") } %></h5>
-        <%# end %>
+  </div>
   
-        <br />
+  <div class="predictions">
-
+    <h4>Predictions (<%= @match.predictions.count %>)</h4>
-        <h3>
-          Predictions (<%= @match.predictions.count %>)
-        </h3>
 
     <% if @newpred.can_create? cuser %>
       <%= form_for @newpred do |f| %>
         <%= f.hidden_field :match_id %>
-            <%= f.text_field :score1, :size => 1 %> -
+
-            <%= f.text_field :score2, :size => 1 %>
+        <div class="fields">
-            <p>
+          <div class="team-1">
-              <%= submit_tag "Save Prediction" %>
+            <%= f.text_field :score1, size: 1, placeholder: 0 %>  
-            </p>
+          </div>
+          <div class="team-2">
+            <%= f.text_field :score2, size: 1, placeholder: 0 %>
+          </div>
+        </div>
+
+        <div class="add">
+          <%= submit_tag "Add Prediction", class: 'button tiny' %>  
+        </div>
       <% end %>
     <% else %>
-          <p>
+      <div class="team-1">
-            <b><%= @match.contester1.team if @match.contester1 %></b>: <%= @match.preds(1) %>%<br />
+        <%= @match.contester1.team if @match.contester1 %>
-            <b><%= @match.contester2.team if @match.contester2 %></b>: <%= @match.preds(2) %>%<br />
+        <div class="highlight"><%= @match.preds(1) %>%</div>
-          </p>
+      </div>
+      <div class="team-2">
+        <div class="highlight"><%= @match.preds(2) %>%</div>
+        <%= @match.contester2.team if @match.contester2 %>
+      </div>
     <% end %>
   </div>
 
+  <div class="details">
+    <%= cascade @match, [:server, :demo, :referee] %>
+    <strong>Maps</strong><br>
+    <%= namelink @match.map1 %>, <%= namelink @match.map2 %>
+  </div>
+  
   <% unless @match.report.nil? or @match.report.empty? %>
-        <div class="wide box">
+    <div class="report">
-          <h3>
+      <h3>Match Report</h3>
-            Report
+      <p><%= @match.report.html_safe %></p>
-          </h3>
-
-          <p>
-            <%= raw @match.report %>
-          </p>
     </div>
   <% end %>
 
+  <% if cuser and @match.can_update? cuser, [:report] %>
+    <div class="referee">
+      <%= link_to "Referee Admin", { controller: :matches, action: 'ref', id: @match }, class: 'button' %>
+    </div>
+  <% end %>
+</div>
+
 <%= add_comments @match %>

app/views/posts/_form.html.erb

@@ -8,9 +8,9 @@
       <%= namelink @post.topic %>  
     </div>
   </div>
-  <div class="square horizontal">
+  <div class="fields horizontal">
     <%= f.label :text %>
-    <%= f.text_area :text, rows: 20 %>
+    <%= f.text_area :text, rows: 15 %>
   </div>
   <div class="controls">
     <%= f.submit 'Save Post' %>

app/views/posts/_post.html.erb

@@ -18,7 +18,7 @@
       <dt>Location</dt>
       <dd><%= post.user.from %></dd>
       <dt>Joined</dt>
-      <dd><%= post.user.joined %></dd>
+      <dd><%= longdate post.user.created_at %></dd>
     </dl>
   </div>
 

app/views/teams/show.html.erb

@@ -5,7 +5,7 @@
 
   <% if @team.logo %>
     <div class="logo">
-      <%= image_tag @team.logo.url, class: 'logo' %>
+      <%= image_tag @team.logo.url, class: 'logo', alt: h(@team.name) %>
     </div>
   <% end %>
 

app/views/widgets/_highlights.html.erb

@@ -4,8 +4,8 @@
   <div class="widget-content-wrapper">
     <% if cuser and cuser.active_contests.count != 0 then %>
       <div class="separator">
-        Your contests
+        Your Matches
-        <%= link_to "(More)", controller: :matches, matchesTab: "YourTab" %>
+        <%= link_to "More", controller: :matches, matches: 'your' %>
       </div>
       <ol>
         <% cuser.active_contests.each do |contest| %>
@@ -20,7 +20,7 @@
     <% if Match.recent.count != 0 then %>
       <div class="separator">
         Latest Matches
-        <%= link_to "More", controller: :matches, matchesTab: "RecentTab" %>
+        <%= link_to 'More', controller: :matches, matches: 'recent' %>
       </div>
       <ol>
         <% Match.realfinished.reverse_order.recent.chrono.each do |match| %>
@@ -39,7 +39,7 @@
     <% if Match.future5.count != 0 then %>
       <div class="separator">
         Upcoming matches
-        <%= link_to "More", controller: :matches, matchesTab: "UpcomingTab" %>
+        <%= link_to 'More', controller: :matches, matches: 'upcoming' %>
       </div>
       <ol>
         <% Match.future5.chrono.each do |match| %>