edx-platform/lms/static/sass/multicourse/_survey-page.scss

// full-page course survey styles

.view-survey {
  .container {
    padding: ($baseline*1.5) 0;
  }

  .content-primary {
    @include float(left);
    @include margin-right(flex-gutter());

    width: flex-grid(9, 12);
  }

  .content-supplementary {
    @include float(left);

    width: flex-grid(3, 12);
    margin-top: ($baseline*2);
  }

  .header-survey {
    .title {
      @extend %t-title4;
      @extend %t-weight4;

      margin-bottom: $baseline;
      border-bottom: 1px solid $gray-l4;
      padding-bottom: ($baseline/2);
    }

    .course-info {
      @extend %t-title;

      padding-bottom: ($baseline/4);
    }

    .course-org,
    .course-number {
      @extend %t-title8;

      display: inline-block;
      color: $gray-l1;
    }

    .course-org {
      @include margin-right($baseline/4);
    }

    .course-name {
      @extend %t-title5;

      display: block;
    }
  }

  // reset nasty LMS default styles
  form {
    h1,
    h2 {
      text-align: inherit;
      letter-spacing: inherit;
      text-transform: inherit;
    }
  }

  .instructions {
    margin-bottom: $baseline;
    font-style: italic;

    @extend %t-copy-base;
  }

  .message.submission-error {
    display: block;
    margin-bottom: ($baseline);
    border-top: 3px solid $error-color;

    @include padding(($baseline), ($baseline*1.5), ($baseline*1.5), ($baseline*1.5));

    background-color: tint($error-color, 85%);

    .message-title {
      @extend %t-title5;
      @extend %t-weight4;

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

    .message-copy {
      @extend %ui-no-list;

      line-height: 1.3;

      .error-item {
        margin-bottom: ($baseline/3);
      }
    }

    &.is-hidden {
      display: none;
    }
  }

  .list-input {
    @extend %ui-no-list;

    .field {
      margin-bottom: $baseline;

      &.required label::after {
        content: "*";

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

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

        display: block;
        margin-top: ($baseline/4);
        color: $gray;
      }

      &.is-focused {
        .tip {
          color: $body-color;
        }
      }
    }
  }

  .action-primary {
    @extend %m-btn-primary;
    @extend %t-copy-base;

    @include padding-left($baseline*2);
  }

  .action-cancel {
    @extend %t-copy-sub1;

    @include margin-left($baseline);
  }

  // override basic label styles
  label {
    @extend %t-copy-base;
    @extend %t-weight4;

    display: block;
    font-style: normal;
  }

  // override basic form input styles
  button,
  input,
  select,
  textarea {
    @extend %t-copy-sub1;
  }

  .bit {
    margin-bottom: $baseline;

    .title {
      @extend %t-title7;
      @extend %t-weight4;
    }

    p {
      @extend %t-copy-sub1;

      color: $gray;
    }
  }
}