Improved styling for contests and referee admin pages

Fixes deleting maps form contests

app/assets/stylesheets/components/_forms.scss

@@ -3,6 +3,7 @@
 */
 
 form {
+
   .inline {
     float: left;
     display: inline-block;
@@ -48,6 +49,7 @@ form {
       display: inline-block;
       margin-right: em(10);
       float: left;
+      max-width: 100%;
 
       select {
         @include appearance(none);
@@ -65,6 +67,7 @@ form {
         margin: 0;
         padding: $select-padding em(50) $select-padding $input-padding;
         font-size: $input-font-size;
+        max-width: 100%;
 
         option {
           font-size: $input-font-size;
@@ -143,7 +146,6 @@ form {
     }
 
     > label.checkbox {
-      display: none;
       position: relative;
       width: em(40);
       height: em(40);

app/assets/stylesheets/components/_tables.scss

@@ -12,13 +12,13 @@ table {
 th {
   border-bottom: 1px solid darken($base-border-color, 15%);
   font-weight: bold;
-  padding: ($base-line-height / 2) 0;
+  padding: 0.5em 0;
   text-align: left;
 }
 
 td {
   border-bottom: 1px solid $base-border-color;
-  padding: ($base-line-height / 2) 0;
+  padding: 0.5em 0;
 }
 
 tr, td, th {
@@ -41,4 +41,4 @@ table.striped > tbody {
   > tr:nth-child(2n) td {
     background-color: transparentize($light-blue, 0.9);
   }
-} 
+}

app/assets/stylesheets/layout/_navigation.scss

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

app/assets/stylesheets/pages/_contests.scss

@@ -144,3 +144,50 @@ table.brackets {
     width: em(150);
   }
 }
+
+/*
+  Contest Page
+*/
+
+#contest {
+
+  table.weeks {
+
+    .week {
+      width: 50%;
+    }
+
+    .date {
+      width: 30%;
+    }
+
+    .score {
+      width: 10%;
+      text-align: right;
+    }
+  }
+
+  table.matches {
+
+    .team {
+      width: 50%;
+    }
+
+    .date {
+      width: 50%;
+      text-align: right;
+    }
+  }
+
+  table.predictions {
+
+    .user {
+      width: 50%;
+    }
+
+    .result {
+      width: 50%;
+      text-align: right;
+    }
+  }
+}

app/assets/stylesheets/pages/_matches.scss

@@ -141,10 +141,47 @@ div#match {
     @include span-columns(12);
     margin: em(20) 0 em(40);
 
+    h3 {
+      text-align: center;
+      margin-bottom: 1em;
+    }
+
     i {
       color: $gold;
     }
 
+    .team-1,
+    .team-2 {
+      position: relative;
+
+      .player {
+        @include span-columns(12);
+        line-height: em(40);
+        margin-bottom: em(10);
+      }
+
+      .players {
+        position: relative;
+      }
+
+      .controls {
+        top: 0;
+        position: absolute;
+        z-index: 100;
+
+        input {
+          margin: 0;
+        }
+      }
+
+      form {
+
+        label.checkbox {
+          padding: 0;
+        }
+      }
+    }
+
     .team-1 {
       @include span-columns(6);
       text-align: right;
@@ -152,16 +189,64 @@ div#match {
       .flag {
         margin: 0 0 0 em(10);
       }
+
+      .controls {
+        left: 0;
+      }
+
+      form {
+
+        label.checkbox {
+          float: right;
+          margin-left: 1em;
+        }
+      }
     }
 
     .team-2 {
       @include span-columns(6);
       @include omega;
+
+      .controls {
+        right: 0;
+      }
+
+      form {
+
+        label.checkbox {
+          float: left;
+          margin-right: 1em;
+        }
+      }
     }
 
     &.shift .team-2 {
       @include shift(6);
     }
+
+    .mercenaries {
+      @include span-columns(12);
+
+      input {
+        margin: 0;
+      }
+    }
+  }
+
+  .scoring {
+    @include span-columns(12);
+    border-top: em(3) solid $light-gray;
+
+    h3 {
+      margin-bottom: 1em;
+    }
+
+    .scores input {
+      width: auto;
+      margin-left: 0;
+      text-align: center;
+      width: em(40);
+    }
   }
 
   .predictions {
@@ -209,6 +294,16 @@ div#match {
     margin: em(20) 0;
     padding-top: em(20);
     border-top: em(3) solid $light-gray;
+
+    textarea {
+      margin: em(20) 0;
+      width: 100%;
+      height: em(600);
+    }
+
+    .mceLayout {
+      margin: em(20) 0;
+    }
   }
 }
 

app/views/contests/show.html.erb

@@ -51,15 +51,15 @@
       </h3>
 
       <% if @contest.weeks.count > 0 %>
-        <table class="data">
+        <table class="striped weeks">
           <% @contest.weeks.ordered.each do |week| %>
             <% next if week.matches.realfinished.size == 0 %>
             <tr>
-              <th><%= week.name %></th>
-              <th>Date</th>
-              <th>Score</th>
+              <th class="week"><%= week.name %></th>
+              <th class="date">Date</th>
+              <th class="score">Score</th>
               <% if @contest.contest_type == Contest::TYPE_LADDER %>
-                <th>Points</th>
+                <th class="points">Points</th>
               <% end %>
             </tr>
             <% week.matches.realfinished.ordered.reverse_each do |match| %>
@@ -72,14 +72,14 @@
                 <td>
                   <%= shorttime match.match_time %>
                 </td>
-                <td>
+                <td class="score">
                   <%= link_to match, :class => "bold #{match.score_color}" do %>
                     <b><%= h match.score1 %> - <%= h match.score2 %></b>
                   <% end %>
 
                 </td>
                 <% if @contest.contest_type == Contest::TYPE_LADDER %>
-                  <td>
+                  <td class="points">
                     <%= match.points1 %> / <%= match.points2 %>
                   </td>
                 <% end %>
@@ -88,13 +88,13 @@
           <% end %>
         </table>
       <% else %>
-        <table class="data">
+        <table class="striped teams">
           <tr>
-            <th>Teams</th>
-            <th>Date</th>
-            <th>Score</th>
+            <th class="team">Teams</th>
+            <th class="date">Date</th>
+            <th class="score">Score</th>
             <% if @contest.contest_type == Contest::TYPE_LADDER %>
-              <th>Points</th>
+              <th class="points">Points</th>
             <% end %>
           </tr>
 
@@ -129,10 +129,10 @@
           Matches to be played
         </h3>
 
-        <table class="data">
+        <table class="striped matches">
           <tr>
-            <th>Teams</th>
-            <th>Date</th>
+            <th class="team">Teams</th>
+            <th class="date">Date</th>
           </tr>
 
           <% @contest.matches.unfinished.ordered.reverse_each do |match| %>
@@ -142,7 +142,7 @@
                 vs
                 <%= namelink match.contester2.team if match.contester2 %>
               </td>
-              <td>
+              <td class="date">
                 <%= link_to shorttime(match.match_time), match %>
               </td>
             </tr>
@@ -152,22 +152,22 @@
     </div>
 
     <div class="tab" id="predictions">
-      <table class="data">
+      <table class="striped predictions">
         <tr>
-          <th>User</th>
-          <th>Result</th>
+          <th class="user">User</th>
+          <th class="result">Result</th>
         </tr>
         <% @contest.preds_with_score.each do |prediction| %>
           <tr>
             <td><%= namelink prediction.user %></td>
-            <td><%= prediction.correct %> / <%= prediction.total %> correct (<%= prediction.score.to_f.round(2) %>%)</td>
+            <td class="result"><%= prediction.correct %> / <%= prediction.total %> correct (<%= prediction.score.to_f.round(2) %>%)</td>
           </tr>
         <% end %>
       </table>
     </div>
 
     <div class="tab" id="maps">
-      <ul>
+      <ul class="disc">
         <% @contest.maps.each do |map| %>
           <li><%= map %></li>
         <% end %>

app/views/issues/new.html.erb

@@ -1,4 +1,4 @@
-<h1><%= cuser ? "New Issue" : "Contact" %></h1>
+<h1 class="title"><%= cuser ? "New Issue" : "Contact" %></h1>
 
 <p>Please do not forget to include contact details, such as an email address or a Steam account in the case that you do not have an ENSL account.</p>
 

app/views/matches/_form.html.erb

@@ -1,38 +1,38 @@
 <div class="wide box">
-  <%= form_for @match do |f| %>
+  <%= form_for @match, html: { class: 'square' } do |f| %>
     <%= f.error_messages %>
     <%= f.hidden_field :contest_id %>
 
-    <p>
-      <%= f.label :contester1_id, "Team #1" %><br />
+    <div class="fields horizontal">
+      <%= f.label :contester1_id, "Team #1" %>
       <%= f.select :contester1_id, @match.contest.contesters.active.collect{|c| ["#{c.team.name}", c.id]} %>
-    </p>
-    <p>
-      <%= f.label :contester2_id, "Team #2" %><br />
+    </div>
+    <div class="fields horizontal">
+      <%= f.label :contester2_id, "Team #2" %>
       <%= f.select :contester2_id, @match.contest.contesters.active.collect{|c| ["#{c.team.name}", c.id]} %>
-    </p>
-    <p>
-      <%= f.label :map1_id, "Team 1's map" %><br />
+    </div>
+    <div class="fields horizontal">
+      <%= f.label :map1_id, "Map #1" %>
       <%= f.select :map1_id, @match.contest.maps.basic.collect{|m| [m.name, m.id]} %>
-    </p>
-    <p>
-      <%= f.label :map2_id, "Team 2's map" %><br />
+    </div>
+    <div class="fields horizontal">
+      <%= f.label :map2_id, "Map #2" %>
       <%= f.select :map2_id, @match.contest.maps.basic.collect{|m| [m.name, m.id]} %>
-    </p>
-    <p>
-      <%= f.label :match_time %><br />
-      <%= f.datetime_select :match_time %>
-    </p>
-    <p>
-      <%= f.label :referee_id %><br />
+    </div>
+    <div class="fields horizontal">
+      <%= f.label :match_time %>
+      <%= f.datetime_select :match_time, datetime_separator: '', time_separator: '' %>
+    </div>
+    <div class="fields horizontal">
+      <%= f.label :referee_id %>
       <%= f.select :referee_id, Group.find(Group::REFEREES).users.collect{|u| [u, u.id]}, {:include_blank => true} %>
-    </p>
-    <p>
-      <%= f.label :week_id %><br />
+    </div>
+    <div class="fields horizontal">
+      <%= f.label :week_id %>
       <%= f.select :week_id, @match.contest.weeks.ordered.collect{|w| [w, w.id]}, {:include_blank => true} %>
-    </p>
-    <p>
-      <%= f.submit 'Save' %>
-    </p>
+    </div>
+    <div class="controls">
+      <%= f.submit 'Save Match' %>
+    </div>
   <% end %>
 </div>

app/views/matches/_lineup.html.erb

@@ -1,46 +1,49 @@
-<h4>
-  <%= namelink contester.team %>
-</h4>
+<div class="players">
+  <% contester.lineup.each do |teamer| %>
+    <div class="player fields">
+      <% if matcher = @match.matchers.first(conditions: { user_id: teamer.user_id }) %>
+        <%= hidden_field_tag "match[matchers_attributes][#{@n}][id]", matcher.id %>
+      <% end %>
 
-<div class="left"><h5>Team members</h5>
-<% contester.lineup.each do |teamer| %>
-  <p>
-    <% if matcher = @match.matchers.first(:conditions => {:user_id => teamer.user_id}) %>
-      <%= hidden_field_tag "match[matchers_attributes][#{@n}][id]", matcher.id %>
-    <% end %>
-    <%= hidden_field_tag "match[matchers_attributes][#{@n}][user_id]", teamer.user_id %>
-    <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %>
-    <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %>
-    <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", false %>
-    <%= check_box_tag "match[matchers_attributes][#{@n}][_destroy]", "keep", @match.users.exists?(teamer.user) %>
-    <%= teamer.user %>
-  </p>
-  <% @n = @n + 1; end %>
-</div>
-<div class ="center">
-  <% if contester.team.logo %>
-    <%= image_tag contester.team.logo.url%>
+      <%= hidden_field_tag "match[matchers_attributes][#{@n}][user_id]", teamer.user_id %>
+      <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %>
+      <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %>
+      <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", false %>
+      <%= check_box_tag "match[matchers_attributes][#{@n}][_destroy]", "keep", @match.users.exists?(teamer.user), { id: "player_#{@n}" } %>
+
+      <%= label_tag "player_#{@n}", '', class: 'checkbox' %>
+
+      <span><%= teamer.user %></span>
+    </div>
+
+    <% @n = @n + 1 %>
   <% end %>
 </div>
-<div class="right"><h5>Mercenaries</h5>
+
+<div class="mercenaries">
   <% @match.matchers.mercs.of_contester(contester).each do |matcher| %>
-    <p>
+    <div class="player fields">
       <%= hidden_field_tag "match[matchers_attributes][#{@n}][id]", matcher.id %>
       <%= hidden_field_tag "match[matchers_attributes][#{@n}][user_id]", matcher.user_id %>
       <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %>
       <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %>
       <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", true %>
-      <%= check_box_tag "match[matchers_attributes][#{@n}][_destroy]", "keep", true %>
-      <%= matcher.user %>
-    </p>
-    <% @n = @n + 1; end %>
+      <%= check_box_tag "match[matchers_attributes][#{@n}][_destroy]", "keep", true, { id: "player_#{@n}" } %>
 
-    <p>
-      <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %>
-      <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %>
-      <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", true %>
-      <%= hidden_field_tag "match[matchers_attributes][#{@n}][_destroy]", "keep" %>
-      <%= link_to_function 'Merc', "findUser('match[matchers_attributes][#{@n}][merc][user_id]')" %>:
-      <%= text_field_tag "match[matchers_attributes][#{@n}][user_id]", '', :size => 5 %>
-    </p>
+      <%= label_tag "player_#{@n}", '', class: 'checkbox' %>
+      
+      <span><%= matcher.user %></span>
+    </div>
+
+    <% @n = @n + 1 %>
+  <% end %>
+
+  <div class="fields">
+    <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %>
+    <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %>
+    <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", true %>
+    <%= hidden_field_tag "match[matchers_attributes][#{@n}][_destroy]", "keep" %>
+
+    <%= text_field_tag "match[matchers_attributes][#{@n}][user_id]", '', placeholder: 'Mercenary' %>
   </div>
+</div>

app/views/matches/edit.html.erb

@@ -1,6 +1,3 @@
-<h1>Editing match</h1>
+<h1>Editing Match</h1>
 
-<%= render :partial => "form" %>
-
-<%= link_to 'Show', @match %> |
-<%= link_to 'Back', edit_contest_path(@match.contest) %>
+<%= render partial: 'form' %>

app/views/matches/new.html.erb

@@ -1,5 +1,3 @@
-<h1>New match</h1>
+<h1>New Match</h1>
 
-<%= render :partial => "form" %>
-
-<%= link_to 'Back', matches_path %>
+<%= render partial: 'form' %>

app/views/matches/ref.html.erb

@@ -1,98 +1,104 @@
-<h2>
-  <%= namelink @match.contester1.team %> vs <%= namelink @match.contester2.team %>
-</h2>
+<div id="match">
+  <h1 class="fancy title">
+    <span>Referee Admin</span>
+  </h1>
 
-<%= render :partial => "javascripts/mce_full" %>
+  <div class="contesters">
+    <h1 class="team-1"><%= namelink @match.contester1.team if @match.contester1 %></h1>
+    <div class="versus">
+      <span class="vs">VS</span>
+    </div>
+    <h1 class="team-2"><%= namelink @match.contester2.team if @match.contester2 %></h1>
+  </div>
 
-<div class="wide box">
-  <h2>
-    Lineup
-  </h2>
+  <%= render partial: 'javascripts/mce_full' %>
 
-  <div class="box center">
+  <div class="lineups">
+    <h3>Lineups</h3>
+
+    <div class="team-1">
+      <%= form_for @match do |f| %>
+        <%= f.error_messages %>
+
+        <div class="controls">
+          <%= f.submit 'Save Lineup' %>  
+        </div>
+
+        <% [@match.contester1].each do |contester| %>
+            <%= render partial: "lineup", locals: { contester: contester } %>
+        <% end %>
+      <% end %>
+    </div>
+
+    <div class="team-2">
+      <%= form_for @match do |f| %>
+        <%= f.error_messages %>
+
+        <div class="controls">
+          <%= f.submit 'Save Lineup' %>  
+        </div>
+
+        <% [@match.contester2].each do |contester| %>
+            <%= render partial: "lineup", locals: { contester: contester } %>
+        <% end %>
+      <% end %>
+    </div>
+  </div>
+
+  <div class="scoring">
+    <%= form_for @match, html: { class: 'square' } do |f| %>
+      <%= f.error_messages %>
+
+      <h3>Scoring</h3>
+
+      <div class="fields horizontal">
+        <%= f.label :server_id %>
+        <%= f.select :server_id, Server.active.collect { |d| ["#{d.name}", d.id] }, { include_blank: true } %>
+      </div>
+
+      <div class="fields horizontal">
+        <%= f.label :forfeit %>
+        <%= f.check_box :forfeit %>
+        <%= f.label :forfeit, class: 'checkbox' %>
+      </div>
+
+      <div class="fields horizontal">
+        <%= f.label "Scores" %>
+        <div class="inputs scores">
+          <%= f.text_field :score1, size: 1 %>
+          <%= f.text_field :score2, size: 2 %>  
+        </div>
+      </div>
+
+      <div class="fields horizontal">
+        <%= f.label :demo %>
+        <div class="inputs">
+          <%= f.select :demo_id, DataFile.ordered.collect { |d| ["#{d.name}", d.id] }, { include_blank: true } %>
+        </div>
+      </div>
+
+      <div class="fields horizontal">
+        <%= f.label 'Player of the match' %>
+        <%= f.text_field :motm_name, { value: User.get(@match.motm_id) } %>
+      </div>
+
+      <div class="controls">
+        <%= f.submit 'Save Scores' %>
+      </div>
+    <% end %>
+  </div>
+
+  <div class="report">
     <%= form_for @match do |f| %>
-    <%= f.error_messages %>
+      <%= f.error_messages %>
 
-    <% [@match.contester1].each do |contester| %>
-        <%= render :partial => "lineup", :locals => {:contester => contester} %>
+      <h3>Match Report</h3>
+
+      <%= f.text_area :report %>
+
+      <div class="controls">
+        <%= f.submit 'Save Report' %>
+      </div>
     <% end %>
-    <p class="clear">
-      <%= f.submit "Save" %>
-    </p>
-  <% end %>
-</div>
-<div class="box center">
-  <%= form_for @match do |f| %>
-    <%= f.error_messages %>
-
-    <% [@match.contester2].each do |contester| %>
-        <%= render :partial => "lineup", :locals => {:contester => contester} %>
-    <% end %>
-    <p class="clear">
-      <%= f.submit "Save" %>
-    </p>
-  <% end %>
-</div>
-
-  <p class="clear"></p>
-</div>
-
-<div class="wide box">
-  <%= form_for @match do |f| %>
-    <%= f.error_messages %>
-
-    <h3>
-      Scoring and options
-    </h3>
-
-    <p>
-      <%= f.label :server_id %>
-      <%= f.select :server_id, Server.hlds.active.collect{|d| ["#{d.name}", d.id]}, {:include_blank => true} %>
-    </p>
-
-    <p>
-      <%= f.label :forfeit %>
-      <%= f.check_box :forfeit %>
-    </p>
-
-    <p>
-      Score:
-      <%= f.text_field :score1, :size => 1 %>
-      <%= f.text_field :score2, :size => 2 %>
-    </p>
-
-    <p>
-      <%= f.label :demo %>:
-      <%= f.select :demo_id, DataFile.ordered.collect{|d| ["#{d.name}", d.id]}, {:include_blank => true} %>
-    </p>
-
-    <p>
-      <%= link_to_function 'Man of the match', "findUser('motm')" %>:
-      <%= f.text_field :motm_name, {:value => User.get(@match.motm_id)} %>
-    </p>
-
-    <p>
-      <%= f.submit "Save" %>
-    </p>
-  <% end %>
-</div>
-
-<div class="wide box">
-  <%= form_for @match do |f| %>
-    <%= f.error_messages %>
-
-    <h3>
-      Report
-    </h3>
-
-    <p>
-      <%= f.text_area :report, :rows => 20, :cols => 60 %>
-    </p>
-
-    <p>
-      <%= f.submit "Save" %>
-    </p>
-  <% end %>
-</div>
-
-<%= link_to "Back", @match %>
+  </div>
+</div>

config/routes.rb

@@ -5,6 +5,10 @@ Ensl::Application.routes.draw do
 		resources :versions
 	end
 
+  match 'contests/del_map'
+  match 'contests/scores'
+  match 'contests/historical', to: "contests#historical"
+
 	resources :contests do
 		get 'current', on: :collection
 	end
@@ -71,16 +75,12 @@ Ensl::Application.routes.draw do
   match 'news/admin', to: "articles#admin"
   match 'articles/cleanup'
 
-  match 'contests/historical', to: "contests#historical"
-
   match 'data_files/admin'
   match 'data_files/addFile'
   match 'data_files/delFile'
   match 'data_files/trash'
 
   match 'contesters/recalc'
-  match 'contests/scores'
-  match 'contests/del_map'
 
   match 'directories', to: "directories#show", id: 1