@import "../base/000_vars.scss";

div.comments-for-post {
  div.notices {
    margin: 1em 0;
  }

  div.list-of-comments {
    article.comment {
      margin-bottom: 2em;
      word-wrap: break-word;
      padding: 5px;

      &[data-is-sticky="true"] {
        background: $menu_color;
      }

      &[data-is-voted="true"] {
        .comment-vote-up-link, .comment-vote-down-link {
          display: none;
        }
      }

      &[data-is-voted="false"] {
        .comment-unvote-link {
          display: none;
        }
      }

      &[data-below-threshold="true"][data-is-sticky="false"] {
        opacity: 0.3;

        &:hover {
          opacity: 1.0;
        }
      }

      div.author {
        width: 12em;
        float: left;
        overflow: hidden;
        margin-right: 1em;

        h1 {
          display: block;
          font-size: $h3_size;
        }
      }

      div.content {
        margin-left: 13em;
        min-width: 17em;

        menu {
          li {
            margin-right: 1em;
          }
        }
      }
    }
  }
}

div#c-posts {
  div.comments-for-post {
    float: left;
  }
}

div#c-comments {
  div#a-index, div#a-show {
    div.header {
      span.info {
        margin-right: 1.5em;
      }

      strong, time {
        margin-right: 0.3em;
      }

      div.notices {
        margin: 1em 0;
      }
    }

    div.preview {
      float: left;
      width: 154px;
      height: 154px;
      margin-right: 30px;
      overflow: hidden;
      text-align: center;
    }

    div.post-preview {
      &[data-tags~=animated], &[data-file-ext=swf], &[data-file-ext=webm], &[data-file-ext=zip], &[data-file-ext=mp4] {
        div.preview {
          position: relative;

          &:before {
            @include animated-icon;
          }
        }
      }

      &[data-has-sound=true] {
        div.preview {
          position: relative;

          &:before {
            @include sound-icon;
          }
        }
      }
    }

    div.post {
      margin-bottom: 4em;

      div.comments-for-post {
        margin-left: 184px;
        min-width: 30em;
        
        div.list-of-comments {
          float: left;
          width: 100%;
        }
      }
    }
    
    div.comments-for-post {
      div.post {
        article.comment {
          margin-left: 184px;
        }
      }
    }
  }
}

form.edit_comment div.input.boolean {
  display: inline-block;

  label {
    font-weight: normal;
    vertical-align: initial;
  }
}