BIN
app/assets/images/comments_divider.png
Normal file
BIN
app/assets/images/comments_divider.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
BIN
app/assets/images/user_default_2.jpg
Normal file
BIN
app/assets/images/user_default_2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
@@ -8,7 +8,7 @@
|
||||
// 05.1. Debates Index
|
||||
// 05.2. Debates Show
|
||||
// 06. Comments
|
||||
// 06. Tags
|
||||
// 07. Tags
|
||||
//
|
||||
|
||||
// 01. Variables
|
||||
@@ -24,6 +24,9 @@ $brand: #0077B9;
|
||||
$debates: #008CCF;
|
||||
|
||||
$comments-bg: #FAF9F8;
|
||||
$comments-info: #A5B2B9;
|
||||
$comments-text: #3F4549;
|
||||
|
||||
|
||||
$header-color: #292B33;
|
||||
$link: #0077B9;
|
||||
@@ -33,7 +36,7 @@ $tags-border: #F0F0F0;
|
||||
$tags-color: #8F8F8F;
|
||||
|
||||
$text-color: #919399;
|
||||
$text-medium: #999999;
|
||||
$text-medium: #999999;
|
||||
$text-light: #a3a6ad;
|
||||
|
||||
$votes-background: #EDEDED;
|
||||
@@ -92,7 +95,7 @@ header {
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: white;
|
||||
color: white;
|
||||
font-size: rem-calc(45);
|
||||
font-weight: bolder;
|
||||
line-height: $line-height*3;
|
||||
@@ -231,7 +234,7 @@ header {
|
||||
margin-bottom: $line-height;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.votes {
|
||||
background: $votes-background;
|
||||
margin: -5px -20px -20px -20px;
|
||||
@@ -291,15 +294,16 @@ header {
|
||||
.debate-show {
|
||||
color: $text-medium;
|
||||
margin-top: $line-height;
|
||||
padding: 0 $line-height/2;
|
||||
margin-bottom: $line-height*2;
|
||||
padding: 0 $line-height/2;
|
||||
|
||||
.back {
|
||||
color: $text-light;
|
||||
font-size: rem-calc(13);
|
||||
line-height: $line-height;
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
h1 {
|
||||
clear: both;
|
||||
font-size: rem-calc(24);
|
||||
font-weight: bold;
|
||||
@@ -323,7 +327,7 @@ header {
|
||||
font-size: rem-calc(14);
|
||||
line-height: $line-height;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.author-photo {
|
||||
@@ -335,13 +339,13 @@ header {
|
||||
vertical-align: middle;
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
|
||||
.votes {
|
||||
border: 1px solid $votes-border;
|
||||
box-shadow: 0 2px 0 rgba(0,0,0,.1);
|
||||
border-radius: 3px;
|
||||
padding: $line-height/2;
|
||||
|
||||
|
||||
.fi-like {
|
||||
background: $votes-like;
|
||||
border: 1px solid $votes-like-b;
|
||||
@@ -398,6 +402,10 @@ header {
|
||||
width: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.publish-comment {
|
||||
margin-top: $line-height;
|
||||
}
|
||||
}
|
||||
|
||||
// 06. Comments
|
||||
@@ -405,19 +413,71 @@ header {
|
||||
|
||||
.comments {
|
||||
background: $comments-bg;
|
||||
margin-top: $line-height*2;
|
||||
background-image: url('comments_divider.png');
|
||||
background-repeat: repeat-x;
|
||||
padding-top: $line-height;
|
||||
padding-bottom: $line-height*4;
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.comment {
|
||||
margin: $line-height/4 0;
|
||||
|
||||
p {
|
||||
color: $comments-text;
|
||||
font-size: rem-calc(15);
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $comments-info;
|
||||
}
|
||||
|
||||
.user-photo {
|
||||
border-radius: 2px;
|
||||
display: inline-block;
|
||||
height: 32px;
|
||||
line-height: $line-height*2;
|
||||
margin-right: $line-height/4;
|
||||
vertical-align: top;
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.comment-body {
|
||||
margin-left: $line-height*1.6;
|
||||
|
||||
.reply {
|
||||
font-size: rem-calc(12);
|
||||
font-weight: lighter;
|
||||
}
|
||||
}
|
||||
|
||||
.comment-children {
|
||||
border-left: 1px dotted $border;
|
||||
margin-left: $line-height*1.6;
|
||||
padding-left: $line-height/4;
|
||||
|
||||
@media only screen and (max-width: 40em) {
|
||||
margin-left: $line-height/1.5;
|
||||
}
|
||||
}
|
||||
|
||||
.comment-info {
|
||||
color: $comments-info;
|
||||
font-size: rem-calc(13);
|
||||
font-weight: lighter;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 07. Tags
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.tags a {
|
||||
.tags a {
|
||||
background: $tags-bg;
|
||||
border: 1px solid $tags-border;
|
||||
border-radius: 3px;
|
||||
|
||||
23
app/controllers/account_controller.rb
Normal file
23
app/controllers/account_controller.rb
Normal file
@@ -0,0 +1,23 @@
|
||||
class AccountController < ApplicationController
|
||||
|
||||
before_action :authenticate_user!
|
||||
before_action :set_account
|
||||
|
||||
def show
|
||||
end
|
||||
|
||||
def update
|
||||
flash[:notice] = t("flash.actions.save_changes.notice") if @account.update(account_params)
|
||||
redirect_to account_path
|
||||
end
|
||||
|
||||
private
|
||||
def set_account
|
||||
@account = current_user
|
||||
end
|
||||
|
||||
def account_params
|
||||
params.require(:account).permit(:first_name, :last_name)
|
||||
end
|
||||
|
||||
end
|
||||
13
app/views/account/show.html.erb
Normal file
13
app/views/account/show.html.erb
Normal file
@@ -0,0 +1,13 @@
|
||||
<h1><%= t("account.show.title") %></h1>
|
||||
|
||||
<%= form_for @account, as: :account, url: account_path do |f| %>
|
||||
<%= f.label :first_name, t("account.show.first_name_label") %>
|
||||
<%= f.text_field :first_name %>
|
||||
<%= f.label :last_name, t("account.show.last_name_label") %>
|
||||
<%= f.text_field :last_name %>
|
||||
|
||||
<%= f.submit t("account.show.save_changes_submit"), class: "button radius" %>
|
||||
<% end %>
|
||||
|
||||
<%= link_to t("account.show.change_credentials_link"), edit_user_registration_path %>
|
||||
|
||||
@@ -1,13 +1,18 @@
|
||||
<div id="comment-<%= comment.id %>" class='comment' style="padding-bottom:30px">
|
||||
<p><%= comment.user.name %></p>
|
||||
<p>hace <%= time_ago_in_words(comment.created_at) %></p>
|
||||
<p><%= comment.body %></p>
|
||||
<div class="row">
|
||||
<div id="comment-<%= comment.id %>" class="small-12 column comment">
|
||||
|
||||
<div style="margin-left:50px">
|
||||
<%= render comment.children %>
|
||||
</div>
|
||||
|
||||
<div style="margin-left:50px">
|
||||
<%= render 'comments/form', parent: comment %>
|
||||
</div>
|
||||
<%= image_tag('user_default_2.jpg', class: 'user-photo left', size: '32x32') %>
|
||||
|
||||
<div class="comment-body">
|
||||
<span class="comment-info">
|
||||
<%= comment.user.name %> • <%= time_ago_in_words(comment.created_at) %>
|
||||
</span>
|
||||
<p><%= comment.body %></p>
|
||||
<p class="reply"><%= render 'comments/form', parent: comment %></p>
|
||||
</div>
|
||||
|
||||
<div class="comment-children">
|
||||
<%= render comment.children %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -6,6 +6,6 @@
|
||||
<%= f.hidden_field :commentable_type, value: parent.class %>
|
||||
<%= f.hidden_field :commentable_id, value: parent.id %>
|
||||
|
||||
<%= f.submit comment_button_text(parent), class: "button radius" %>
|
||||
<%= f.submit comment_button_text(parent), class: "button radius small" %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
|
||||
<div class="small-12 medium-9 column">
|
||||
|
||||
<%= link_to "< ".html_safe + t("debates.show.back_link"), debates_path, class: 'left back' %>
|
||||
<%= link_to "« ".html_safe + t("debates.show.back_link"), debates_path, class: 'left back' %>
|
||||
|
||||
<h1><%= @debate.title %></h1>
|
||||
<div class="debate-info">
|
||||
@@ -25,7 +25,7 @@
|
||||
<div class="row">
|
||||
<div id="comments" class="small-12 column">
|
||||
<h2><%= t("debates.show.comments") %></h2>
|
||||
<div style="padding-bottom:60px">
|
||||
<div>
|
||||
<%= t("debates.show.leave_comment") %>
|
||||
<%= render 'comments/form', parent: @debate %>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
<div style="background: #0077b9; width: 100%; margin-top: 48px;">
|
||||
<div style="background: #0077b9; width: 100%;">
|
||||
<%= image_tag('footer.jpg', style: 'width: 100%; max-width: 1170px;') %>
|
||||
</div>
|
||||
|
||||
@@ -23,6 +23,12 @@
|
||||
|
||||
<section class="top-bar-section">
|
||||
<%= render 'devise/menu/login_items' %>
|
||||
|
||||
<% if user_signed_in? %>
|
||||
<ul class="right">
|
||||
<li><%= link_to(t("layouts.header.my_account_link"), account_path) %></li>
|
||||
</ul>
|
||||
<% end %>
|
||||
</section>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
@@ -1,23 +1,25 @@
|
||||
<div id="votes" class="votes small-12 medium-3 column">
|
||||
<div class="small-12 column text-center">
|
||||
<div id="in_favor" class="inline-block">
|
||||
<%= link_to debate_votes_path(@debate, value: 'yes'), class: 'in-favor', method: "post" do %>
|
||||
<i class="fi-like"></i>
|
||||
<span><%= percentage('likes', @debate) %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<span class="divider"></span>
|
||||
|
||||
<div id="against" class="inline-block">
|
||||
<%= link_to debate_votes_path(@debate, value: 'no'), class: 'against', method: "post" do %>
|
||||
<i class="fi-dislike"></i>
|
||||
<span><%= percentage('dislikes', @debate) %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="small-12 column text-center">
|
||||
<div id="in_favor" class="inline-block">
|
||||
<%= link_to debate_votes_path(@debate, value: 'yes'), class: 'in-favor', method: "post" do %>
|
||||
<i class="fi-like"></i>
|
||||
<span><%= percentage('likes', @debate) %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<div class="small-12 column text-center">
|
||||
<p class="total-votes"><%= pluralize(@debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %></p>
|
||||
<span class="divider"></span>
|
||||
|
||||
<div id="against" class="inline-block">
|
||||
<%= link_to debate_votes_path(@debate, value: 'no'), class: 'against', method: "post" do %>
|
||||
<i class="fi-dislike"></i>
|
||||
<span><%= percentage('dislikes', @debate) %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="small-12 column text-center">
|
||||
<p class="total-votes">
|
||||
<%= pluralize(@debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user