css: factor out shared forum post / comment css.

This commit is contained in:
evazion
2019-09-29 14:09:47 -05:00
parent 5dfc14ba07
commit f34489af02
10 changed files with 60 additions and 102 deletions

View File

@@ -0,0 +1,53 @@
div.list-of-messages {
margin: 1em 0;
article.message {
display: flex;
margin-top: 2em;
word-wrap: break-word;
padding: 5px;
&:first-of-type {
margin-top: 1em;
}
div.author {
flex-basis: 12em;
margin-right: 1em;
time {
font-style: italic;
}
}
div.content {
flex: 1;
menu {
li {
margin-right: 1em;
}
}
}
@media (max-width: 660px) {
display: block;
margin-top: 3em;
div.author {
margin: 0 0 1em;
h4 {
display: inline;
margin-right: 0.5em;
}
time {
display: inline;
color: var(--muted-text-color);
font-size: 0.8em;
}
}
}
}
}

View File

@@ -7,16 +7,8 @@ div.comments-for-post {
div.list-of-comments {
article.comment {
display: flex;
margin-top: 2em;
word-wrap: break-word;
padding: 5px;
flex: 1;
&:first-of-type {
margin-top: 1em;
}
&[data-is-sticky="true"] {
background: var(--comment-sticky-background-color);
}
@@ -40,25 +32,6 @@ div.comments-for-post {
opacity: 1.0;
}
}
div.author {
flex-basis: 12em;
margin-right: 1em;
time {
font-style: italic;
}
}
div.content {
flex: 1;
menu {
li {
margin-right: 1em;
}
}
}
}
}
}
@@ -126,27 +99,6 @@ form.edit_comment div.input.boolean {
}
@media screen and (max-width: 660px) {
div.comments-for-post div.list-of-comments article.comment {
display: block;
margin-top: 3em;
padding: 5px;
div.author {
margin: 0 0 1em;
h4 {
display: inline;
margin-right: 0.5em;
}
time {
display: inline;
color: var(--muted-text-color);
font-size: 0.8em;
}
}
}
div#c-comments div#a-index, div#c-comments div#a-show {
margin: 0 0.5em;
@@ -171,8 +123,4 @@ form.edit_comment div.input.boolean {
}
}
}
div.new-comment {
margin: 1em 0;
}
}

View File

@@ -1,13 +1,5 @@
div.list-of-forum-posts {
article.forum-post {
display: flex;
margin-top: 2em;
word-wrap: break-word;
&:first-of-type {
margin-top: 1em;
}
a.voted {
font-weight: bold;
}
@@ -24,18 +16,7 @@ div.list-of-forum-posts {
color: var(--forum-vote-down-color);
}
div.author {
flex-basis: 12em;
margin-right: 1em;
time {
font-style: italic;
}
}
div.content {
flex: 1;
.edit_forum_post, .edit_forum_topic {
display: none;
}
@@ -44,10 +25,6 @@ div.list-of-forum-posts {
ul.votes {
margin: 0.5em 0;
}
li {
margin-right: 1em;
}
}
}
}
@@ -86,24 +63,4 @@ div#c-forum-topics {
#c-forum-topics #a-show {
padding: 0 0.5em;
}
div.list-of-forum-posts article.forum-post {
display: block;
margin-top: 3em;
div.author {
margin: 0 0 1em;
h4 {
display: inline;
margin-right: 0.5em;
}
time {
display: inline;
color: var(--muted-text-color);
font-size: 0.8em;
}
}
}
}

View File

@@ -1,5 +1,5 @@
<div id="p-index-by-comment" class="comments-for-post">
<div class="list-of-comments">
<div class="list-of-comments list-of-messages">
<% @comments.each do |comment| %>
<% if CurrentUser.is_moderator? || (params[:search] && params[:search][:is_deleted] =~ /t/) || !comment.is_deleted? %>
<%= content_tag(:div, { id: "post_#{comment.post.id}", class: ["post", *PostPresenter.preview_class(comment.post)].join(" ") }.merge(PostPresenter.data_attributes(comment.post))) do %>

View File

@@ -11,7 +11,7 @@
</div>
<% end %>
<div class="list-of-comments">
<div class="list-of-comments list-of-messages">
<% if comments.present? %>
<%= render partial: "comments/partials/show/comment", collection: comments %>
<% elsif post.last_commented_at.present? %>

View File

@@ -1,6 +1,6 @@
<% if CurrentUser.is_moderator? || (params[:search] && params[:search][:is_deleted] =~ /t/) || !comment.is_deleted? %>
<a name="comment-<%= comment.id %>"></a>
<article class="comment"
<article class="comment message"
data-id="<%= comment.id %>"
data-post-id="<%= comment.post_id %>"
data-creator-id="<%= comment.creator_id %>"

View File

@@ -1,7 +1,7 @@
<div id="c-comments">
<div id="a-show">
<div class="comments-for-post">
<div class="list-of-comments">
<div class="list-of-comments list-of-messages">
<%= content_tag(:div, { id: "post_#{@comment.post_id}", class: ["post", *PostPresenter.preview_class(@comment.post)].join(" ") }.merge(PostPresenter.data_attributes(@comment.post))) do %>
<div class="preview">
<% if @comment.post.visible? %>

View File

@@ -1,5 +1,5 @@
<% if forum_post.visible?(CurrentUser.user, ActiveModel::Type::Boolean.new.cast(params.dig(:search, :is_deleted))) %>
<article class="forum-post" id="forum_post_<%= forum_post.id %>" data-forum-post-id="<%= forum_post.id %>" data-creator="<%= forum_post.creator.name %>">
<article class="forum-post message" id="forum_post_<%= forum_post.id %>" data-forum-post-id="<%= forum_post.id %>" data-creator="<%= forum_post.creator.name %>">
<div class="author">
<h4>
<%= link_to_user forum_post.creator %>

View File

@@ -1,7 +1,7 @@
<%- # forum_post %>
<%- # original_forum_post_id %>
<div class="list-of-forum-posts">
<div class="list-of-forum-posts list-of-messages">
<% forum_posts.each do |forum_post| %>
<%= render "forum_posts/forum_post", :forum_post => forum_post, :original_forum_post_id => original_forum_post_id %>
<% end %>

View File

@@ -1,5 +1,5 @@
<div id="c-forum-posts">
<div id="a-show" class="single-forum-post list-of-forum-posts">
<div id="a-show" class="single-forum-post list-of-forum-posts list-of-messages">
<h1>Topic: <%= @forum_post.topic.title %></h1>
<%= render "forum_post", :forum_post => @forum_post, :original_forum_post_id => @forum_post.topic.original_post.id %>
</div>