// Dependencies.
@import 'init';

// Comments
//
// The comments of page.
//
// Markup: comment.hbs
//
// Style guide: components.comment

.comment,
%comment {
  @include margin-bottom(2);

  // Wrapper for the list of comments.
  &__outer-wrapper {
    @include margin(1 0);

    // Improve indented comment alignment.
    .indented {
      @include margin-left(50px);
    }
  }

  &__outer-wrapper-title {
    @include padding-top(1);
    @include margin-bottom(1);
  }

  &__inner-wrapper {
    // Your styles.
  }

  &__meta {
    @include font-size(s);
  }

  &__permalink {
    display: inline-block;
  }

  &__title {
    @include margin(0 0 .25);
  }

  p {
    @include margin(3px 0);
  }

  ul.links {
    @include unstyled-list;
    @include margin(.5 0);

    li {
      @include inline-list-item;
      @include padding-left(5px);
    }

    a {
      @include font-size(s);
    }
  }
}
