From 8be85de6ef8ca8ecefdd2b68abf177059f530343 Mon Sep 17 00:00:00 2001
From: yanas <yana@jitsi.org>
Date: Thu, 6 Apr 2017 13:09:05 -0500
Subject: [PATCH] Changes scss variable name

---
 css/_filmstrip.scss | 29 +++++++++++++++++++----------
 css/_toastr.scss    |  2 +-
 css/_variables.scss |  2 +-
 3 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/css/_filmstrip.scss b/css/_filmstrip.scss
index 43fd1a080..00f6338d7 100644
--- a/css/_filmstrip.scss
+++ b/css/_filmstrip.scss
@@ -17,8 +17,8 @@
         flex-direction: column-reverse;
         flex-wrap: nowrap;
         position: relative;
-        z-index: $zindex1;              // Set z-index to make element visible
-        width: $hideFilmstripButtonWidth;
+        z-index: $zindex1; // Set z-index to make element visible.
+        width: $filmstripToggleButtonWidth;
 
         button {
             font-size: 14px;
@@ -50,7 +50,7 @@
         position:relative;
         height:196px;
         padding: 0;
-        /*The filmstrip should not be covered by the left toolbar*/
+        /* The filmstrip should not be covered by the left toolbar. */
         padding-left: $defaultToolbarSize + 5;
         bottom: 0;
         width:auto;
@@ -58,8 +58,8 @@
         z-index: $filmstripVideosZ;
         transition: bottom 2s;
         overflow: visible !important;
-        /*!!!Removes the gap between the local video container and the remote
-        videos.*/
+        /*!!! Removes the gap between the local video container and the remote
+        videos. */
         font-size: 0pt;
 
         &.hidden {
@@ -79,8 +79,8 @@
             }
 
             /**
-            * Focused video thumbnail.
-            */
+             * Focused video thumbnail.
+             */
             &.videoContainerFocused {
                 transition-duration: 0.5s;
                 -webkit-transition-duration: 0.5s;
@@ -97,8 +97,8 @@
             }
 
             /**
-            * Hovered video thumbnail.
-            */
+             * Hovered video thumbnail.
+             */
             &:hover {
                 cursor: hand;
                 border: $thumbnailVideoBorder solid $videoThumbnailHovered;
@@ -110,7 +110,7 @@
                 }
             }
 
-            /* With TemasysWebRTC plugin <object/> element is used
+            /* With the TemasysWebRTC plugin <object/> element is used
             instead of <video/> */
             & > video,
             & > object {
@@ -121,4 +121,13 @@
             }
         }
     }
+
+    /**
+     * Style the filmstrip videos in filmstrip-only mode.
+     */
+    &__videos-filmstripOnly {
+        margin-top: auto;
+        margin-bottom: auto;
+        padding-right: $defaultToolbarSize;
+    }
 }
diff --git a/css/_toastr.scss b/css/_toastr.scss
index b657322a3..f1647a0be 100644
--- a/css/_toastr.scss
+++ b/css/_toastr.scss
@@ -94,7 +94,7 @@
 #toast-container.notification-bottom-right {
   $videoOffset: 2 * ($thumbnailVideoMargin + $thumbnailsBorder) + $thumbnailVideoBorder;
   bottom: 135px;
-  right: $hideFilmstripButtonWidth + $videoOffset;
+  right: $filmstripToggleButtonWidth + $videoOffset;
 }
 
 #toast-container * {
diff --git a/css/_variables.scss b/css/_variables.scss
index e6580fb4a..ea480c8c1 100644
--- a/css/_variables.scss
+++ b/css/_variables.scss
@@ -18,7 +18,7 @@ $thumbnailIndicatorSize: $thumbnailToolbarHeight;
 $thumbnailVideoMargin: 2px;
 $thumbnailsBorder: 2px;
 $thumbnailVideoBorder: 2px;
-$hideFilmstripButtonWidth: 17px;
+$filmstripToggleButtonWidth: 17px;
 
 
 /**