<commit_before>// LMS -- views -- student notes
// ====================

// in this document:
// --------------------
// +notes
// +base
// ++header +and search
// +local variables/utilities
// +individual group of notes
// +tabbed views
// +search - no results
// +search - error
// +case - no notes made

// +notes:
// --------------------
// * this Sass partial contains all of the styling needed for the student notes listing view.
// * for other notes styling referenced here, see the Sass partial contains the in-line student notes UI.

// +local variables/utilities:
// --------------------
$divider-visual-primary: ($baseline/5) solid $gray-l4;
$divider-visual-secondary: ($baseline/10) solid $gray-l4;
$divider-visual-tertiary: ($baseline/20) solid $gray-l4;

%notes-tab-control {
  @include transition(none);
  @extend %shame-link-base;
  display: inline-block;
  vertical-align: middle;
  border-bottom: ($baseline/5) solid $transparent;
}

.view-student-notes {

  // +base:
  // --------------------
  .wrapper-student-notes {
    @include clearfix();
    padding-bottom: $baseline;

    .student-notes {
      @include clearfix();
      @extend .content; // needed extend carried over from course handouts UI, but should be cleaned up
      width: 100%;
    }
  }

  // +header +and search:
  // --------------------
  .title-search-container {
    @include clearfix();
    margin-bottom: $baseline;

    .wrapper-title {
      @include float(left);
      width: flex-grid(7,12);

      .page-title {
        @extend %t-title4;
        @extend %t-weight1;
        margin-bottom: 0;

        .page-subtitle {
          @extend %t-title7;
          @extend %t-weight2;
          display: block;
          margin-top: ($baseline/4);
          color: $gray-l1;
          letter-spacing: 0;
        }
      }
    }

    .wrapper-notes-search {
      @include float(right);
      width: flex-grid(5,12);
      @include text-align(right);
    }

    .search-notes-input, .search-notes-submit {
      display: inline-block;
      vertical-align: middle;
    }

    .search-notes-input {
      @extend %t-demi-strong;
      position: relative;
      @include right(-6px); // manually positioning input right next to submit
      width: 55%;
      padding: ($baseline/2) ($baseline*0.75);
      color: $gray-d3;
    }

    .search-notes-submit {
      @extend %btn-inherited-primary;
      @extend %t-action2;
      padding: 8px $baseline 9px $baseline; // manually syncing up height with search input
    }
  }

  // +individual group of notes
  // --------------------
  .note-group {
    border-top: $divider-visual-primary;
    margin: 0;
    padding-top: ($baseline*1.5);

    // course structure labels
    .course-title, .tags-title {
      @extend %t-title6;
      @extend %t-weight4;
      margin: 0 0 ($baseline/2) 0;
      color: $gray-d3;
    }

    .course-subtitle {
      @extend %t-title7;
      @extend %t-weight4;
      margin: 0 0 ($baseline/4) 0;
      border-bottom: $divider-visual-tertiary;
      padding-bottom: ($baseline/2);
      color: $gray-d3;
    }

    .tags-title {
      border-bottom: $divider-visual-tertiary;
      padding-bottom: ($baseline/2);
    }

    // individual note
    .note {
      @include clearfix();
      margin: ($baseline*1.5) 0;

      .wrapper-note-excerpts {
        @include transition(box-shadow $tmg-avg ease-in-out 0, border-color $tmg-avg ease-in-out 0);
        display: inline-block;
        width: flex-grid(9, 12);
        border: 1px solid $gray-l5;
        border-radius: ($baseline/10);

        // note - highlighted content
        .note-excerpt {
          @include transition(background-color $tmg-avg ease-in-out 0);
          padding: $baseline;
          background: $student-notes-highlight-color;

          .note-excerpt-p,
          .note-excerpt-ul,
          .note-excerpt-ol {
            @extend %t-copy-base;
          }
        }

        .note-excerpt-more-link {
          @extend %t-copy-sub1;
          @extend %t-weight2;
          @extend %shame-link-text;
          display: inline;
          @include margin-left($baseline/4);
        }

        // note - comment made on highlighted content
        .note-comments {
          @extend %ui-no-list;
          border-top: ($baseline/5) solid $student-notes-highlight-color-focus;

          .note-comment {
            @include transition(color $tmg-avg ease-in-out 0);
            padding: ($baseline*0.75) $baseline;
            color: $gray;

            .note-comment-title {
              @extend %t-title8;
              letter-spacing: ($baseline/20);
              margin: 0 0 ($baseline/4) 0;
              color: $gray-l2;<commit_msg>RC fixup for student notes button<commit_after>// LMS -- views -- student notes
// ====================

// in this document:
// --------------------
// +notes
// +base
// ++header +and search
// +local variables/utilities
// +individual group of notes
// +tabbed views
// +search - no results
// +search - error
// +case - no notes made

// +notes:
// --------------------
// * this Sass partial contains all of the styling needed for the student notes listing view.
// * for other notes styling referenced here, see the Sass partial contains the in-line student notes UI.

// +local variables/utilities:
// --------------------
$divider-visual-primary: ($baseline/5) solid $gray-l4;
$divider-visual-secondary: ($baseline/10) solid $gray-l4;
$divider-visual-tertiary: ($baseline/20) solid $gray-l4;

%notes-tab-control {
  @include transition(none);
  @extend %shame-link-base;
  display: inline-block;
  vertical-align: middle;
  border-bottom: ($baseline/5) solid $transparent;
}

.view-student-notes {

  // +base:
  // --------------------
  .wrapper-student-notes {
    @include clearfix();
    padding-bottom: $baseline;

    .student-notes {
      @include clearfix();
      @extend .content; // needed extend carried over from course handouts UI, but should be cleaned up
      width: 100%;
    }
  }

  // +header +and search:
  // --------------------
  .title-search-container {
    @include clearfix();
    margin-bottom: $baseline;

    .wrapper-title {
      @include float(left);
      width: flex-grid(7,12);

      .page-title {
        @extend %t-title4;
        @extend %t-weight1;
        margin-bottom: 0;

        .page-subtitle {
          @extend %t-title7;
          @extend %t-weight2;
          display: block;
          margin-top: ($baseline/4);
          color: $gray-l1;
          letter-spacing: 0;
        }
      }
    }

    .wrapper-notes-search {
      @include float(right);
      width: flex-grid(5,12);
      @include text-align(right);
    }

    .search-notes-input, .search-notes-submit {
      display: inline-block;
      vertical-align: middle;
    }

    .search-notes-input {
      @extend %t-demi-strong;
      position: relative;
      @include right(-6px); // manually positioning input right next to submit
      width: 55%;
      padding: ($baseline/2) ($baseline*0.75);
      color: $gray-d3;
    }

    .search-notes-submit {
      @extend %btn-inherited-primary;
      @extend %t-action2;
      padding: 8px $baseline 9px $baseline; // manually syncing up height with search input
    }
  }

  // +individual group of notes
  // --------------------
  .note-group {
    border-top: $divider-visual-primary;
    margin: 0;
    padding-top: ($baseline*1.5);

    // course structure labels
    .course-title, .tags-title {
      @extend %t-title6;
      @extend %t-weight4;
      margin: 0 0 ($baseline/2) 0;
      color: $gray-d3;
    }

    .course-subtitle {
      @extend %t-title7;
      @extend %t-weight4;
      margin: 0 0 ($baseline/4) 0;
      border-bottom: $divider-visual-tertiary;
      padding-bottom: ($baseline/2);
      color: $gray-d3;
    }

    .tags-title {
      border-bottom: $divider-visual-tertiary;
      padding-bottom: ($baseline/2);
    }

    // individual note
    .note {
      @include clearfix();
      margin: ($baseline*1.5) 0;

      .wrapper-note-excerpts {
        @include transition(box-shadow $tmg-avg ease-in-out 0, border-color $tmg-avg ease-in-out 0);
        display: inline-block;
        width: flex-grid(9, 12);
        border: 1px solid $gray-l5;
        border-radius: ($baseline/10);

        // note - highlighted content
        .note-excerpt {
          @include transition(background-color $tmg-avg ease-in-out 0);
          padding: $baseline;
          background: $student-notes-highlight-color;

          .note-excerpt-p,
          .note-excerpt-ul,
          .note-excerpt-ol {
            @extend %t-copy-base;
          }
        }

        .note-excerpt-more-link {
          @extend %t-copy-sub1;
          @extend %t-weight2;
          @extend %shame-link-text;
          display: inline;
          @include margin-left($baseline/4);
          border: 0;
          background: transparent;
          padding: 0;
          
          &:active {
              background: transparent;
              box-shadow: none;
          }
        }

        // note - comment made on highlighted content
        .note-comments {
          @extend %ui-no-list;
          border-top: ($baseline/5) solid $student-notes-highlight-color-focus;

          .note-comment {
            @include transition(color $tmg-avg ease-in-out 0);
            padding: ($baseline*0.75) $baseline;
            color: $gray;

            .note-comment-title {
              @extend %t-title8;
              letter-spacing: ($baseline/20);
              margin: 0 0 ($baseline/4) 0;
              color: $gray-l2;
{'fraction_non_alphanumeric': 0.16435643564356436, 'fraction_numerical': 0.017926003126628454, 'mean_word_length': 1.7984835228929716, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '516088', 'n_tokens_mistral': 3138, 'n_tokens_neox': 2922, 'n_words': 699}