thomas-mcdonald/qa

// This contains styling used in both displaying questions & answers

%control-container {
  margin-bottom: 5px;

  form {
    padding-top: 0;
    margin: 0 0 0 5px;
    width: 30px;

    button,
    input[type="submit"] {
      background: none;
      border: 0;
    }
  }
}

.post {
  @include make-row();

  .controls {
    @extend .hidden-xs;
    @include make-sm-column(1);
    @include make-md-column(1);
    margin-bottom: 15px;
  }

  .vote-controls {
    @extend %control-container;

    .vote-count {
      font-weight: bold;
      font-size: 16px;
      margin: 0 0 0 11px;
      text-align: center;
    }

    // more specific to avoid popover css conflict
    form .arrow {
      font-size: 20px;
      height: 22px;
      margin: -3px 0;
      width: 30px;
    }

    .vote-active {
      color: $vote-active;
    }
  }

  .accept-answer,
  .unaccept-answer {
    @extend %control-container;
    margin-top: 5px;

    $accepted-margin: 3px;
    form { margin-left: $accepted-margin; } // reduce margin slightly to centre
    .accepted-standalone { margin-left: $accepted-margin + 6px; } // match active buttons

    .icon-ok {
      font-size: 26px;
      text-shadow: 0 0 1px #000;
    }

    .inactive.icon-ok { color: #eee; }
    .active.icon-ok {
      color: $vote-active;
      text-shadow: 0 0 1px #000;
    }
  }

  .main {
    @include make-sm-column(11);
    @include make-md-column(11);
  }

  .body { margin-bottom: 15px; }
  .meta { @include clearfix(); }
  .links { float: left; }
  .righto { float: right; }
}

$diff-ins-background: #d1e1ad;
$diff-ins-colour: #405a04;
$diff-del-background: #e5bdb2;
$diff-del-colour: #a82400;

.post-diff {
  .ins {
    background-color: $diff-ins-background;
    color: $diff-ins-colour;
  }
  .del {
    text-decoration: line-through;
    background-color: $diff-del-background;
    color: $diff-del-colour;
  }

  .tag-ins {
    background-color: $diff-ins-background;
  }

  .tag-del {
    background-color: $diff-del-background;
  }
}

.event-info {
  @include make-row();

  .revision-id {
    @include make-md-column(1);
    font-size: 32px;
  }

  .user-info {
    float: right;
    margin-right: 40px;
  }
}