Commit 22827c6a by Kyle Fiedler

Fixed issues with full screen

parent 55e1c2e9
...@@ -2863,6 +2863,13 @@ section.course-index div#accordion ul.ui-accordion-content li a p { ...@@ -2863,6 +2863,13 @@ section.course-index div#accordion ul.ui-accordion-content li a p {
section.course-index div#accordion ul.ui-accordion-content li a p.subtitle { section.course-index div#accordion ul.ui-accordion-content li a p.subtitle {
color: #666; } color: #666; }
section.course-content div.video {
padding: 6px 22.652px;
margin: 0 -22.652px;
border-top: 1px solid #e1e1e1;
border-bottom: 1px solid #e1e1e1;
background: #f3f3f3;
display: block; }
section.course-content div.video-subtitles { section.course-content div.video-subtitles {
display: table; display: table;
zoom: 1; } zoom: 1; }
...@@ -3168,6 +3175,41 @@ section.course-content div.video-subtitles div.video-wrapper section.video-contr ...@@ -3168,6 +3175,41 @@ section.course-content div.video-subtitles div.video-wrapper section.video-contr
background-color: #444; } background-color: #444; }
section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls div.speeds:hover { section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls div.speeds:hover {
opacity: 1; } opacity: 1; }
section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls a.add-fullscreen {
float: left;
display: block;
padding: 0 11.326px;
margin-left: 0;
line-height: 46px;
color: #797979;
-webkit-transition-property: all;
-moz-transition-property: all;
-ms-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.15s;
-moz-transition-duration: 0.15s;
-ms-transition-duration: 0.15s;
-o-transition-duration: 0.15s;
transition-duration: 0.15s;
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
-webkit-transition-delay: 0;
-moz-transition-delay: 0;
-ms-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
border-right: 1px solid #000;
-webkit-box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
-moz-box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555; }
section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls a.add-fullscreen:hover {
color: #fff;
text-decoration: none;
background-color: #444; }
section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls a.hide-subtitles { section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls a.hide-subtitles {
float: left; float: left;
display: block; display: block;
...@@ -3297,14 +3339,18 @@ section.course-content div.video-subtitles.fullscreen { ...@@ -3297,14 +3339,18 @@ section.course-content div.video-subtitles.fullscreen {
border: 0; border: 0;
padding: 0; padding: 0;
height: 100%; height: 100%;
left: 22px;
position: fixed; position: fixed;
left: 0;
top: 0; top: 0;
bottom: 0;
width: 100%; width: 100%;
max-height: 100%;
z-index: 999; } z-index: 999; }
section.course-content div.video-subtitles.fullscreen div.tc-wrapper { section.course-content div.video-subtitles.fullscreen div.tc-wrapper {
padding: 20px; padding: 20px;
vertical-align: middle; } vertical-align: middle;
min-height: 100%;
overflow: hidden; }
section.course-content div.video-subtitles.fullscreen ol.subtitles li { section.course-content div.video-subtitles.fullscreen ol.subtitles li {
color: #aaa; } color: #aaa; }
section.course-content div.video-subtitles.fullscreen ol.subtitles li.current { section.course-content div.video-subtitles.fullscreen ol.subtitles li.current {
......
section.course-content { section.course-content {
div.video {
padding: 6px lh();
margin: 0 (-(lh()));
border-top: 1px solid #e1e1e1;
border-bottom: 1px solid #e1e1e1;
background: #f3f3f3;
display: block;
}
div.video-subtitles { div.video-subtitles {
// padding: 6px lh();
// border-top: 1px solid #e1e1e1;
// border-bottom: 1px solid #e1e1e1;
// background: #f3f3f3;
display: table; display: table;
@include clearfix(); @include clearfix();
...@@ -261,6 +265,24 @@ section.course-content { ...@@ -261,6 +265,24 @@ section.course-content {
} }
} }
a.add-fullscreen {
float: left;
display: block;
padding: 0 lh(.5);
margin-left: 0;
line-height: 46px; //height of play pause buttons
color: #797979;
@include transition();
border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555, inset 1px 0 0 #555);
&:hover {
color: #fff;
text-decoration: none;
background-color: #444;
}
}
a.hide-subtitles { a.hide-subtitles {
float: left; float: left;
display: block; display: block;
...@@ -368,15 +390,19 @@ section.course-content { ...@@ -368,15 +390,19 @@ section.course-content {
border: 0; border: 0;
padding: 0; padding: 0;
height: 100%; height: 100%;
left: 22px;
position: fixed; position: fixed;
left: 0;
top: 0; top: 0;
bottom: 0;
width: 100%; width: 100%;
max-height: 100%;
z-index: 999; z-index: 999;
div.tc-wrapper { div.tc-wrapper {
padding: 20px; padding: 20px;
vertical-align: middle; vertical-align: middle;
min-height: 100%;
overflow: hidden;
} }
ol.subtitles { ol.subtitles {
......
...@@ -2,7 +2,8 @@ ...@@ -2,7 +2,8 @@
<h1> ${name} </h1> <h1> ${name} </h1>
% endif % endif
<div class="video-subtitles"> <div class="video">
<div class="video-subtitles fullscreen">
<div class="tc-wrapper"> <div class="tc-wrapper">
<div class="video-wrapper"> <div class="video-wrapper">
...@@ -63,6 +64,7 @@ ...@@ -63,6 +64,7 @@
</div> </div>
</div> </div>
</div>
<%block name="js_extra"> <%block name="js_extra">
<script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment