From 5e4753888e224dbf5edad43054965029efcb3230 Mon Sep 17 00:00:00 2001
From: "Tudor D. Pop" <tudor.dan.pop7@gmail.com>
Date: Tue, 11 May 2021 17:25:49 +0300
Subject: [PATCH] feat(virtual-background): Add placeholder on virtual
 background preview

---
 .../_virtual-background.scss                  | 22 +++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/css/modals/virtual-background/_virtual-background.scss b/css/modals/virtual-background/_virtual-background.scss
index d6bdd01b7..a5bdf029f 100644
--- a/css/modals/virtual-background/_virtual-background.scss
+++ b/css/modals/virtual-background/_virtual-background.scss
@@ -1,4 +1,5 @@
 .virtual-background-dialog {
+    position: relative;
     max-height: 300px;
     color: white;
     display: inline-grid;
@@ -107,6 +108,7 @@
         vertical-align: middle;
         line-height: 60px;
     }
+
     @media (min-width: 432px) and (max-width: 632px) {
         font-size: 1.5vw;
         .virtual-background-none, .thumbnail, .thumbnail-selected, .none-selected, .blur, .blur-selected, .slight-blur, .slight-blur-selected{
@@ -179,8 +181,20 @@
  }
 
  .video-preview-loader{
+     border-radius: 6px;
+     background-color: transparent;
+     height: 250px;
+     margin-bottom: 8px;
+     width: 572px;
      position: fixed;
-     left: 50%;
-     top: 35%;
-     transform: translate(-50%,-35%);
- }
\ No newline at end of file
+     z-index: 2;
+     @media (min-width: 432px) and (max-width: 632px) {
+         width: 340px;
+     }
+ }
+
+ .video-preview-loader svg{
+    position: absolute;
+    top: 40%;
+    left: 45%;
+ }