Misago/misago/emberapp/app/styles/_misago/threadslists.less

//
// Threads lists
// --------------------------------------------------


.threads-list {
  .table-panel {
    border: none;

    .list-group {
      margin: 0px;

      .list-group-item {
        padding-top: @padding-base-vertical + 1px;
        padding-bottom: @padding-base-vertical + 1px;

        &.active {
          background-color: @table-row-highlight;
        }


        // Thread icon
        //
        //==
        .thread-icon {
          display: block;
          float: left;
          position: relative;
          right: 5px;
          top: 6px;

          color: @state-default;
        }

        &.new {
          .thread-icon {
            color: @state-active;
          }
        }


        // Thread title
        //
        //==
        .thread-title {
          display: block;
          margin-left: @font-size-large * 1.5;
          font-size: @font-size-large;

          .opacity(0.7);
        }

        &.new {
          .thread-title {
            .opacity(1);
          }
        }


        // Thread last reply
        //
        //==
        .thread-stats {
          &>* {
            float: right;
          }

          .thread-flags {
            margin-right: @font-size-large;
            position: relative;
            top: 2px;

            &>li {
              float: left;
              overflow: visible;

              button {
                background: none;
                border: none;
                margin: 0px;
                padding: 0px;

                color: @text-color;
              }

              .label {
                border-radius: @border-radius-small;
                margin-left: @line-height-computed / 3;

                font-weight: normal;
              }

              .fa, .glyphicon {
                .opacity(0.5);
                transition-duration: 0.5s;

                &:hover, &:focus {
                  .opacity(0.9);
                  transition-duration: 0.05s;
                }
              }
            }
          }

          .thread-replies {
            display: inline-block;
            margin: 0px;
            margin-right: @font-size-large;
            margin-top: -2px;
            .opacity(0.6);
            transition-duration: 0.5s;
            width: @font-size-large * 4.5;

            font-size: @font-size-large;

            a {
              color: @text-color;
            }

            .label {
              display: inline;
              padding-left: 4px;

              color: #fff;
              font-size: @font-size-base;
              font-weight: normal !important;
            }

            &.new-replies {
              .opacity(1);
            }

            &.thread-read {
              padding-top: 2px;
            }
          }

          .thread-location {
            display: inline-block;
            margin-right: @font-size-large * 1.5;
            overflow: hidden;
            position: relative;
            top: 5px;
            width: @font-size-large * 4.5;

            font-size: @font-size-small;
            text-overflow: ellipsis;
            white-space: nowrap;

            span {
              position: relative;
              bottom: 2px;

              color: @state-default;
              font-size: @font-size-base * 0.75;
            }

            a:link, a:visited {
              color: @state-default;
            }

            a:hover, a:focus {
              color: @state-hover;
            }

            a:active {
              color: @state-clicked;
            }
          }

          .thread-author {
            margin-right: @font-size-large / 2;

            img {
              border-radius: @border-radius-small;
              width: 25px;
              margin: -3px 0px;
              position: relative;
              top: 1px;
            }

            &:hover {
              text-decoration: none;
            }
          }

          a.last-post {
            display: block;
            width: 64px;
            position: relative;
            top: 3px;

            color: @state-default;

            &:hover {
              color: @state-hover;
            }

            &:active {
              color: @state-clicked;
            }
          }

          .thread-check {
            margin: 0px;

            color: @text-muted;
            font-size: 25px;
            text-decoration: none;
            line-height: 24px;

            cursor: pointer;


            &.active {
              color: @brand-success;
            }

            input {
              position: absolute;
              top: -9999px;
              left: -9999px;
            }
          }
        }


        // Empty list message
        //
        //==
        &.message-row {
          padding-top: @line-height-computed;
          padding-bottom: @line-height-computed;

          font-size: @font-size-large;
        }
      }
    }
  }
}