diff --git a/src/styles/components/_components-config.scss b/src/styles/components/_components-config.scss index c55d10e930..0f7de57f5f 100644 --- a/src/styles/components/_components-config.scss +++ b/src/styles/components/_components-config.scss @@ -51,4 +51,3 @@ // Large Components @import "modals/modals-config"; @import "data-filter/data-filter-config"; -@import "video/video-config"; diff --git a/src/styles/components/video/_video-config.scss b/src/styles/components/video/_video-config.scss deleted file mode 100644 index 89f0d63430..0000000000 --- a/src/styles/components/video/_video-config.scss +++ /dev/null @@ -1,35 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -@import "video-header"; -@import "video-player"; -@import "video-view-controller"; -@import "video-controls"; -@import "video-toolbar"; -@import "video-function-buttons"; -@import "video-help-button"; -@import "video-editor"; -@import "video-event-area"; - -@import "popover/popover-config"; - - diff --git a/src/styles/components/video/_video-controls.scss b/src/styles/components/video/_video-controls.scss deleted file mode 100644 index 6b4781efb5..0000000000 --- a/src/styles/components/video/_video-controls.scss +++ /dev/null @@ -1,305 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -.video-controls { - @include clearfix(); - box-sizing: border-box; - background: linear-gradient(to bottom, #fff, #f7f7f7); - border: $thin-border-stroke $main-border-color; - height: 50px; - padding: 0 15px; - border-radius: 0 0 4px 4px; -} - -.video-details { - text-overflow: ellipsis; - overflow: hidden; -} - -.video-details-date { - font-style: italic; -} - -.video-details-presenters { - font-weight: bold; -} - -// Volume Controls -// ---------------------------------------- - -.volume-controls { - float: left; - width: 20%; - padding: 9px 0; - - .volume-toggle-unmuted { - @include fa-icon($fa-var-volume-up, after, inline-block, 0 10px 0 0, 0, $grey, 16px); - display: inline-block; - vertical-align: top; - margin-top: 8px; - } - - .volume-toggle-muted { - @include fa-icon($fa-var-volume-off , after, inline-block, 0 18px 0 0, 0, $grey, 16px); - display: inline-block; - vertical-align: top; - margin-top: 8px; - } - - .volume-slider { - display: inline-block; - vertical-align: top; - margin-top: 4px; - } - - .volume-slider-muted { - background: $grey; - } - - .volume-slider-unmuted { - background: $bright-blue; - } - - input { - appearance: none; - border-radius: 4px; - height: 2px; - } -} - - -// Playback Controls -// ---------------------------------------- - -.playback-controls { - float: left; - width: 60%; - height: 30px; - padding: 10px 0; - - .control { - display: inline-block; - float: left; - margin-left: 10px; - text-align: center; - - &:first-child { - margin-left: 0; - } - } -} - -.playback-controls-wrapper { - margin: 0 auto; - width: 280px; -} - -.playback-control-icon { - color: $grey; - font-size: 22px; - text-shadow: 0 1px 0 #fff; - cursor: pointer; -} - -$playback-icon-pseudo-position: after; -$playback-icon-display-value: inline-block; -$playback-icon-margin: 7px 20px; -$playback-icon-padding: 0; -$playback-icon-float: left; -$playback-icon-color: $grey; -$playback-icon-font-size: 16px; - -.playback-jump-to-start { - @include fa-icon($fa-var-fast-backward, $playback-icon-pseudo-position, $playback-icon-display-value, $playback-icon-margin, $playback-icon-padding, $playback-icon-color, $playback-icon-font-size); - @include fa-icon-float($playback-icon-pseudo-position, $playback-icon-float); - @extend .playback-control-icon; - &:hover { - color: darken($grey, 15%); - } -} - -.playback-previous-frame { - @include fa-icon($fa-var-step-backward, $playback-icon-pseudo-position, $playback-icon-display-value, $playback-icon-margin, $playback-icon-padding, $playback-icon-color, $playback-icon-font-size); - @include fa-icon-float($playback-icon-pseudo-position, $playback-icon-float); - @extend .playback-control-icon; - &:hover { - color: darken($grey, 15%); - } -} - -.playback-toggle-play { - @include fa-icon($fa-var-play,$playback-icon-pseudo-position, $playback-icon-display-value, $playback-icon-margin, $playback-icon-padding, $playback-icon-color, $playback-icon-font-size); - @include fa-icon-float($playback-icon-pseudo-position, $playback-icon-float); - @extend .playback-control-icon; - &:hover { - color: darken($grey, 15%); - } -} - -.playback-toggle-pause { - @include fa-icon($fa-var-pause,$playback-icon-pseudo-position, $playback-icon-display-value, $playback-icon-margin, $playback-icon-padding, $playback-icon-color, $playback-icon-font-size); - @include fa-icon-float($playback-icon-pseudo-position, $playback-icon-float); - @extend .playback-control-icon; - &:hover { - color: darken($grey, 15%); - } -} - -.playback-next-frame { - @include fa-icon($fa-var-step-forward, $playback-icon-pseudo-position, $playback-icon-display-value, $playback-icon-margin, $playback-icon-padding, $playback-icon-color, $playback-icon-font-size); - @include fa-icon-float($playback-icon-pseudo-position, $playback-icon-float); - @extend .playback-control-icon; - &:hover { - color: darken($grey, 15%); - } -} - -.playback-jump-to-end { - @include fa-icon($fa-var-fast-forward, $playback-icon-pseudo-position, $playback-icon-display-value, $playback-icon-margin, $playback-icon-padding, $playback-icon-color, $playback-icon-font-size); - @include fa-icon-float($playback-icon-pseudo-position, $playback-icon-float); - @extend .playback-control-icon; - &:hover { - color: darken($grey, 15%); - } -} - - - -// Timecode -// ---------------------------------------- - - -.timecode-controls { - @include clearfix(); - box-sizing: border-box; - float: right; - width: 20%; - - label { - display: block; - text-align: right; - margin-right: 4px; - margin-top: 2px; - font-size: 10px; - color: $grey; - font-weight: $weight-light; - text-transform: uppercase; - } - - .colon-sep { - font-size: 22px; - font-weight: 100; - color: $grey; - } - - .timecode-segments { - @include clearfix(); - float: right; - } - - .time-value { - float: left; - } - - input[type="number"] { - box-sizing: border-box; - appearance: none; - @include font-smoothing(on); - background: none; - border: 0; - height: 29px; - border-bottom: 1px dashed $main-border-color; - color: $grey; - font-size: 22px; - font-weight: $weight-regular; - text-align: right; - width: 30px; - - -moz-appearance: textfield; // Hides Spinner on FF - - &::-webkit-inner-spin-button, - &::-webkit-outer-spin-button { - -webkit-appearance: none; // Hides Spinner on Chrome and Safari - margin: 0; - } - } - - input#timecode-frame { - width: 40px; - } -} - -// Video Editor Actions - -.video-editor-actions-toolbar { - @include clearfix(); - - .video-nav-controls { - float: left; - } - - .video-save-panel { - float: right; - text-align: right; - } - - .save-button { - @include btn(brightblue); - margin-right: 10px; - } - - .save-and-close-button { - @include btn(green); - } - - .return-button { - @include btn(white); - } - - .save-button, - .save-and-close-button, - .return-button { - font-size: 12px; - font-weight: $weight-semibold; - display: inline-block; - padding: 12px 15px; - min-width: 80px; - text-align: center; - height: 39px; - } -} - -.video-meta-information { - margin: 10px 0; - color: $medium-prim-color; - font-size: 10px; - font-weight: $weight-semibold; - - .save-info { - - } - - .author-edit-info { - margin-top: 2px; - color: $light-prim-color; - } -} diff --git a/src/styles/components/video/_video-editor.scss b/src/styles/components/video/_video-editor.scss deleted file mode 100644 index 7722e4cbba..0000000000 --- a/src/styles/components/video/_video-editor.scss +++ /dev/null @@ -1,910 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -// Timeline styles -// ---------------------------------------- - -// Layout -$right-margin: 1.5%; -$track-options-width: 10%; - -// Output -$track-label-width: (100% - $right-margin) - $track-options-width; - -// Colour -$segment-normal: #71b1f3; -$segment-selected: saturate(darken($segment-normal, 25%), 5%); -$segment-deleted: #f35952; -$segment-deleted-selected: saturate(darken($segment-deleted, 25%), 5%); - -.video-timeline { - background: #fff; - border: $thin-border-stroke $main-border-color; - margin-top: 12px; - border-radius: 4px; - - &>div { - margin-top: 5px; - background: #fff; - padding: 5px 10px; - border-radius: 4px; - } - - .tracks-wrapper { - margin-top: 10px; - padding-top: 10px; - } - - label { - color: $medium-prim-color; - font-size: 10px; - font-weight: $weight-semibold; - line-height: 12px; - display: inline-block; - text-transform: capitalize; - } - - .track-container { - position: relative; - - .timeline-track { - margin-top: -1px; - padding: 0; - overflow: hidden; - - &>div:last-child { - border: $thin-border-stroke $primary-color-blue; - border-top-width: 0; - border-bottom-width: 0; - overflow: hidden; - - &.left-normal { - border-left-color: $segment-normal; - } - - &.right-normal { - border-right-color: $segment-normal; - } - - &.left-selected { - border-left-color: $segment-selected; - } - - &.right-selected { - border-right-color: $segment-selected; - } - - &.left-deleted { - border-left-color: $segment-deleted; - } - - &.right-deleted { - border-right-color: $segment-deleted; - } - - &.left-deleted-selected { - border-left-color: $segment-deleted-selected; - } - - &.right-deleted-selected { - border-right-color: $segment-deleted-selected; - } - } - - .track-toolbar { - position: absolute; - @include clearfix(); - - label { - padding-top: 6px; - padding-left: 6px; - } - - .track-label, - .track-options { - float: left; - } - - .track-label { - width: $track-label-width; - margin-right: $right-margin; - font-size: 10px; - line-height: 12px; - font-weight: $weight-semibold; - color: $medium-prim-color; - z-index: $z-0; - } - - .track-options { - width: $track-options-width; - } - - .track-options-button { - @include btn(white); - padding: 1px 4px; - float: right; - @include fa-icon($fa-var-cog, before, inline-block, 0, 0, $medium-prim-color, 10px, normal, 0); - &:before { - vertical-align: middle; - } - } - } - - .preview-toggle-control { - display: inline; - float: right; - } - - .preview-toggle-control > * { - vertical-align: middle; - } - - $segment-height: 24px; - $segment-background: $segment-height; - $segment-main-height: 60px; - $segment-main-background: ($segment-main-height - $thin-border * 2); - - $segment-sliver-active-colors: lighten($segment-normal, 13%) lighten($segment-normal, 5%); - $segment-sliver-deleted-colors: lighten($segment-deleted, 13%) lighten($segment-deleted, 5%); - $num-colors: length($segment-sliver-active-colors); - $segment-sliver-vert-length: 8; - - $sliver-active-stops: (); - $sliver-deleted-stops: (); - - @for $j from 0 through floor($segment-sliver-vert-length/$num-colors) { - @for $i from 1 through $num-colors { - $active-color: nth($segment-sliver-active-colors, $i); - $deleted-color: nth($segment-sliver-deleted-colors, $i); - $new-active-stops: $active-color percentage(($i - 1) / $segment-sliver-vert-length + $j * $num-colors / $segment-sliver-vert-length), - $active-color percentage($i / $segment-sliver-vert-length + $j * $num-colors / $segment-sliver-vert-length); - $new-deleted-stops: $deleted-color percentage(($i - 1) / $segment-sliver-vert-length + $j * $num-colors / $segment-sliver-vert-length), - $deleted-color percentage($i / $segment-sliver-vert-length + $j * $num-colors / $segment-sliver-vert-length); - $sliver-active-stops: join($sliver-active-stops, $new-active-stops, comma); - $sliver-deleted-stops: join($sliver-deleted-stops, $new-deleted-stops, comma); - } - } - - .segments { - // background image set inline - overflow: hidden; - background-repeat: no-repeat; - background-size: 100% $segment-background; - background-position: bottom left; - height: $segment-height; - - // needed for zoom offset - position: relative; - - // don't smooth the waveform - -ms-interpolation-mode: nearest-neighbor; - image-rendering: -webkit-optimize-contrast; - image-rendering: -moz-crisp-edges; - image-rendering: pixelated; - - .segment-container { - float: left; - height: $segment-height; - - .segment-seperator { - background-color: transparent; - height: $segment-height; - width: 9px; - float: left; - position: relative; - left: -4px; - z-index: $z-100; - cursor: ew-resize; - opacity: 0.5; - - } - - &:first-child .segment-seperator { - display: none; - } - - .segment-seperator.active:before { - background: $color-black none repeat scroll 0 0; - content: ""; - display: block; - height: $segment-height; - margin-left: 4px; - width: 1px; - } - - .segment { - height: $segment-height; - color: #666666; - padding-right: 5px; - text-align: right; - background: rgba($segment-normal, 0.5); - border: $thin-border-stroke $segment-normal; - border-right-width: 0 !important; - transition-property: background-color, background, border; - transition-duration: 250ms; - transition-timing-function: ease; - - a { - display:none; - } - - &.selected { - background: rgba($segment-selected, 0.5); - border: $thin-border-stroke darken($segment-selected, 10%); - - a { - &:before { - color: darken($l-blue, 2%); - } - } - - &.deleted { - background-color: rgba($segment-deleted-selected, 0.5); - border: $thin-border-stroke $segment-deleted-selected; - - a { - &:before { - color: rgba(0,0,0,0.4) - } - } - } - } - - &.deleted { - background-color: rgba($segment-deleted, 0.5); - border: $thin-border-stroke $segment-deleted; - - a { - &:before { - color: rgba(0,0,0,0.4) - } - } - } - } - - &:first-child .segment { - border-left: none; - - &.selected { - border-left: none; - - &.deleted { - border-left: none; - } - } - - &.deleted { - border-left: none; - } - } - - &:not(.displayWaveform) { - &+ .segment-container .segment-seperator { - background-image: none !important; - } - } - - &.displayWaveform { - - position: relative; - - & .segment.sliver:before { - content: ''; - height: 100%; - width: 9px; - position: absolute; - top: 0; - left: 0; - background: #b7d8f9; - background: linear-gradient(0deg, $sliver-active-stops); - border: 1px solid #71b1f3; - } - - & .segment.sliver.deleted:before { - background: #ec8b86; - background: linear-gradient(0deg, $sliver-deleted-stops); - - border-color: #f35952; - } - - &+ .segment-container { - border-left: none !important; - - } - - } - - } - } - - &:first-child { - margin: 0; - - .track-toolbar { - position: inherit; - margin: 0 0 5px 0; - - label { - padding: 0px; - } - } - - .segments { - background-size: 100% $segment-main-background; - height: $segment-main-height; - background-position: center left; - - .segment-container { - height: $segment-main-height; - - .segment-seperator { - height: $segment-main-height; - } - - .segment-seperator.active:before { - height: $segment-main-height; - } - - .segment { - height: $segment-main-height; - - a { - display: inline-block; - float: right; - color: $l-blue; - background-color: inherit; - padding: 0.3em; - - &:before { - width: 1em; - text-align: center; - } - - &:hover, &:active { - &:before { - color: $black !important; // force this for mouseover - } - } - - &.unused { - @include fa-icon($fa-var-eye-slash , before, inline-block, 0 0 0 0, 0, $l-blue, 1em); - } - - &.used { - @include fa-icon($fa-var-eye, before, inline-block, 0 0 0 0, 0, $l-blue, 1em); - } - - &.remove { - @include fa-icon($fa-var-times, before, inline-block, 0 0 0 0, 0, $l-blue, 1em); - } - } - - a:last-child { - margin: 0px; - } - - &.small { - a { - display: none; - } - a:last-child { - display: inline-block; - } - } - - &.tiny { - a { - display: none; - } - } - - &.selected { - a { - &:before { - color: darken($l-blue, 10%); - } - } - } - - &.deleted { - a { - &:before { - color: rgba(0,0,0,0.4) - } - } - } - } - } - } - } - } - - #cursor-track { - padding: 5px 0px; - margin-top: 5px; - margin-bottom: 8px; - background: #eee none repeat scroll 0 0; - cursor: pointer; - border-radius: 4px; - } - - #hover-cursor { - width: 1px; - background-color: #777; - height: 60px; - position: absolute; - z-index: $z-80; - } - - #cursor, #cursor_fake { - width: 1px; - height: calc(100% - 23px); - background-color: #fb6257; - position: absolute; - top: 20px; - z-index: $z-80; - - $handle-size: 14px; - .handle { - bottom: ($handle-size/-2) + 1; - left: ($handle-size/-2); - width: $handle-size; - height: $handle-size; - border-radius: $handle-size; - background-color: #c13832; - position: absolute; - cursor: grab; - } - - .arrow_box { - background: $off-white none repeat scroll 0 0; - border: $thin-border-stroke $light-border-color; - border-radius: $main-border-radius; - bottom: -40px; - left: -13px; - position: absolute; - - display: none; - transition: all 800ms; - } - - .arrow_box:after, .arrow_box:before { - bottom: 100%; - left: 50%; - border: solid transparent; - content: " "; - height: 0; - width: 0; - position: absolute; - pointer-events: none; - } - - .arrow_box:after { - border-color: rgba(238, 238, 238, 0); - border-bottom-color: #eee; - border-width: 4px; - margin-left: -4px; - } - .arrow_box:before { - border-color: rgba(204, 204, 204, 0); - border-bottom-color: #ccc; - border-width: 5px; - margin-left: -5px; - } - - a.split { - width: 20px; - height: 20px; - display: block; - margin: 2px; - color: rgba(193,56,50,0.7); - - &:hover, - &:active { - color: rgba(193,56,50,1); - } - - @include fa-icon($fa-var-scissors, before, block, 0, 2px 4px, inherit, 12px); - } - - &.active { - .handle { - cursor: grabbing; - } - } - } - - #cursor_fake { - opacity: 0.6; - display: none; - z-index: ($z-80 + 1); - } - } - - .timeline-control { - - .zoom-title { - margin-top: 10px; - - &>label { - - font-size: 11px; - line-height: 13px; - padding-top: 1px; - margin-bottom: 5px; - width: 30%; - } - .zoom-control { - float: right; - margin-top: -4px; - margin-bottom: 4px; - - &>label { - float: left; - line-height: 22px; - } - - &>label:after { - content: ":"; - } - - input[type=range] { - width: 400px; - height: 22px; - margin: 0 5px; - } - - .chosen-container { - top: -10px; - height: 22px; - } - } - } - - .field-of-vision { - border: 1px solid $main-border-color; - overflow: hidden; - position: relative; - width: 100%; - z-index: 100; - - #timeline-cursor { - width: 1px; - background-color: #777; - height: 30px; - position: absolute; - z-index: $z-80; - } - - &::before { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: .18; - z-index: -1; - background-size: 100% 24px; - background-position: center left; - background-repeat: no-repeat; - } - - .field { - background: rgba(106, 183, 236, 0.5) none repeat scroll 0% 0%; - height: 24px; - position: relative; - cursor: grab; - - &.active { - cursor: grabbing; - } - } - - .boundary { - color: #2F88D2; - position: absolute; - top: 0px; - line-height: 24px; - padding: 0px 5px; - - &.from { - left: 0px; - } - - &.to { - right: 0px; - } - } - - .small { - .boundary { - - &.from { - right: 100%; - left: auto; - } - - &.to { - left: 100%; - right: auto; - } - } - } - } - - .footer { - &>span { - font-size: 11px; - color: #aaa; - padding: 2px 0px; - float: left; - } - &>span:last-child { - float: right; - } - } - - .boundaries { - background: rgba(106, 183, 236, 0.5); - position: absolute; - top: 0px; - line-height: 20px; - - } - } -} - -// Segment list styles -// ---------------------------------------- - -.editor-segments { - padding: 4px 12px 4px 12px; - width: 25%; - min-width: 400px; - - $segment-list-element-height: 35px; - - .segment-list { - - .segment-list-entry { - margin: 8px auto; - margin-left: 0; - width: 98%; - height: $segment-list-element-height; - color: $dark-prim-color; - padding-right: 5px; - padding-left: 5px; - text-align: right; - //background: $off-white; - background: rgba($segment-normal, 0.5); - border: $thin-border-stroke $segment-normal; - transition-property: background-color, background, border; - transition-duration: 250ms; - transition-timing-function: ease; - - a { - display: inline-block; - color: lighten($black, 10%); - padding: 9px; - - &:before { - width: 1em; - text-align: center; - } - - &:hover, &:active { - &:before { - color: $black !important; // force this for mouseover - } - } - - &.unused { - @include fa-icon($fa-var-eye-slash , before, inline-block, 0 0 0 0, 0, lighten($black, 10%), 1em); - } - - &.used { - @include fa-icon($fa-var-eye, before, inline-block, 0 0 0 0, 0, lighten($black, 10%), 1em); - } - - &.remove { - @include fa-icon($fa-var-times, before, inline-block, 0 0 0 0, 0, lighten($black, 10%), 1em); - } - } - - - &.selected { - background: rgba($segment-selected, 0.5); - border: $thin-border-stroke darken($segment-selected, 10%); - - &.deleted { - background-color: rgba($segment-deleted-selected, 0.5); - border: $thin-border-stroke $segment-deleted-selected; - } - } - - &.deleted { - background-color: rgba($segment-deleted, 0.5); - border: $thin-border-stroke $segment-deleted; - } - - .segment-start-end { - float: left; - padding: 6px; - } - - .segment-start { - } - - .segment-end { - } - - .segment-remove { - float: left; - } - - - input[type="text"] { - height: auto; - width: 90px; - padding: 0 5px; - - &:disabled { - color: $light-prim-color; - background-color: darken(#FFFFFF, 5%); - } - } - } - - } -} - -.segments-area { - border-radius: 4px; - border: $thin-border-stroke $main-border-color; -} - -// Thumbnail styles -// ---------------------------------------- -.editor-thumbnail { - - .content-wrapper { - display: flex; - } - - form { - display: inline; - margin-left: 6px; - } - - .controls { - position: relative; - padding-right: 20px; - margin: 20px 0 20px 0; - color: $medium-prim-color; - font-size: 12px; - - .description { - line-height: 20px; - margin-bottom: 20px; - } - } - - .thumbnail-canvas { - margin: 20px; - width: 320px; - height: 180px; - min-width: 320px; - background-size: contain; - background-repeat: no-repeat; - background-position: center center; - background-origin: border-box; - border: $thin-border-stroke $main-border-color; - text-align: center; - } - - .thumbnail-canvas>div { - background-color: rgba( $black, .4 ); - width: 320px; - height: 180px; - display: table-cell; - vertical-align: middle; - color: $off-white; - } - - .spinner, .error { - font-size: 3em; - } - - .hidden { - display: none; - } -} - -.editor-tracks { - - .audio-canvas, .video-canvas { - background-size: contain; - background-repeat: no-repeat; - background-position: center center; - background-origin: border-box; - text-align: center; - border: $thin-border-stroke $main-border-color; - - cursor: pointer; - - } - - .audio-canvas { - background-color: rgba(28, 131, 236, 0.5); - border: 1px solid #1169c5; - width: 690px; - height: 60px; - } - - .video-canvas { - position: relative; - width: 160px; - height: 90px; - } - - .track-name { - text-transform: capitalize; - } - - .track, .track-hidden { - position: relative; - width: 100%; - height: 100%; - display: flex; - align-items: center; - justify-content: center; - } - - .track-hidden { - background-color: rgba( $red, .4 ); - } - - .audio-track-hidden-icon, .video-track-hidden-icon { - position: absolute; - height: 100%; - text-align: center ; - } - - .video-track-hidden-icon { - line-height: 120px; - @include fa-icon($fa-var-eye-slash, before, inline-block, 0 0 0 0, 0, lighten($black, 90%), 60px); - } - - .audio-track-hidden-icon { - line-height: 80px; - @include fa-icon($fa-var-microphone-slash, before, inline-block, 0 0 0 0, 0, lighten($black, 90%), 60px); - } - - .track-hidden:hover { - background-color: rgba( $red, .6 ); - } - - .track:hover { - background-color: rgba( $black, .2 ); - } -} diff --git a/src/styles/components/video/_video-event-area.scss b/src/styles/components/video/_video-event-area.scss deleted file mode 100644 index f5ea128ca4..0000000000 --- a/src/styles/components/video/_video-event-area.scss +++ /dev/null @@ -1,394 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -.area-body { - // Center box - background: $body-background; - border-top: 0px; - padding: 10px; - border-radius: 4px; - - // Modal Columns - .col { - width: 48.78%; - display: inline-block; - vertical-align: top; - - &:not(:first-child) { - margin-left: 1%; - } - - &:not(:last-child) { - margin-right: 1%; - } - - // Remove bottom margin on last object - &:last-child { - margin-bottom: 0; - } - } - - // Full col - - .full-col { - width: 100%; - - .obj { - width: $modal-full-col-width; - - > header { - width: ($modal-full-col-width); - } - } - - .tbl-container { - width: $modal-full-col-width; - - .obj-container .table-series .wrapper { - - padding: 1% 2%; - - &:first-child { - padding-top: 2%; - } - - &:last-child { - padding-bottom: 2%; - } - - header { - border: $thin-border-stroke $main-border-color; - } - - .main-tbl { - border: $thin-border-stroke $main-border-color; - border-top: none; - border-top-left-radius: 0; - border-top-right-radius: 0; - } - } - } - } - - // Object within columns - .obj { - box-sizing: border-box; - background: #fff; - border-radius: $main-border-radius; - border: $thin-border-stroke $main-border-color; - color: $medium-prim-color; - - &:not(:last-child) { - margin-bottom: 20px; - } - - table { - border: none; - padding-left: 0; - - &.main-tbl.top-tbl { - border-bottom: 1px solid $main-border-color; - border-radius: 0; - } - - td { - line-height: 25px !important; - padding: 4px 15px; - - > a { - float: none; - margin: 0; - } - - a.external-link { - @include fa-icon($fa-var-external-link-square, before, inline-block, 4px, 0, inherit, 14px); - float: right; - - &:hover { - @include fa-icon-color(before, $l-blue); - } - } - - .circle { - margin-top: 7px; - } - } - } - - .fa-calendar-o { - margin-left: 5px; - } - - // Main container - .obj-container { - height: auto; - opacity: 1; - - > p, - pre { - font-size: 11px; - color: $medium-prim-color; - line-height: 18px; - margin-bottom: 15px; - - &:last-child { - margin-bottom: 8px; - } - } - - .desc { - margin: 0 auto; - padding: 20px 15px; - - &.no-border { - border-bottom: none; - } - } - - h3.section-heading { - color: $dark-prim-color; - padding: 10px 20px 5px; - border-bottom: 1px solid $main-border-color; - } - - h4 { - color: $dark-prim-color; - font-size: 14px; - margin-bottom: 8px; - - &:not(:first-child) { - margin-top: 15px; - } - } - - > ul { - - span { - font-weight: 600; - font-size: 13px; - } - - > li { - line-height: 23px; - border-bottom: 1px solid lighten($main-border-color, 10%); - padding: 10px 0; - - &:first-child { - padding-top: 0; - } - - &:last-child { - border-bottom: none; - margin-bottom: 0; - padding-bottom: 0; - } - } - - } - - &.padded { - padding: 20px; - } - } - } - - // Modal obj header - header { - $height: 35px; - @include accordion-header($height); - user-select: none; - position: static; - - &.expand { - @include accordion-header($height, true); - } - - // This is used when there is data displayed in header - span.header-value { - float: right; - } - } - - .obj { - &.comments { - - .comment-container { - height: auto; - overflow-y: auto; - - .comment-view { - float: left; - width: 60%; - padding: 10px; - min-height: 340px; - border-right: 1px solid $main-border-color; - } - - .comment-creation { - float: right; - width: 40%; - padding: 10px; - } - - .comment { - margin-bottom: 20px; - - &:first-child h4 { - margin-top: 0; - } - - .is-reply { - - > h4 { - padding-left: 30px; - } - - .category { - padding-left: 30px; - } - - > p { - padding-left: 30px; - } - } - - // Hide first HR - &:first-child > hr { - display: none; - } - - > hr { - background: lighten($main-border-color, 10%); - height: 1px; - border: none; - margin: 30px 0 20px; - } - - > h4 { - font-weight: 600; - } - - .category { - font-size: 10px; - color: $medium-prim-color; - - > strong { - color: $medium-prim-color; - } - } - - .date { - float: right; - font-size: 10px; - color: $light-prim-color; - @include fa-icon($fa-var-clock-o, before, inline-block, 0 5px 0 0, 0, inherit, 10px); - } - - > p { - margin: 7px 15px 0 0; - font-size: 11px; - line-height: 15px; - - > span { - color: $l-blue; - } - } - - .reply, - .delete, - .resolve { - float: right; - font-size: 11px; - font-weight: 600; - cursor: pointer; - color: $l-blue; - display: inline-block; - } - - .delete { - color: $red; - margin-left: 10px; - - } - - .resolve { - color: $light-prim-color; - margin-right: 10px; - - &.resolved { - color: $green; - } - } - } - } - - .add-comment { - - .drop-down-container { - width: 100%; - } - - textarea { - width: 100%; - height: 80px; - resize: none; - margin-bottom: 20px; - } - - .btn { - @include btn(green); - padding: 10px 15px; - float: right; - } - - .save { - float: right; - margin-left: 10px; - } - - .resolved { - display: inline-block; - } - - .resolve-select { - vertical-align: middle; - } - - .reasons { - float: left; - } - - .drop-down-container { - width: 250px; - display: inline-block; - z-index: 100; - } - - .chosen-container .chosen-results{ - max-height: 160px !important; - } - - } - } - } -} - diff --git a/src/styles/components/video/_video-function-buttons.scss b/src/styles/components/video/_video-function-buttons.scss deleted file mode 100644 index a7621548a7..0000000000 --- a/src/styles/components/video/_video-function-buttons.scss +++ /dev/null @@ -1,70 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - -.function-buttons a:first-child { - margin-left: 0; -} -.function-buttons a { - @include btn(white); - font-size: 12px; - font-weight: $weight-semibold; - padding: 10px; - display: inline-block; - margin-left: 6px; - - // Function Icons - $pseudo-position: before; - $display-value: inline; - $margin: 0 4px 0 0; - $padding: 0; - $color: inherit; - $font-size: 12px; - $font-weight: normal; - $line-height: 1; - - &.cut { - @include fa-icon($fa-var-eye-slash, $pseudo-position, $display-value, $margin, $padding, $color, $font-size); - } - - &.split { - @include fa-icon($fa-var-scissors, $pseudo-position, $display-value, $margin, $padding, $color, $font-size); - } - &.undo { - @include fa-icon($fa-var-rotate-left, $pseudo-position, $display-value, $margin, $padding, $color, $font-size); - } - - &.redo { - @include fa-icon($fa-var-rotate-right, $pseudo-position, $display-value, $margin, $padding, $color, $font-size); - } - - &.clear-segments { - @include fa-icon($fa-var-times, $pseudo-position, $display-value, $margin, $padding, $color, $font-size); - } - - &.extract-thumbnail { - @include fa-icon($fa-var-camera, $pseudo-position, $display-value, $margin, $padding, $color, $font-size); - } - - &.upload-thumbnail { - @include fa-icon($fa-var-upload, $pseudo-position, $display-value, $margin, $padding, $color, $font-size); - } - -} diff --git a/src/styles/components/video/_video-header.scss b/src/styles/components/video/_video-header.scss deleted file mode 100644 index 02b6126e43..0000000000 --- a/src/styles/components/video/_video-header.scss +++ /dev/null @@ -1,50 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -.main-video-details { - @extend .page-title; -} - -// Video Header Layout -.video-header { - @include clearfix(); - margin-bottom: 12px; - - .main-video-details { - float: left; - } - - .video-more-options { - float: right; - } -} - -.video-more-options { - - a:last-child { - margin-left: 5px; - } - - $button-padding: 8px 18px; - $font-size: 14px; - -} diff --git a/src/styles/components/video/_video-help-button.scss b/src/styles/components/video/_video-help-button.scss deleted file mode 100644 index 1526f2c4ec..0000000000 --- a/src/styles/components/video/_video-help-button.scss +++ /dev/null @@ -1,38 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -.video-toolbar .help-button { - @include btn(white); - display: inline-block; - text-align: center; - - &:before { - content: "?"; - font-size: 12px; - line-height: 12px; - margin: 0; - padding: 0; - font-weight: $weight-semibold; - text-align: center; - color: $grey; - } -} diff --git a/src/styles/components/video/_video-player.scss b/src/styles/components/video/_video-player.scss deleted file mode 100644 index 6e44c61927..0000000000 --- a/src/styles/components/video/_video-player.scss +++ /dev/null @@ -1,46 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -.video-player { - @include clearfix(); - width: 100%; - margin: 0 auto; - background: #1e1e1e; - text-align: center; - border-radius: 4px 4px 0 0; - - video { - max-height: 350px; - max-width: 100%; - height: auto; - } - - .feed-1, .feed-2 { - box-sizing: border-box; - width: 49.95%; - float: left; - } - - .feed-2 { - margin-left: 0.1%; - } -} diff --git a/src/styles/components/video/_video-toolbar.scss b/src/styles/components/video/_video-toolbar.scss deleted file mode 100644 index 1e0419ee6b..0000000000 --- a/src/styles/components/video/_video-toolbar.scss +++ /dev/null @@ -1,47 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -.video-toolbar { - @include clearfix(); - padding: 12px; - width: 100%; - background: #fff; - border-radius: 4px 4px 0 0; - border-bottom: $thin-border-stroke $main-border-color; - - .start-column { - float: left; - } - - .end-column { - float: right; - } - - .destructive-functions { - float: left; - } - - .keyboard-shortcuts { - float: left; - margin-left: 4px; - } -} diff --git a/src/styles/components/video/_video-view-controller.scss b/src/styles/components/video/_video-view-controller.scss deleted file mode 100644 index 95d95e1941..0000000000 --- a/src/styles/components/video/_video-view-controller.scss +++ /dev/null @@ -1,61 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -.view-controller { - text-align: center; - padding: 12px 20px; - background: $primary-color-blue; - border: $thin-border-stroke $primary-color-blue; - border-radius: 4px 4px 0 0; - - a { - font-size: 12px; - font-weight: $weight-semibold; - color: $header-link-color; - - &:not(:first-child) { - margin-left: 36px; - } - - &:hover { - color: lighten($header-link-color, 10%); - } - - &.active { - color: $primary-color-white; - - &:hover { - color: darken($primary-color-white, 5%); - } - } - } -} - -.view-controller-secondary { - border-radius: 4px 4px 0 0; -} - -.event-container { - margin: 12px 0; - border: $thin-border-stroke $main-border-color; - border-radius: 4px; -} diff --git a/src/styles/components/video/popover/_animation.scss b/src/styles/components/video/popover/_animation.scss deleted file mode 100644 index 5e33ea2c6b..0000000000 --- a/src/styles/components/video/popover/_animation.scss +++ /dev/null @@ -1,57 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -// Popover Animation -// ---------------------------------------- - -.shortcuts-popover { - - // Show and Hide Functionality - visibility: hidden; - opacity: 0; - - $popover-transition-timing-function: ease-in-out; - $popover-transition-delay: 0ms; - $popover-transition-duration: 250ms; - $popover-visibility-transition-delay: $popover-transition-delay + 200ms; - - // Variables Defined on Variable Parial - - -webkit-transition: - visibility $popover-transition-duration $popover-transition-timing-function $popover-visibility-transition-delay, - opacity $popover-transition-duration $popover-transition-timing-function $popover-transition-delay - ; - - transition: - visibility $popover-transition-duration $popover-transition-timing-function $popover-visibility-transition-delay, - opacity $popover-transition-duration $popover-transition-timing-function $popover-transition-delay - ; -} - -.keyboard-shortcuts.active { - - .shortcuts-popover { - visibility: visible; - opacity: 1; - transition-delay: 0ms; - } -} diff --git a/src/styles/components/video/popover/_base.scss b/src/styles/components/video/popover/_base.scss deleted file mode 100644 index ed38817c67..0000000000 --- a/src/styles/components/video/popover/_base.scss +++ /dev/null @@ -1,125 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -.keyboard-shortcuts { - position: relative; -} - -.shortcuts-popover { - - // Floating Position - position: absolute; - top: -2px; - right: 30px; - z-index: $z-90; - - // Dimensions - width: 250px; - - .popover-container { - // Styling - box-shadow: 0 1px 3px rgba(0,0,0,0.1), 0 5px 10px rgba(0,0,0,0.05); - border-radius: $main-border-radius; - } -} - -.keyboard-shortcuts .shortcuts-popover::after { - content: ""; - display: block; - margin: 0; - transition: margin 350ms ease-in-out; -} - -.keyboard-shortcuts.active .shortcuts-popover::after { - margin-bottom: 100px; -} - -// Triangle Point - -$point-top-margin: 9px; -$point-width: 10px; -$point-height: 7px; -$parent-border-stroke: 1px; - - -.right-triangle-point-common { - content: ""; - position: absolute; - top: $point-top-margin; - width: 0; - height: 0; - border-style: solid; - border-width: $point-height 0 $point-height $point-width; -} - -.popover-header { - @extend .popover-container; - - background: linear-gradient(to bottom, #fff, #f7f7f7); - border: $thin-border-stroke $main-border-color; - @include border-top-radius($main-border-radius); - box-shadow: inset 0 1px 0px 0px #fff, 0 0 2px rgba(0,0,0,.05); - color: $grey; - text-shadow: 0 1px 0 #fff; - text-align: center; - padding: 8px; - - - p { - font-size: 12px; - font-weight: $weight-semibold; - } -} - - -.popover-table-column { - float: left; -} - -.popover-body { - @extend .popover-container; - border: $thin-border-stroke $main-border-color; - @include border-bottom-radius($main-border-radius); - border-top: 0; - background: #fff; - - color: $light-prim-color; - font-weight: $weight-semibold; - font-size: 11px; - - .row { - @include clearfix(); - } - - .shortcut-description { - @extend .popover-table-column; - $gutter: 2.5%; - width: 72% - $gutter; - margin-right: $gutter; - } - - .shortcut-input { - @extend .popover-table-column; - width: 28%; - text-align: right; - } -} diff --git a/src/styles/components/video/popover/_point.scss b/src/styles/components/video/popover/_point.scss deleted file mode 100644 index 3b9bef1b0b..0000000000 --- a/src/styles/components/video/popover/_point.scss +++ /dev/null @@ -1,57 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -// Triangle Point - -$point-top-margin: 9px; -$point-width: 10px; -$point-height: 7px; -$parent-border-stroke: 1px; - - -.right-triangle-point-common { - content: ""; - position: absolute; - top: $point-top-margin; - width: 0; - height: 0; - border-style: solid; - border-width: $point-height 0 $point-height $point-width; -} - -.popover-header { - - &::after { - $point-background-color: $main-border-color; // this is creating a faux border by using a background color - @extend .right-triangle-point-common; - right: $point-width - (($point-width*2) - $parent-border-stroke); - border-color: transparent transparent transparent $point-background-color; - } - - &::before { - $point-background-color: #fbfbfb; // mid point color from vertical gradient - @extend .right-triangle-point-common; - z-index: $z-100; - right: $point-width - (($point-width*2) - ($parent-border-stroke+2)); - border-color: transparent transparent transparent $point-background-color; - } -} \ No newline at end of file diff --git a/src/styles/components/video/popover/_popover-config.scss b/src/styles/components/video/popover/_popover-config.scss deleted file mode 100644 index 44b2a9d2cc..0000000000 --- a/src/styles/components/video/popover/_popover-config.scss +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -// Help Popover Config - -@import "_base"; -@import "_point"; -@import "_animation"; -@import "_table"; diff --git a/src/styles/components/video/popover/_table.scss b/src/styles/components/video/popover/_table.scss deleted file mode 100644 index 263db00a15..0000000000 --- a/src/styles/components/video/popover/_table.scss +++ /dev/null @@ -1,31 +0,0 @@ -/** - * Licensed to The Apereo Foundation under one or more contributor license - * agreements. See the NOTICE file distributed with this work for additional - * information regarding copyright ownership. - * - * - * The Apereo Foundation licenses this file to you under the Educational - * Community License, Version 2.0 (the "License"); you may not use this file - * except in compliance with the License. You may obtain a copy of the License - * at: - * - * http://opensource.org/licenses/ecl2.txt - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations under - * the License. - * - */ - - -.shortcuts-table { - - .row { - &:not(:last-child) { - border-bottom: 1px solid $main-border-color; - } - padding: 8px; - } -} diff --git a/src/styles/main.scss b/src/styles/main.scss index 22c243e290..987299f9bd 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -571,22 +571,3 @@ tr.error { tr.info { background: $state-info-bg !important; } - -/* -* ---------------------------------------------------------------- -* THE FOLLOWING SECTION NEEDS TO BE DELEGATED TO THE DESIGNERS!!! -* ---------------------------------------------------------------- -*/ -.playback-toggle-pause { - @include fa-icon($fa-var-pause,$playback-icon-pseudo-position, $playback-icon-display-value, $playback-icon-margin, $playback-icon-padding, $playback-icon-color, $playback-icon-font-size); - @include fa-icon-float($playback-icon-pseudo-position, $playback-icon-float); - @extend .playback-control-icon; - &:hover { - color: darken($grey, 15%); - } -} -// Allow for slightly wider icons -.playback-controls-wrapper { - width: 280px; -} -