Switch themes to minimo

themes/minimo/src/stylesheets/layouts/entry/_comments.scss

@@ -0,0 +1,108 @@
+.comments {
+  ol {
+    list-style: none;
+
+    &.comment-list {
+      margin: 0;
+    }
+  }
+
+  &-title {
+    @include font-size(1.25);
+    margin-bottom: 1.5em;
+  }
+}
+
+.comment {
+  position: relative;
+  margin: 1em 0;
+
+  &-header {
+    min-height: 3em;
+  }
+
+  .avatar {
+    float: left;
+    height: 3em;
+    width: 3em;
+    border-radius: 0.25em;
+    margin-right: 0.75em;
+  }
+
+  &-meta {
+    @include font-size(0.875);
+  }
+
+  .fn {
+    display: inline-block;
+    margin-top: 0.1em;
+  }
+
+  .says {
+    @extend .screen-reader-text;
+  }
+
+  .reply {
+    display: inline-block;
+    position: absolute;
+    right: 0;
+    margin-top: -2em;
+
+    a {
+      display: inline-block;
+    }
+  }
+
+  &-content {
+    margin-top: 0.75em;
+    border-radius: 0.25em;
+    border: 1px solid $color__grey;
+    padding: 1em;
+    padding-bottom: 2em;
+
+    @extend .entry-content;
+  }
+
+  &-respond {
+    margin: 1.5em 0;
+  }
+
+  &-reply-title {
+    small {
+      display: inline-block;
+      @include font-size(0.5);
+      margin-left: 1em;
+    }
+  }
+
+  &-form {
+    label {
+      display: inline-block;
+      margin-bottom: 0.25em;
+    }
+
+    & > div {
+      margin-top: 1em;
+    }
+  }
+
+  &-submission-feedback {
+    display: none;
+    position: relative;
+    border-radius: 0.25em;
+    border: 1px solid $color__grey;
+    padding: 1.5em;
+    margin-bottom: 1.5em;
+
+    a {
+      position: absolute;
+      top: 1.5em;
+      right: 1.5em;
+      @include font-size(0.875);
+    }
+
+    &:target {
+      display: block;
+    }
+  }
+}