Welcome To Our Shell

Mister Spy & Souheyl Bypass Shell

/**
 * Comments
 *  - comment field (holds comment title, form, comments etc)
 *  - styles for comments
 ============================================================================ */

.comment {
  @include output-rhythm(padding, $medium 0);
  border-top: $border-width $border-style;

  // Title and New
  &__title {
    &--visually-hidden {
      margin: 0;
      padding: 0;
      @include output-rhythm(font-size, $medium);

      .permalink {
        @include visually-hidden;
      }

      .marker {
        float: $flow-to;
        @include output-rhythm(margin-#{$flow-from}, 4px);
      }
    }
  }

  &__new {}

  p:last-of-type {
    margin-bottom: 0;
  }

  // Comment author picture, name and date details.
  &__meta {
    display: flex;
    align-items: center;
    @include output-rhythm(margin, $medium 0);

    .comment.has-title & {
      @include output-rhythm(margin, $medium 0);
    }

    .comment__author {
      &:after {
        content: "-";
        display: inline-block;
      }
    }
    .comment__pubdate {}

    // User picture is showing.
    &--has-user-picture {
      .comment__author {
        &:after {
          display: none;
        }
      }

      .comment__author,
      .comment__pubdate {
        margin: 0;
        display: block;
      }
    }

    @media #{$mobile} {
      .comment__author {
        &:after {
          display: none;
        }
      }

      .comment__author,
      .comment__pubdate {
        margin: 0;
        display: block;
      }
    }

    // User picture.
    .field-type-image {
      float: #{$flow-from};
      @include output-rhythm(margin, 0 $small 0 0);

      img {
        width: auto;
        @include output-rhythm(height, $medium * 3);
      }
    }

    // figure wrapper.
    .field-type-image__figure {
      margin: 0;
      padding: 0;
    }

    // Remove potentially empty article element.
    article:empty {
      display: none;
    }
  }

  // Comment content wrapper.
  &__content {}

  // User signature.
  &__user-signature {}

  // Preview.
  &.preview {
    @include output-rhythm(padding, $medium);
    @include output-rhythm(margin-bottom, $medium);
  }

  // Comment links.
  &__links {
    clear: both;

    .inline {
      li {
        a {}
      }
    }
  }
}


// Author based classes.
.by-anonymous {}
.by-viewer {}
.comment--by-comment-author {}


// Typically comments are attached to comments - this is the main
// wrapper around comments and the comment form in comments, on
// a standard Drupal install which uses the mores specific class
// .field-comment--comment {}
.field-type-comment {
  @include output-rhythm(margin, $large 0 0);
  @include cfm;
  clear: both;

  .indented {
    @include output-rhythm(margin-#{$flow-from}, $xxx-large);
  }
}


// Comment field on comment content types.
.field-comment--comment {}


// typically this says 'Comments'.
.comment-field__title {}


// Comment form - basic classes only, see _form-styles.scss
.comment-form-wrapper {}
.comment-form__title {}
.comment-form {}