css cleanups

Author: leafo

static/scss/main/community_post_list.scss

@@ -65,7 +65,6 @@ $post_spacing: 30px;
 
             .post_author a {
                 color: body_color_light();
-                font-size: 18px;
 
                 @include slighly_narrow {
                     font-size: inherit;

static/scss/main/submission_comment_list.scss

@@ -1,11 +1,10 @@
 .submission_comment_list {
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+
     .submission_comment, .comment_spacer {
         position: relative;
-        margin: 0 0 40px 0;
-
-        &:last-child {
-            margin-bottom: 30px;
-        }
     }
 
     .comment_spacer {
@@ -14,8 +13,6 @@
         margin-bottom: 0;
 
         &.animated {
-            margin-bottom: 40px;
-
             .submission_comment {
                 left: 0;
                 @include opacity(2);
@@ -31,7 +28,8 @@
     }
 
     .submission_comment {
-        @include clearfix;
+        display: flex;
+        gap: 10px;
 
         &.loading {
             position: relative;
@@ -57,39 +55,47 @@
         }
 
         .comment_avatar {
-            float: left;
-            margin-left: 20px;
-            margin-top: 5px;
+            flex: none;
 
+            > a {
+                display: block;
+            }
             img {
-                display: inline-block;
+                display: block;
                 width: 40px;
                 height: 40px;
                 border-radius: 20px;
             }
         }
 
-        .comment_tools {
-            float: right;
+        .comment_head {
+            display: flex;
+            gap: 10px;
+        }
+
+        .comment_author {
+            color: body_color_light();
+        }
 
+        .comment_tools {
+            margin-left: auto;
             a {
                 color: body_color_lighter();
             }
         }
 
         .comment_content {
-            margin-left: 80px;
-            margin-right: 20px;
+            flex: 1;
+            min-width: 0;
+            display: flex;
+            flex-direction: column;
+            gap: 10px;
         }
 
         .comment_time {
             color: body_color_lighter();
         }
 
-        .comment_head {
-            margin-bottom: 20px;
-        }
-
         .comment_body.user_formatted {
             padding: 0;
         }

static/scss/main/submission_commenter.scss

@@ -30,7 +30,7 @@
     }
 
     .submission_comment_list {
-        padding-top: 30px;
+        padding: 30px 20px;
         border-top: 1px solid border_color();
 
         &:empty {

static/scss/main/submission_list.scss

@@ -455,13 +455,12 @@
 
         .submission_footer {
             border-top: 1px solid border_color();
-            position: relative;
-            overflow: hidden;
+            display: flex;
+            gap: 5px;
 
             .footer_inside {
                 padding: 10px 20px;
                 position: relative;
-                float: left;
             }
 
             a {
@@ -474,6 +473,7 @@
             .submission_tags {
                 padding: 10px 20px;
                 text-align: right;
+                margin-left: auto;
 
                 .submission_tag {
                     @include transition(all 0.2s ease);
@@ -483,6 +483,10 @@
                     text-decoration: none;
                     color: body_color_light();
 
+                    &:first-child {
+                        margin-left: 0;
+                    }
+
                     &:hover {
                         color: link_color();
                     }

widgets/submission_comment_list.moon

@@ -29,6 +29,13 @@ class SubmissionCommentList extends require "widgets.base"
 
         div class: "comment_content", ->
           div class: "comment_head", ->
+            if suspended
+              em "Suspended account"
+            else
+              a class: "comment_author", href: user_url, comment.user\name_for_display!
+
+            span class: "comment_time", title: comment.created_at, time_ago_in_words comment.created_at
+
             if @current_user
               can_edit = comment\allowed_to_edit @current_user
               can_delete = @current_user.id == @submission.user_id
@@ -49,14 +56,6 @@ class SubmissionCommentList extends require "widgets.base"
                   raw " · "
                   a href: "#", class: "delete_btn", "Delete"
 
-            if suspended
-              em "Suspended account"
-            else
-              a href: user_url, comment.user\name_for_display!
-
-            raw " · "
-            span class: "comment_time", title: comment.created_at, time_ago_in_words comment.created_at
-
           div class: "comment_body user_formatted", ->
             if suspended
               p class: "suspended_message", ->