_components.scss

//
// Copyright (C) 2014 - 2017 Instructure, Inc.
//
// This file is part of Canvas.
//
// Canvas is free software: you can redistribute it and/or modify it under
// the terms of the GNU Affero General Public License as published by the Free
// Software Foundation, version 3 of the License.
//
// Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
// A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
// details.
//
// You should have received a copy of the GNU Affero General Public License along
// with this program. If not, see <http://www.gnu.org/licenses/>.
//

.toolbar {
  padding: $contentBoxPadding / 2;
  @include fontSize($ic-font-size--small);
  line-height: $baseLineHeight;
  .header { @include fontSize($ic-font-size--medium); }
}

// List View

$ic-brand-course-nav-link--active: $ic-brand-primary;

.list-view {
  overflow: auto;
  & > header,
  // oldskool compat
  #section-tabs-header {
    @include fontSize($ic-font-size--small);
    font-weight: bold;
    margin: 0 0 $ic-sp/2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #section-tabs-header-subtitle {
    display: block;
    @include fontSize(11px);
    font-style: italic;
    color: inherit;
  }

  & > *:first-child {
    border-top: 0 !important; // oldskool important
  }

  & > ul,
  // oldskool overrides
  & > nav > ul {
    list-style: none;
    margin: 0;
    padding: 0;

    & > li {
      padding: 0;
      & > a {
        display: block;
        text-decoration: none;
        color: $ic-font-color-dark;
        border-radius: $baseBorderRadius;
        padding: ($ic-sp - 4) $ic-sp;
        overflow-wrap: break-word;
        word-wrap: break-word;
        hyphens: auto;
        line-height: $ic-label-line-height;

        @if $use_high_contrast {
          text-decoration: underline;
        }

        &:hover, &:focus {
          background: lighten($ic-color-neutral, 5%);
        }

        & > span {
          white-space: nowrap;
        }
      }

      &:last-child > a {
        border-bottom: 0;
      }
    }
  }

  // lists w/o headers still need a strong border
  & > ul + ul {
    border-top: 1px solid $ic-border-light;
  }

  a.active {
    background-color: $ic-brand-course-nav-link--active;
    font-weight: bold;
    color: $ic-color-light;
    &:hover, &:focus { background-color: $ic-brand-primary; }
    .nav-badge {
      background: $ic-color-light;
      color: $ic-brand-primary;
    }
  }
}
.image-block {
  display: flex; min-width: 1px;

  .image-block-image {
    margin-right: $ic-sp;
  }
  .image-block-content {
    flex: 1;
    min-width: 1px;
  }
}

.box-shadow {
  box-shadow: 0 2px 4px rgba(0,0,0,.25)
}

.page-action-list {
  @include reset-list;
  a {
    display: block;
    padding: 8px 0;
    color: $ic-font-color-dark;
    font-weight: bold;
    border-bottom: 1px solid $ic-border-light;

    &:hover, &:focus {
      color: $ic-link-color;
    }

    @if $use_high_contrast { text-decoration: none; }

    &:active {
      color: $grayLight;
    }
  }
}

* + .page-action-list { margin-top: $ic-sp; }