SWAMPy

✎ CARVE FLESH

EDITING: _dashboard_activity.scss

/*
 * Copyright (C) 2015 - present 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/>.
 */

@import "base/environment";

#right-side .placeholder {
  height: 200px;
}

.recent-activity-header {
  margin: 0;
  border-bottom: 1px solid $ic-border-light;
  line-height: 1.2;
  padding-bottom: $ic-sp;
  font-size: 1.5em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.recent_activity > li {
  position: relative;
  border-bottom: 1px solid #ddd;
  .title {
    font-weight: normal;
  }
  .links {
    @include fontSize(11px);
  }
  .unread-count {
    display: block;
    background: var(--ic-brand-primary);
    border-radius: 15px;
    width: 10px;
    height: 10px;
    position: absolute;
    #{direction(left)}: 3px;
    top: 22px;
    padding: 0;
  }
  .accessibly-hidden {
    position: absolute;
    #{direction(left)}: -9999px;
  }
  .unread {
    width: 10px;
    height: 10px;
    margin-#{direction(left)}: -15px;
    background-color: var(--ic-brand-primary);
    border-radius: 5px;
  }
}

.stream_header {
  cursor: pointer;
  user-select: none;
  display: flex;
  padding: $ic-sp 0;
  .image-block {
    flex: 1;
    align-items: center;
    padding-#{direction(right)}: $ic-sp*0.5;
  }
  .toggle-details {
    text-transform: uppercase;
    @include fontSize(11px);
  }
  &:hover {
    @if $use_high_contrast == false {
      background: $ic-bg-light-primary;
    }
    .toggle-details {
      text-indent: 0;
      text-align: direction(right);
    }
  }
}

$ignore-col-width: 50px;

.header-right-side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.toggle-details {
  display: block;
  text-align: direction(right);
  text-indent: 0;
  &:hover {
    text-decoration: none;
  }
}

.details_container {
  display: none;
  margin-#{direction(left)}: 52px;
}

.stream-details {
  width: 100%;
  tr {
    border-top: 1px dotted $ic-border-light;
    line-height: 2.0;
    // remove hover color on high contrast and use link underlines on hover instead (a11y)
    @if $use_high_contrast == false {
      &:hover {
        background: $ic-bg-light-primary;
      }
    }
  }
  .date {
    @include fontSize(11px);
    line-height: 1.5;
    width: 20%;
    white-space: normal;
    text-align: center;
  }
  .remove {
    width: 5%;
  }
}

.ignore-item {
  float: none;
  display: block;
  text-align: center;
  text-indent: 0;
}

.content_summary {
  overflow-wrap: break-word;
  word-break: normal;
  word-wrap: break-word;
  display: block;
  color: inherit;
  @if $use_high_contrast {
    text-decoration: none;
    &:hover {
      text-decoration: underline;
    }
  }
  @else {
    &:hover {
      text-decoration: none;
    }
  }
  font-weight: bold;
  @include fontSize($ic-font-size--xsmall);
}

.fake-link {
  color: var(--ic-link-color);
  &:hover {
    text-decoration: underline;
  }
}

// hide the context stuff if you're in context
#course_home_content .fake-link,
#group_messages .fake-link,
#course_home_content .stream_header .links,
#group_messages .stream_header .links {
  display: none;
}

$dashboardIconSize: 28px;

.recent_activity .image-block-image {
  width: $dashboardIconSize;
  margin-#{direction(right)}: 10px;
  margin-#{direction(left)}: 10px;
}

.recent_activity .image-block-image i {
  height: $dashboardIconSize;
  font-size: $dashboardIconSize;
  line-height: $dashboardIconSize;
  &:before {
    @if $use_high_contrast {
      color: $ic-font-color-dark;
    }
    @else {
      color: darken($ic-color-light, 30%);
    }
    font-size: $dashboardIconSize;
  }
}

CANCEL

Name	Type	Size	Modified	Actions
↩ ..	DIR	—	—
📄 _dashboard_activity.scss	SCSS	4.1 KB	2023-09-24 03:36	EDIT