about summary refs log tree commit diff
path: root/app/javascript/styles
diff options
context:
space:
mode:
authorOndřej Hruška <ondra@ondrovo.com>2017-07-08 11:01:56 +0200
committerbeatrix <beatrix.bitrot@gmail.com>2017-07-08 06:46:12 -0400
commitdc2b8bdecd4cc84b64ac069406a8d6554e4f8cd4 (patch)
treef13ba1a1d2afd8eae4fd0a07598c3ff50b601d45 /app/javascript/styles
parente3c2183c12b5598ae891e148b5f32e066832e053 (diff)
Added a toggle for full-width media previews
Diffstat (limited to 'app/javascript/styles')
-rw-r--r--app/javascript/styles/components.scss29
1 files changed, 23 insertions, 6 deletions
diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss
index 634c1b811..6b766bf14 100644
--- a/app/javascript/styles/components.scss
+++ b/app/javascript/styles/components.scss
@@ -2318,6 +2318,11 @@ button.icon-button.active i.fa-retweet {
   position: relative;
   text-align: center;
   z-index: 100;
+
+  margin-top: 15px; // Add margin when used bare for NSFW video player
+  .media-gallery & {
+    margin-top: 0;
+  }
 }
 
 .media-spoiler__warning {
@@ -3707,11 +3712,15 @@ button.icon-button.active i.fa-retweet {
 .media-gallery {
   box-sizing: border-box;
   margin-top: 15px;
-  margin-left: -68px;
   overflow: hidden;
   position: relative;
-  width: calc(100% + 80px);
   background: $base-shadow-color;
+  width: 100%;
+
+  &.full-width {
+    margin-left: -68px;
+    width: calc(100% + 80px);
+  }
 
   .detailed-status & {
     margin-left:-10px;
@@ -3780,10 +3789,14 @@ button.icon-button.active i.fa-retweet {
   box-sizing: border-box;
   cursor: default; /* May not be needed */
   margin-top: 15px;
-  margin-left:-68px;
-  width: calc(100% + 80px);
   overflow: hidden;
   position: relative;
+  width: 100%;
+
+  &.full-width {
+    margin-left: -68px;
+    width: calc(100% + 80px);
+  }
 }
 
 .status__video-player-video {
@@ -3836,9 +3849,13 @@ button.icon-button.active i.fa-retweet {
   background-position: center;
   cursor: pointer;
   margin-top: 15px;
-  margin-left: -68px;
-  width: calc(100% + 80px);
   position: relative;
+  width: 100%;
+
+  &.full-width {
+    margin-left: -68px;
+    width: calc(100% + 80px);
+  }
 }
 
 .media-spoiler-video-play-icon {