Cleans up articles, comments and widget styling

This commit is contained in:
Luke Barratt 2014-04-09 01:50:07 +01:00
parent 5487854a6c
commit 29f4ec7246
16 changed files with 225 additions and 124 deletions

View file

@ -40,4 +40,5 @@
Pages
*/
@import "pages/news";
@import "pages/contests";

View file

@ -1,3 +1,24 @@
#comments {
@include span-columns(12);
h3 {
margin: 1em 0;
}
.comment-form {
@include span-columns(12);
margin-bottom: em(20);
h3 {
margin-top: 0;
}
.fields {
margin-bottom: em(20);
}
}
}
.comment {
$comment-gutter: 1.4em;
$comment-image-padding: .7em;

View file

@ -12,7 +12,8 @@ form {
> .field_with_errors {
input {
input,
textarea {
border: $input-border-width solid $flash-error;
&:hover,
@ -26,7 +27,8 @@ form {
}
}
input {
input,
textarea {
background-color: $input-primary;
color: $input-text;
font-size: em(16);
@ -36,10 +38,12 @@ form {
&:hover {
border: $input-border-width solid lighten($input-secondary, 20%);
padding: $input-padding ($input-padding - $input-border-width);
}
&:focus {
border: $input-border-width solid $input-secondary;
padding: $input-padding ($input-padding - $input-border-width);
color: $input-secondary;
outline: none;
background: transparent;
@ -68,10 +72,12 @@ form.dark {
&:hover {
border: $input-dark-border-width solid $input-dark-border-hover-colour;
padding: $input-padding ($input-padding - $input-dark-border-width);
}
&:focus {
border: $input-dark-border-width solid $input-dark-border-focus-colour;
padding: $input-padding ($input-padding - $input-dark-border-width);
}
&:-webkit-autofill {

View file

@ -37,4 +37,4 @@ img.flag {
display: inline-block;
vertical-align: - em(6);
margin-right: em(10);
}
}

View file

@ -1,6 +1,7 @@
#sidebar {
.widget {
@include span-columns(12);
margin-bottom: em(20);
padding: em(20);
background: $light-gray;
@ -10,13 +11,9 @@
}
.widget-content-wrapper {
@include span-columns(12);
font-size: em(14);
}
}
.calendar {
max-height: 500px;
overflow-x: scroll;
.separator {
color: white;
@ -26,4 +23,53 @@
margin-bottom: em(12);
}
}
.calendar {
max-height: 500px;
overflow-x: scroll;
}
.shoutbox {
.transcript {
margin-bottom: 20px;
}
input {
@include span-columns(12);
margin-bottom: em(10);
}
}
.highlights,
.posts {
ol {
margin-bottom: em(20);
&:last-child {
margin-bottom: 0;
}
}
}
.poll {
.question {
@include span-columns(12);
margin-bottom: em(20);
h5 {
margin-bottom: 1em;
}
}
.bar {
display: block;
background: $green;
height: 10px;
}
.button {
margin-bottom: 0;
}
}
}

View file

@ -0,0 +1,31 @@
div.article {
@include span-columns(12);
border-bottom: 1px solid rgba(35, 35, 35, 0.1);
padding-bottom: em(20);
h1 {
margin: 1em 0;
}
.content {
@include span-columns(12);
margin-bottom: em(20);
}
.author {
@include span-columns(6);
}
.actions {
@include span-columns(6);
@include omega;
text-align: right;
}
&:first-child {
h1 {
margin-top: 0;
}
}
}

View file

@ -1,7 +1,7 @@
<div class="article wide">
<div class="article">
<h1><%= namelink article %></h1>
<div class="clear content">
<div class="content">
<% if article.text_coding == Article::CODING_HTML %>
<%= article.text.html_safe %>
<% else %>
@ -9,9 +9,9 @@
<% end %>
</div>
<h4 class="author">
<%= namelink article.user %> on <%= longtime article.created_at %>
</h4>
<div class="author">
<%= flag(article.user.country) %> <%= namelink(article.user) %> on <%= longtime article.created_at %>
</div>
<div class="actions">
<% if article.can_update? cuser %>

View file

@ -1,6 +1,5 @@
<div class="comments">
<div id="comments">
<h3>Comments</h3>
<%= render partial: "comments/comment", collection: @comments %>
<%= render partial: "comments/new" %>
</div>
<%= render partial: "comments/new" %>

View file

@ -1,10 +1,8 @@
<div class="commentNew center centered">
<h3>
New comment
</h3>
<div class="comment-form">
<h3>New comment</h3>
<% if cuser %>
<%= form_for(@comment, :remote => true) do |f| %>
<%= form_for(@comment, remote: true) do |f| %>
<ul>
<% @comment.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
@ -12,12 +10,12 @@
</ul>
<%= f.hidden_field :commentable_id %>
<%= f.hidden_field :commentable_type %>
<p>
<%= f.text_area :text, :rows => 5, :cols => 40, :id => "textArea" %>
</p>
<p>
<div class="fields">
<%= f.text_area :text, rows: 5, cols: 40, id: "textArea" %>
</div>
<div class="controls">
<%= f.submit 'Post Comment' %>
</p>
</div>
<% end %>
<% else %>
Please log in or <%= link_to "register", new_user_path %> to post comments.

View file

@ -1,19 +1,21 @@
<h5><%= @poll.question %></h5>
<div class="widget-content-wrapper">
<div class="question">
<h5><%= @poll.question %></h5>
<div>
<% @poll.options.all.each do |opt| %>
<p>
<% if cuser and !@poll.voted?(cuser) %>
<%= link_to (h opt), :controller => "votes", :action => "create", :vote => {:votable_id => opt.id, :votable_type => "Option"} %>
<% else %>
<%= opt.option %> <br />
<% end %>
<% if opt.votes > 0 %>
<%= image_tag "/images/icons/poll.png", :class => "bar", :height => 6, :width => opt.votes*100/@poll.votes %>
<% end %>
<span><%= opt.votes %></span>
</p>
<% end %>
<% @poll.options.all.each do |opt| %>
<p class="option">
<% if cuser and !@poll.voted?(cuser) %>
<%= link_to (h opt), controller: "votes", action: "create", vote: { votable_id: opt.id, votable_type: "Option" } %>
<% else %>
<%= opt.option %> <br />
<% end %>
<% if opt.votes > 0 %>
<%= content_tag :div, "", { class: "bar", style: "width: #{opt.votes*100/@poll.votes}%;" } %>
<% end %>
<span><%= opt.votes %></span>
</p>
<% end %>
</div>
</div>
<p><%= link_to "Archive..", polls_path %></p>
<%= link_to "Archive", polls_path, class: "button" %>

View file

@ -3,15 +3,17 @@
You have been muted.
<% else %>
<% scroll = shoutmsg.domain == "shoutbox" ? "" : "$('#{shoutmsg.domain}').scrollTop = $('#{shoutmsg.domain}').scrollHeight;" %>
<%= form_for(shoutmsg, :remote => true, :html => {:id => "new_#{shoutmsg.domain}"}) do |f| %>
<%= form_for(shoutmsg, remote: true, html: { id: "new_#{shoutmsg.domain}" }) do |f| %>
<% if shoutmsg.shoutable %>
<%= f.hidden_field :shoutable_type %>
<%= f.hidden_field :shoutable_id %>
<% end %>
<p>
<div class="fields">
<%= f.text_field :text, size: 12, id: "#{shoutmsg.domain}_text", class: "shout_input" %>
</div>
<div class="controls">
<%= submit_tag "Shout!" %>
</p>
</div>
<% end %>
<% end %>
<% end %>

View file

@ -1,55 +1,56 @@
<div class="widget highlights">
<h4><%= t('widget.highlights') %></h4>
<div class="body">
<div class="content">
<% if cuser and cuser.active_contests.count != 0 then %>
<h3>
Your contests
<%= link_to "(More)", :controller => :matches, :matchesTab => "YourTab" %>
</h3>
<ol>
<% cuser.active_contests.each do |contest| %>
<li>
<%= namelink contest %>
<br />
</li>
<% end %>
</ol>
<% end %>
<% if Match.recent.count != 0 then %>
<h5>
Latest Matches
<%= link_to "(More)", :controller => :matches, :matchesTab => "RecentTab" %>
</h5>
<ol>
<% Match.realfinished.reverse_order.recent.chrono.each do |match| %>
<li>
<%= link_to match, :class => "bold #{match.score_color}" do %>
<%= h match.score1 %> - <%= h match.score2 %>
<%= link_to match.contester1.team.tag, :controller => :contesters, :action => :show, :id => match.contester1 %> <%= if match.score1 > match.score2 then ">>" elsif match.score2 > match.score1 then "<<" else "==" end %> <%= link_to match.contester2.team.tag, :controller => :contesters, :action => :show, :id => match.contester2 %>
(<%= link_to match.contest.short_name, :controller => :contests, :action => :show, :id => match.contest.id %>)
<% end %>
<br />
</li>
<% end %>
</ol>
<% end %>
<div class="widget-content-wrapper">
<% if cuser and cuser.active_contests.count != 0 then %>
<div class="separator">
Your contests
<%= link_to "(More)", controller: :matches, matchesTab: "YourTab" %>
</div>
<ol>
<% cuser.active_contests.each do |contest| %>
<li>
<%= namelink contest %>
<br />
</li>
<% end %>
</ol>
<% end %>
<% if Match.future5.count != 0 then %>
<h5>
Upcoming matches
<%= link_to "(More)", :controller => :matches, :matchesTab => "UpcomingTab" %>
</h5>
<ol>
<% Match.future5.chrono.each do |match| %>
<li>
<%= namelink match, 50 %> (<%= link_to match.contest.short_name, :controller => :contests, :action => :show, :id => match.contest.id %>)<br />
<%= shorttime match.match_time %> (<%= match.predictions.count %> preds : <%= match.preds(1) %>% - <%= match.preds(2) %>%)
</li>
<% end %>
</ol>
<% end %>
</div>
<% if Match.recent.count != 0 then %>
<div class="separator">
Latest Matches
<%= link_to "(More)", controller: :matches, matchesTab: "RecentTab" %>
</div>
<ol>
<% Match.realfinished.reverse_order.recent.chrono.each do |match| %>
<li>
<%= link_to match, :class => "bold #{match.score_color}" do %>
<%= h match.score1 %> - <%= h match.score2 %>
<%= link_to match.contester1.team.tag, controller: :contesters, action: :show, id: match.contester1 %> <%= if match.score1 > match.score2 then ">>" elsif match.score2 > match.score1 then "<<" else "==" end %> <%= link_to match.contester2.team.tag, controller: :contesters, action: :show, id: match.contester2 %>
(<%= link_to match.contest.short_name, :controller => :contests, :action => :show, :id => match.contest.id %>)
<% end %>
<br />
</li>
<% end %>
</ol>
<% end %>
<% if Match.future5.count != 0 then %>
<div class="separator">
Upcoming matches
<%= link_to "(More)", controller: :matches, matchesTab: "UpcomingTab" %>
</div>
<ol>
<% Match.future5.chrono.each do |match| %>
<li>
<%= namelink match, 50 %><br>
[<%= link_to match.contest.short_name, controller: :contests, action: :show, id: match.contest.id %>]
<%= shorttime match.match_time %><br>
<em><%= match.predictions.count %> preds : <%= match.preds(1) %>% - <%= match.preds(2) %>%</em>
</li>
<% end %>
</ol>
<% end %>
</div>
</div>

View file

@ -1,11 +1,8 @@
<% if @current_action == "news_index" %>
<div class="widget poll">
<h4><%= t('widget.poll') %></h4>
<div class="body">
<div class="content">
<% @poll = Poll.first(order: "created_at DESC") %>
<%= render(partial: "polls/show") if @poll %>
</div>
</div>
<% @poll = Poll.first(order: "created_at DESC") %>
<%= render(partial: "polls/show") if @poll %>
</div>
<% end %>

View file

@ -1,25 +1,24 @@
<div class="widget posts">
<h4><%= t('widget.posts') %></h4>
<div class="body">
<div class="content">
<h5>Latest forum posts</h3>
<ol>
<% Topic.basic.recent.latest_page(1).each do |topic| %>
<li>
<%= link_to shorten(topic, 35), lastpost(topic) %>
</li>
<% end %>
</ol>
<h5>Latest comments</h5>
<ol>
<% Comment.recent.filtered.each do |comment| %>
<li>
<%= namelink comment.commentable, 15 %>
by <%= namelink comment.user, 15 %>
</li>
<% end %>
</ol>
</div>
<div class="widget-content-wrapper">
<div class="separator">Latest forum posts</div>
<ol>
<% Topic.basic.recent.latest_page(1).each do |topic| %>
<li>
<%= link_to shorten(topic, 28), lastpost(topic) %>
</li>
<% end %>
</ol>
<div class="separator">Latest comments</div>
<ol>
<% Comment.recent.filtered.each do |comment| %>
<li>
<%= namelink comment.commentable, 15 %>
by <%= namelink comment.user, 10 %>
</li>
<% end %>
</ol>
</div>
</div>

View file

@ -6,8 +6,6 @@
</div>
</div>
<%= render :partial => "shoutmsgs/new", :locals => { :shoutmsg => Shoutmsg.new } %>
<p>
<%= link_to "Shoutbox Recent History", :controller => :shoutmsgs, :action => "index" %><br/>
<%= link_to "Shoutbox Rules", article_path(Article::SB_RULES) %>
</p>
<%= link_to "Shoutbox Recent History", :controller => :shoutmsgs, :action => "index" %><br/>
<%= link_to "Shoutbox Rules", article_path(Article::SB_RULES) %>
</div>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.8 KiB