SWAMPy

✎ CARVE FLESH

EDITING: _show_hide_opacity.scss

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

//  example markup:
//  <div class="hover-container">
//    these links will be invisible (half transparent if on a touch device),
//    half-transparent when you hover the container, and opaque when hovered.
//    <span>
//      <a class="hide-till-hover"><i class="icon-edit standalone-icon"></a>
//      <a class="hide-till-hover"><i class="icon-delete standalone-icon"></a>
//    <span>
//  </div>

$dimmedOpacity: 0.6;
@if $use_high_contrast { $dimmedOpacity: 0.9; }

.hide-till-hover {
  opacity: 0;

.touch &,
  .hover-container:hover &,
  .hover-container:focus & {
    opacity: $dimmedOpacity;
  }

&:focus, &:hover {
    opacity: 1 !important; // the !important part is to win specificity with the rule above this
  }
}

//  Example markup:
//  <a class="dim-till-hover">
//    this will be 50% transparent until hovered over, regardless of .touch or .no-touch
//  </a>
.dim-till-hover {
  opacity: $dimmedOpacity;
  &:hover, &:focus { opacity: 1 }
}

@mixin screenreader-only {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  transform: translatez(0);
}

// Completely hide, but make available to screenreader so it can read it.
.screenreader-only {
  @include screenreader-only
}

// Completely hide, but make available to screenreader so it can read it.  Used for external tools
.screenreader-only-tool {
  @extend .screenreader-only;
  margin-top: 0px;
  position: relative;
  clip-path: inset(50%);
  -webkit-clip-path: inset(50%);
}

CANCEL

Name	Type	Size	Modified	Actions
↩ ..	DIR	—	—
📁 deprecated/	DIR	—	2023-09-24 03:36
📄 _aacs.scss	SCSS	968 B	2023-09-24 03:36	EDIT
📄 _admin_links.scss	SCSS	3.2 KB	2023-09-24 03:36	EDIT
📄 _alerts.scss	SCSS	8.1 KB	2023-09-24 03:36	EDIT
📄 _alignment.scss	SCSS	890 B	2023-09-24 03:36	EDIT
📄 _announcement-rss-tray.scss	SCSS	846 B	2023-09-24 03:36	EDIT
📄 _autocomplete.scss	SCSS	5.5 KB	2023-09-24 03:36	EDIT
📄 _avatars.scss	SCSS	1.1 KB	2023-09-24 03:36	EDIT
📄 _borders.scss	SCSS	2.7 KB	2023-09-24 03:36	EDIT
📄 _breadcrumbs.scss	SCSS	2.6 KB	2023-09-24 03:36	EDIT
📄 _broken-images.scss	SCSS	70 B	2023-09-24 03:36	EDIT
📄 _buttons.scss	SCSS	11.6 KB	2023-09-24 03:36	EDIT
📄 _canvas-icons.scss	SCSS	5.2 KB	2023-09-24 03:36	EDIT
📄 _carousel.scss	SCSS	863 B	2023-09-24 03:36	EDIT
📄 _centered-block.scss	SCSS	1.4 KB	2023-09-24 03:36	EDIT
📄 _components.scss	SCSS	3.4 KB	2023-09-24 03:36	EDIT
📄 _conditional_release.scss	SCSS	865 B	2023-09-24 03:36	EDIT
📄 _conditional_release_stats.scss	SCSS	6.7 KB	2023-09-24 03:36	EDIT
📄 _context_search.scss	SCSS	3.9 KB	2023-09-24 03:36	EDIT
📄 _element-toggler.scss	SCSS	807 B	2023-09-24 03:36	EDIT
📄 _emoji.scss	SCSS	1.4 KB	2023-09-24 03:36	EDIT
📄 _empty-state.scss	SCSS	1.7 KB	2023-09-24 03:36	EDIT
📄 _external_link.scss	SCSS	982 B	2023-09-24 03:36	EDIT
📄 _flickrSearch.scss	SCSS	1.6 KB	2023-09-24 03:36	EDIT
📄 _forms.scss	SCSS	3.6 KB	2023-09-24 03:36	EDIT
📄 _g_assignments.scss	SCSS	8.7 KB	2023-09-24 03:36	EDIT
📄 _g_collaborations.scss	SCSS	3.7 KB	2023-09-24 03:36	EDIT
📄 _g_conference.scss	SCSS	794 B	2023-09-24 03:36	EDIT
📄 _g_context_modules.scss	SCSS	11.8 KB	2023-09-24 03:36	EDIT
📄 _g_groups.scss	SCSS	5 KB	2023-09-24 03:36	EDIT
📄 _g_instructure.scss	SCSS	37.9 KB	2023-09-24 03:36	EDIT
📄 _g_media_comments.scss	SCSS	5.8 KB	2023-09-24 03:36	EDIT
📄 _g_mini_calendar.scss	SCSS	2.1 KB	2023-09-24 03:36	EDIT
📄 _g_rubrics.scss	SCSS	8.5 KB	2023-09-24 03:36	EDIT
📄 _g_wiki.scss	SCSS	14.7 KB	2023-09-24 03:36	EDIT
📄 _grade_detail_tray.scss	SCSS	743 B	2023-09-24 03:36	EDIT
📄 _gutters.scss	SCSS	1 KB	2023-09-24 03:36	EDIT
📄 _header_bar.scss	SCSS	1.9 KB	2023-09-24 03:36	EDIT
📄 _helpDialog.scss	SCSS	2.5 KB	2023-09-24 03:36	EDIT
📄 _ic-badge.scss	SCSS	1.4 KB	2023-09-24 03:36	EDIT
📄 _ic-code.scss	SCSS	1.4 KB	2023-09-24 03:36	EDIT
📄 _ic-color-picker.scss	SCSS	5.1 KB	2023-09-24 03:36	EDIT
📄 _ic-content-rows.scss	SCSS	4.6 KB	2023-09-24 03:36	EDIT
📄 _ic-expand-link.scss	SCSS	3.5 KB	2023-09-24 03:36	EDIT
📄 _ic-forms.scss	SCSS	25.3 KB	2023-09-24 03:36	EDIT
📄 _ic-icon-header.scss	SCSS	1 KB	2023-09-24 03:36	EDIT
📄 _ic-image-text-combo.scss	SCSS	1.1 KB	2023-09-24 03:36	EDIT
📄 _ic-range-input.scss	SCSS	4 KB	2023-09-24 03:36	EDIT
📄 _ic-reset.scss	SCSS	1.6 KB	2023-09-24 03:36	EDIT
📄 _ic-sortable-list.scss	SCSS	2.3 KB	2023-09-24 03:36	EDIT
📄 _ic-super-toggle.scss	SCSS	7.8 KB	2023-09-24 03:36	EDIT
📄 _ic-theme-card.scss	SCSS	6.4 KB	2023-09-24 03:36	EDIT
📄 _ic-typography.scss	SCSS	14.5 KB	2023-09-24 03:36	EDIT
📄 _ic-unread-badge.scss	SCSS	1.1 KB	2023-09-24 03:36	EDIT
📄 _inst_tree.scss	SCSS	4.2 KB	2023-09-24 03:36	EDIT
📄 _item-groups-condensed.scss	SCSS	3.4 KB	2023-09-24 03:36	EDIT
📄 _item-groups.scss	SCSS	5.3 KB	2023-09-24 03:36	EDIT
📄 _lock-state.scss	SCSS	1.1 KB	2023-09-24 03:36	EDIT
📄 _master-course-state.scss	SCSS	837 B	2023-09-24 03:36	EDIT
📄 _message_students.scss	SCSS	1 KB	2023-09-24 03:36	EDIT
📄 _MimeClassIcons.scss	SCSS	1.1 KB	2023-09-24 03:36	EDIT
📄 _misc.scss	SCSS	1.2 KB	2023-09-24 03:36	EDIT
📄 _new-and-total-badge.scss	SCSS	2.3 KB	2023-09-24 03:36	EDIT
📄 _pill.scss	SCSS	1.2 KB	2023-09-24 03:36	EDIT
📄 _post-to-sis-state.scss	SCSS	1.1 KB	2023-09-24 03:36	EDIT
📄 _ProgressBar.scss	SCSS	1.2 KB	2023-09-24 03:36	EDIT
📄 _publish-state.scss	SCSS	2.6 KB	2023-09-24 03:36	EDIT
📄 _react_modal.scss	SCSS	4.8 KB	2023-09-24 03:36	EDIT
📄 _rubric.scss	SCSS	3.8 KB	2023-09-24 03:36	EDIT
📄 _show_hide_opacity.scss	SCSS	2.2 KB	2023-09-24 03:36	EDIT
📄 _spacing.scss	SCSS	2.2 KB	2023-09-24 03:36	EDIT
📄 _spinner.scss	SCSS	1.6 KB	2023-09-24 03:36	EDIT
📄 _tables.scss	SCSS	5.9 KB	2023-09-24 03:36	EDIT
📄 _tabs.scss	SCSS	3 KB	2023-09-24 03:36	EDIT
📄 _token_input.scss	SCSS	4.8 KB	2023-09-24 03:36	EDIT
📄 _token_selector.scss	SCSS	2.2 KB	2023-09-24 03:36	EDIT
📄 _typography.scss	SCSS	3 KB	2023-09-24 03:36	EDIT
📄 _ui.selectmenu.scss	SCSS	3.2 KB	2023-09-24 03:36	EDIT
📄 _webcam_modal.scss	SCSS	874 B	2023-09-24 03:36	EDIT