summaryrefslogtreecommitdiffstats
path: root/webapp/sass/components/_videos.scss
diff options
context:
space:
mode:
Diffstat (limited to 'webapp/sass/components/_videos.scss')
-rw-r--r--webapp/sass/components/_videos.scss61
1 files changed, 32 insertions, 29 deletions
diff --git a/webapp/sass/components/_videos.scss b/webapp/sass/components/_videos.scss
index 91db750bd..e009e6538 100644
--- a/webapp/sass/components/_videos.scss
+++ b/webapp/sass/components/_videos.scss
@@ -1,65 +1,68 @@
@charset 'UTF-8';
.video-div {
- position: relative;
- max-width: 480px;
margin-bottom: 8px;
+ max-width: 480px;
+ position: relative;
+
.video-thumbnail {
- max-width: 100%;
height: auto;
+ max-width: 100%;
}
+
.block {
- background-color: rgba(0,0,0,.5);
+ background-color: alpha-color($black, .5);
border-radius: 10px;
+ height: 150px;
+ left: 50%;
+ margin: -75px 0 0 -100px;
position: absolute;
top: 50%;
- left: 50%;
- margin-top: -100px;
width: 200px;
- margin: -75px 0 0 -100px;
- height: 150px;
}
}
.video-type {
@include opacity(.8);
font-size: 15px;
- margin: 0px;
- padding: 0px;
+ margin: 0;
+ padding: 0;
}
.video-title {
font-size: 15px;
margin-top: 3px;
}
+
.play-button {
- width: 100px;
+ @include border-radius(14px);
+ border: 4px solid alpha-color($white, .4);
height: 100px;
position: absolute;
- top: 26px;
right: 51px;
- border: 4px solid;
- border-color: rgba(255,255,255,.4);
- border-radius: 14px;
-}
-.play-button span {
- position: absolute;
- top: 10px;
- left: 20px;
- width: 0;
- height: 0;
- border-top: 36px solid transparent;
- border-bottom: 36px solid transparent;
- border-left: 60px solid rgba(255,255,255,.4);
+ top: 26px;
+ width: 100px;
+
+ span {
+ border-bottom: 36px solid transparent;
+ border-left: 60px solid alpha-color($white, .4);
+ border-top: 36px solid transparent;
+ height: 0;
+ left: 20px;
+ position: absolute;
+ top: 10px;
+ width: 0;
+ }
}
.img-div {
-moz-force-broken-image-icon: 1;
- position: relative;
- max-width: 450px;
- max-height: 500px;
- margin-bottom: 8px;
border-radius: 5px;
+ margin-bottom: 8px;
+ max-height: 500px;
+ max-width: 450px;
+ position: relative;
+
&.placeholder {
height: 500px;
}