_developer.scss 1.93 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
// discussion: - developer
// ====================

// NOTES:
// * use this area for any developer-needed or created styling that needs to be refactored into patterns or visually
//   polished. Please list any template/view that reference your styles when definining them (example below):

// --------------------
// Views: Error
// --------------------
// .crazy-new-feature {
// background: transparent;
// }

// --------------------
// Views: forum_form_discussion / single_thread
// provisional styling for "search alerts" (messages boxes that appear in the sidebar below the search
// input field with notices pertaining to the search result).
// --------------------
body.discussion {

22
  .forum-nav {
23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48

    // wrapper for multiple alerts
    .search-alerts {

    }

    // a single alert, which can be independently displayed / dismissed
    .search-alert {
      @include transition(none);
      padding: ($baseline/2) 11px ($baseline/2) 18px;
      background-color: $black;
    }

    .search-alert-content, .search-alert-controls {
      display: inline-block;
      vertical-align: middle;
    }

    // alert content
    .search-alert-content {
      width: 70%;

      // alert copy
      .message {
        @include font-size(12);
        color: $white;
49 50 51 52 53

        em {
          @extend %t-weight5;
          font-style: italic;
        }
54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72
      }

      // links to jump to users/content in alerts
      .link-jump {
        @include transition(none);
        @extend %t-weight5;
      }
    }

    // alert controls
    .search-alert-controls {
      width: 28%;
      text-align: right;

      .control {
        @include font-size(14);
        @include transition(none);
        @extend %t-weight5;
        padding: ($baseline/4) ($baseline/2);
73
        color: $white;
74 75 76

        // reseting poorly globally scoped hover/focus state for this control
        &:hover, &:focus {
77 78
          color: $white;
          text-decoration: none;
79 80 81 82 83
        }
      }
    }
  }
}