]> cat aescling's git repositories - mastodon.git/commitdiff
fix(video): Position of play icon (#2608)
authorStephen Burgess <stephenburgess8@gmail.com>
Sat, 29 Apr 2017 13:23:27 +0000 (09:23 -0400)
committerEugen Rochko <eugen@zeonfederated.com>
Sat, 29 Apr 2017 13:23:27 +0000 (15:23 +0200)
* fix(video): Position of play icon

#2601

* fix(overlay-button): Positioning

* fix(expand): Bottom align expand icon

* feat(video): Fit landscape videos into preview area

app/assets/stylesheets/components.scss

index 11d50673d40d55507892eb89c5729e5f3b6d2b56..68b2be9ece91fcfd1173b40c15f114e210472293 100644 (file)
@@ -3097,7 +3097,7 @@ button.icon-button.active i.fa-retweet {
   object-fit: cover;
   position: relative;
   top: 50%;
-  transform: translateY(-50%);
+  transform: translateY(-35%);
   width: 100%;
   z-index: 1;
 }
@@ -3109,19 +3109,24 @@ button.icon-button.active i.fa-retweet {
   position: absolute;
   right: 4px;
   text-shadow: 0px 1px 1px #000, 1px 0px 1px #000;
-  top: 4px;
 }
 
 .status__video-player-spoiler {
   color: #fff;
+  left: 4px;
+  position: absolute;
   text-shadow: 0px 1px 1px #000, 1px 0px 1px #000;
+  top: 4px;
+  z-index: 100;
 }
 
 .status__video-player-expand {
+  bottom: 4px;
   z-index: 100;
 }
 
 .status__video-player-mute {
+  top: 4px;
   z-index: 5;
 }
 
@@ -3136,6 +3141,7 @@ button.icon-button.active i.fa-retweet {
   border-radius: 100px;
   color: rgba(255, 255, 255, 0.8);
   font-size: 36px;
+  left: 50%;
   padding: 5px;
   position: absolute;
   top: 50%;