From 736099fa51805a26707fc3ae37f1c55ed473c295 Mon Sep 17 00:00:00 2001 From: Alberto Garcia Cabeza Date: Tue, 27 Dec 2016 13:37:24 +0100 Subject: [PATCH 1/8] adds id to advanced search href link and form --- app/views/shared/_advanced_search.html.erb | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/views/shared/_advanced_search.html.erb b/app/views/shared/_advanced_search.html.erb index c27c8f8d6..beb0ada63 100644 --- a/app/views/shared/_advanced_search.html.erb +++ b/app/views/shared/_advanced_search.html.erb @@ -1,9 +1,9 @@
- <%= link_to t("shared.advanced_search.title"), "#", id: 'js-advanced-search-title', class: "advanced-search small" %> + <%= link_to t("shared.advanced_search.title"), "#advanced_search_form", id: 'js-advanced-search-title', class: "advanced-search small" %>
- <%= form_tag search_path, method: :get do %> + <%= form_tag search_path, id: "advanced_search_form", method: :get do %> From ae7458024d14750bb235efec869cf0f10a8f2c73 Mon Sep 17 00:00:00 2001 From: Alberto Garcia Cabeza Date: Tue, 27 Dec 2016 13:57:27 +0100 Subject: [PATCH 3/8] closes missing aside tag --- app/views/debates/show.html.erb | 1 + 1 file changed, 1 insertion(+) diff --git a/app/views/debates/show.html.erb b/app/views/debates/show.html.erb index e2e2c84c9..363a3bab3 100644 --- a/app/views/debates/show.html.erb +++ b/app/views/debates/show.html.erb @@ -58,6 +58,7 @@ <% end %>
+ <% end %> From f0258fb3ee7e8e98cc9eda71df6808e6ffc6fd13 Mon Sep 17 00:00:00 2001 From: Alberto Garcia Cabeza Date: Tue, 27 Dec 2016 14:26:20 +0100 Subject: [PATCH 4/8] improves html structure for comments --- app/assets/stylesheets/layout.scss | 20 ++++++---- app/views/comments/_comment.html.erb | 55 ++++++++++++++-------------- 2 files changed, 41 insertions(+), 34 deletions(-) diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index e5e6562d3..e18accc53 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -1601,7 +1601,10 @@ table { } .comment-body { - margin-left: rem-calc(42); + + img { + margin-right: $line-height/2; + } .reply { background: white; @@ -1609,15 +1612,19 @@ table { border-left: 0; border-right: 0; font-size: $small-font-size; - margin: rem-calc(6) 0; - padding: rem-calc(6); + margin: $line-height/4 0; + padding: $line-height/4; position: relative; + a.relative, [class^="icon-arrow"] { + padding-left: $line-height/2; + } + [class^="icon-arrow"] { - font-size: rem-calc(18); + font-size: $base-font-size; left: -20px; position: absolute; - top: 0; + top: -1px; } .divider { @@ -1669,8 +1676,7 @@ table { .comment-info { color: $text-medium; font-size: $small-font-size; - margin-top: $line-height/4; - vertical-align: middle; + line-height: rem-calc(32); // Same as avatar height span.user-name { color: $text; diff --git a/app/views/comments/_comment.html.erb b/app/views/comments/_comment.html.erb index 549b62862..f215068ca 100644 --- a/app/views/comments/_comment.html.erb +++ b/app/views/comments/_comment.html.erb @@ -1,29 +1,28 @@ <% cache [locale_and_user_status(comment), comment, commentable_cache_key(comment.commentable), comment.author, (@comment_flags[comment.id] if @comment_flags)] do %>
    - - <% if comment.hidden? || comment.user.hidden? %> - <% if comment.children.size > 0 %> -
    -

    <%= t("comments.comment.deleted") %>

    -
    - <% end %> - <% else %> - <% if comment.as_administrator? %> - <%= image_tag("avatar_admin.png", size: 32, class: "admin-avatar float-left") %> - <% elsif comment.as_moderator? %> - <%= image_tag("avatar_moderator.png", size: 32, class: "moderator-avatar float-left") %> - <% else %> - <% if comment.user.hidden? || comment.user.erased? %> - - <% elsif comment.user.organization? %> - <%= image_tag("avatar_collective.png", size: 32, class: "avatar float-left") %> - <% else %> - <%= avatar_image(comment.user, seed: comment.user_id, size: 32, class: "float-left") %> +
  • + <% if comment.hidden? || comment.user.hidden? %> + <% if comment.children.size > 0 %> +
    +

    <%= t("comments.comment.deleted") %>

    +
    + <% end %> + <% else %> + <% if comment.as_administrator? %> + <%= image_tag("avatar_admin.png", size: 32, class: "admin-avatar float-left") %> + <% elsif comment.as_moderator? %> + <%= image_tag("avatar_moderator.png", size: 32, class: "moderator-avatar float-left") %> + <% else %> + <% if comment.user.hidden? || comment.user.erased? %> + + <% elsif comment.user.organization? %> + <%= image_tag("avatar_collective.png", size: 32, class: "avatar float-left") %> + <% else %> + <%= avatar_image(comment.user, seed: comment.user_id, size: 32, class: "float-left") %> + <% end %> <% end %> - <% end %> -
  • <% if comment.as_administrator? %> @@ -73,7 +72,7 @@ <% if comment.children.size > 0 %> - <%= link_to "", class: "js-toggle-children relative", data: {'id': "#{dom_id(comment)}"} do %> + <%= link_to "#{dom_id(comment)}", class: "js-toggle-children relative", data: {'id': "#{dom_id(comment)}"} do %> <%= t("shared.hide") %> <%= t("comments.comment.responses", count: comment.children.size) %> @@ -94,11 +93,13 @@
    • <% end %> -
      - <% child_comments_of(comment).each do |child| %> - <%= render 'comments/comment', comment: child %> - <% end %> -
    +
  • +
      + <% child_comments_of(comment).each do |child| %> + <%= render 'comments/comment', comment: child %> + <% end %> +
    +
<% end %> From 170ef4e680e52d3a2036e76996a3d09b95958cff Mon Sep 17 00:00:00 2001 From: Alberto Garcia Cabeza Date: Tue, 27 Dec 2016 16:17:43 +0100 Subject: [PATCH 5/8] improves styles for users avatar --- app/assets/stylesheets/layout.scss | 15 ++++++--------- app/assets/stylesheets/participation.scss | 19 +++++++------------ 2 files changed, 13 insertions(+), 21 deletions(-) diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index e18accc53..9b52e51db 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -901,16 +901,12 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar { } .author-deleted, .user-deleted { - background-color: rgba(255,255,255,.5); color: rgba(0,0,0,.4); - font-size: rem-calc(40); - left: 11px; - position: absolute; - top: 72px; -} - -.user-deleted { - top: -4px; + display: inline-block; + font-size: rem-calc(32); + line-height: rem-calc(32); + height: rem-calc(32); + vertical-align: top; } .user-permissions { @@ -1675,6 +1671,7 @@ table { .comment-info { color: $text-medium; + display: inline-block; font-size: $small-font-size; line-height: rem-calc(32); // Same as avatar height diff --git a/app/assets/stylesheets/participation.scss b/app/assets/stylesheets/participation.scss index a5e1d7df2..143595de7 100644 --- a/app/assets/stylesheets/participation.scss +++ b/app/assets/stylesheets/participation.scss @@ -325,9 +325,13 @@ clear: both; color: $text-medium; font-size: $small-font-size; - min-height: $line-height*2; + margin-bottom: $line-height/2; position: relative; + span { + line-height: rem-calc(32); // Same as avatar height + } + a { color: $text-medium; } @@ -337,15 +341,6 @@ line-height: $line-height; margin: 0; } - - .author-deleted { - left: 0; - top: 4px; - } - - .author.deleted { - margin-left: rem-calc(48); - } } .debate-description, .proposal-description { @@ -370,9 +365,9 @@ } .author-photo { - line-height: $line-height*2; + line-height: rem-calc(32); margin-right: rem-calc(6); - vertical-align: middle; + vertical-align: top; width: 32px; } From a95edee7c7cc7ddfc0820c9e035960543747e3bd Mon Sep 17 00:00:00 2001 From: Alberto Garcia Cabeza Date: Tue, 27 Dec 2016 16:29:32 +0100 Subject: [PATCH 6/8] improves styles for reply and deleted comments --- app/assets/stylesheets/layout.scss | 10 +++++++--- app/views/comments/_comment.html.erb | 4 ++-- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index 9b52e51db..734a4bfe6 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -1626,6 +1626,10 @@ table { .divider { color: $text-light; } + + form { + margin-top: $line-height/2; + } } .comment-user { @@ -1655,13 +1659,13 @@ table { .is-deleted { background: #E7E7E7; - margin-left: rem-calc(42); - padding: $line-height/4 $line-height/2; + margin-left: $line-height; + padding: $line-height/2; } .comment-children { border-left: 1px dashed $border; - margin-left: rem-calc(42); + margin-left: $line-height; padding-left: $line-height/4; @media only screen and (max-width: 40em) { diff --git a/app/views/comments/_comment.html.erb b/app/views/comments/_comment.html.erb index f215068ca..0acce8bd5 100644 --- a/app/views/comments/_comment.html.erb +++ b/app/views/comments/_comment.html.erb @@ -91,8 +91,8 @@ <%= render 'comments/form', {commentable: comment.commentable, parent_id: comment.id, toggeable: true} %> <% end %> - - <% end %> + <% end %> +
    • <% child_comments_of(comment).each do |child| %> From b8f60b48fe073d554f9f448d1bd01f579badcf53 Mon Sep 17 00:00:00 2001 From: Alberto Garcia Cabeza Date: Tue, 27 Dec 2016 16:30:56 +0100 Subject: [PATCH 7/8] changes time tags to span --- app/views/comments/_comment.html.erb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/comments/_comment.html.erb b/app/views/comments/_comment.html.erb index 0acce8bd5..23dd514d1 100644 --- a/app/views/comments/_comment.html.erb +++ b/app/views/comments/_comment.html.erb @@ -57,7 +57,7 @@ <% end %> -  •  +  • <%= l comment.created_at.to_datetime, format: :datetime %>
      _reply" class="reply"> - +
      <%= render 'comments/votes', comment: comment %> - +
      <% if comment.children.size > 0 %> <%= link_to "#{dom_id(comment)}", class: "js-toggle-children relative", data: {'id': "#{dom_id(comment)}"} do %>