_instructor.scss

.instructor-dashboard-wrapper {
  display: table;
  position: relative;

  .beta-button-wrapper {
    position: absolute;
    top: 2em;
    right: 2em;
  }

  .studio-edit-link{
    position: absolute;
    top: 3.5em;
    right: 2em;
  }

  section.instructor-dashboard-content {
    @extend .content;
    padding: 40px;
    width: 100%;

    h1 {
      @extend .top-header;
    }
  }

  // form fields
  .list-fields {
    list-style: none;
    margin: 0;
    padding: 0;

    .field {
      margin-bottom: 20px;
      padding: 0;

      &:last-child {
        margin-bottom: 0;
      }

      .tip {
        display: block;
        margin-top: ($baseline/4);
        color: tint(rgb(127,127,127),50%);
        @include font-size(12);
      }

    }

  }

  // ====================

  // system feedback - messages
  .msg {
    border-radius: 1px;
    padding: 10px 15px;
    margin-bottom: 20px;

    .copy {
      font-weight: 600;
    }
  }

  // TYPE: warning
  .msg-warning {
    border-top: 2px solid $warning-color;
    background: tint($warning-color,95%);

    .copy {
      color: $warning-color;
    }
  }

  // TYPE: confirm
  .msg-confirm {
    border-top: 2px solid $confirm-color;
    background: tint($confirm-color,95%);

    .copy {
      color: $confirm-color;
    }
  }

  // TYPE: confirm
  .msg-error {
    border-top: 2px solid $error-color;
    background: tint($error-color,95%);

    .copy {
      color: $error-color;
    }
  }

  // ====================

  // inline copy
  .copy-confirm {
    color: $confirm-color;
  }

  .copy-warning {
    color: $warning-color;
  }

  .copy-error {
    color: $error-color;
  }

  .list-advice {
    list-style: none;
    padding: 0;
    margin: 20px 0;

    .item {
      font-weight: 600;
      margin-bottom: 10px;

      &:last-child {
        margin-bottom: 0;
      }
    }
  }

  //Metrics tab

  .metrics-container {
    position: relative;
    width: 100%;
    float: left;
    clear: both;
    margin-top: 25px;
  }
  .metrics-left {
    position: relative;
    width: 30%;
    height: 640px;
    float: left;
    margin-right: 2.5%;
  }
  .metrics-right {
    position: relative;
    width: 65%;
    height: 295px;
    float: left;
    margin-left: 2.5%;
    margin-bottom: 25px;
  }
  .metrics-tooltip {
    width: 250px;
    background-color: lightgray;
    padding: 3px;
  }
  .stacked-bar-graph-legend {
    fill: white;
  }

  p.loading {
    padding-top: 100px;
    text-align: center;
  }

  p.nothing {
    padding-top: 25px;
  }

  h3.attention {
    padding: 10px;
    border: 1px solid #999;
    border-radius: 5px;
    margin-top: 25px;
  }

  .wrapper-msg {
    margin-bottom: ($baseline*1.5);

    .msg {
      margin-bottom: 0;
    }

    .note {
      margin: 0;
    }
  }

}