edx-platform/lms/static/sass/discussion/views/_home.scss

// discussion - views - home layout
// ====================

// home - layout
.view-discussion-home {
  @include padding-left($baseline);

  display: none;

  // Only show this component for large sizes
  @include media-breakpoint-up(lg) {
    display: block;
  }

  section {
    border-bottom: 1px solid $forum-color-border;
  }

  .label {
    @extend %t-copy-sub2;

    display: block;
  }

  .label-settings {
    padding-top: $baseline;
    padding-bottom: ($baseline/2);
  }

  .home-header {
    margin: 0;
  }

  .home-title {
    font-size: $forum-large-font-size;
    color: $black;
    margin-bottom: ($baseline/4);
  }

  .home-description {
    @extend %t-copy-sub2;

    margin-bottom: ($baseline/2);
  }

  .home-stats {
    padding: $baseline 0;

    .label-area {
      display: inline-block;
      min-width: ($baseline*5);
      width: 25%;
      vertical-align: middle;

      .profile-link {
        font-weight: 700;
      }
    }

    .stats-grouping {
      @include padding-left($baseline);

      display: inline-block;
      width: 70%;

      .profile-stat {
        @extend %t-copy-sub2;

        display: inline-block;
        width: 32.5%;
        vertical-align: middle;

        .count {
          font-size: $forum-x-large-font-size;
          display: inline-block;
          padding: 0 ($baseline/2);
          vertical-align: middle;
        }

        .profile-stat-label {
          vertical-align: middle;
        }
      }
    }
  }

  .home-helpgrid {
    border-bottom: none;
    border-radius: $forum-border-radius;
    border: 1px solid $forum-color-border;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  }

  .helpgrid-row {
    border-bottom: 1px solid $forum-color-border;

    .row-title {
      padding: ($baseline*1.5) $baseline;
      background-color: #dedede;
      font-size: $forum-small-font-size;
    }

    .row-item-full,
    .row-item {
      font-size: $forum-small-font-size;
      padding: 0 ($baseline/2);
      width: 26%;
      vertical-align: middle;

      .icon {
        padding: 0 ($baseline/2);
        font-size: 24px;
        vertical-align: middle;
        // TODO: don't use table-cell for layout purposes as it switches the screenreader mode
        display: table-cell;
      }

      .fa-stack .icon {
        padding: 0 ($baseline/2);
      }

      .row-description {
        vertical-align: middle;
        // TODO: don't use table-cell for layout purposes as it switches the screenreader mode
        display: table-cell;
      }
    }

    .row-item-full {
      .notification-checkbox {
        @include margin-right($baseline/2);

        display: inline-block;

        @include padding($baseline/4, 0, $baseline/2, 0);

        border-radius: $forum-border-radius;
        border: 1px solid gray;

        .email-setting {
          display: inline-block;
          text-align: center;
          vertical-align: middle;

          @include margin-left($baseline/2);
        }

        .icon {
          display: inline-block;
        }

        .email-setting:checked ~ .icon {
          color: $green;
        }
      }

      .row-description {
        display: inline-block;
        width: 80%;
      }
    }
  }

  .helpgrid-row-navigation {
    .fa-bars {
      color: theme-color("light");
    }

    .fa-search {
      color: $gray-300;
    }

    .fa-sort {
      color: $gray-300;
    }
  }

  .helpgrid-row-participation {
    .fa-plus {
      color: $green;
    }

    .fa-flag {
      color: $pink;
    }

    .fa-star {
      color: $blue;
    }
  }

  .helpgrid-row-notification {
    .fa-square {
      color: $green;
    }

    .fa-envelope {
      color: $gray-300;
    }
  }
}