From 58ecbd8d803f856a8ef05411d9a1202bb92e7b7f Mon Sep 17 00:00:00 2001
From: Andrei Grigore <andrei.ggr@gmail.com>
Date: Tue, 1 Mar 2022 14:35:07 +0200
Subject: [PATCH] updates stretch for public

---
 src/StyleWrapper/stretchStyleDefaultView.css | 124 ++++++++++++-------
 src/StyleWrapper/stretchStyleWideView.css    |  14 +--
 2 files changed, 89 insertions(+), 49 deletions(-)

diff --git a/src/StyleWrapper/stretchStyleDefaultView.css b/src/StyleWrapper/stretchStyleDefaultView.css
index ab284a9..e774525 100644
--- a/src/StyleWrapper/stretchStyleDefaultView.css
+++ b/src/StyleWrapper/stretchStyleDefaultView.css
@@ -1,8 +1,4 @@
-main {
-  overflow: hidden;
-}
-
-.stretch {
+body:not(.view-editview):not(.document_wide_view) .stretch {
   position: relative;
   z-index: 3;
   right: 50%;
@@ -30,18 +26,26 @@ body:not(.view-viewview) .stretch {
   margin: 0 -50px;
 }
 
-/* detect if is authenticated or anon */
-body:not(.is-authenticated) .stretch {
+/* detect if is anon */
+body:not(.is-authenticated):not(.document_wide_view) .stretch {
   right: 0;
   left: 0;
   width: auto;
   padding: 0;
-  margin: 0 -1rem;
+  margin: 0 -28.3rem;
   transform: none;
 }
 
+body:not(.is-authenticated):not(.document_wide_view) main {
+  overflow: hidden;
+}
+
+body:not(.view-editview):not(.document_wide_view):not(.is-anonymous) main {
+  overflow: hidden;
+}
+
 /* detect if is logged in but in view with toolbar open */
-body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous)
+body:not(.view-editview):not(.document_wide_view):not(.is-anonymous)
   .stretch {
   max-width: 1636px;
   margin: 0;
@@ -85,12 +89,12 @@ body:not(.view-viewview):not(.has-sidebar-collapsed):not(.has-toolbar)
   left: 19em !important;
 }
 
-body:not(.is-authenticated).stretch {
+body:not(.is-authenticated):not(.document_wide_view).stretch {
   padding: 0;
 }
 
 @media screen and (max-width: 1790px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous)
     .stretch {
     right: auto;
     left: auto;
@@ -99,12 +103,12 @@ body:not(.is-authenticated).stretch {
     transform: none;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     max-width: 100vw;
     margin: 0 -25.54vw;
   }
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     max-width: 100vw;
     margin: 0 -25.5vw;
@@ -112,14 +116,14 @@ body:not(.is-authenticated).stretch {
 }
 
 @media screen and (max-width: 1749px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -26.1vw;
   }
 }
 
 @media screen and (max-width: 1700px) {
-  .stretch {
+  body:not(.document_wide_view).stretch {
     margin-right: 0;
     margin-left: 0;
     transform: translate(-50%, 0%);
@@ -142,11 +146,12 @@ body:not(.is-authenticated).stretch {
     max-width: 1778px;
   }
 
-  body:not(.is-authenticated) .stretch {
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
     max-width: 1700px;
+    margin: 0 -26.8vw;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -26.4vw;
   }
@@ -171,14 +176,18 @@ body:not(.is-authenticated).stretch {
 }
 
 @media screen and (max-width: 1599px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -18.3vw;
   }
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -18.9vw;
   }
+
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
+    margin: 0 -19.2vw;
+  }
 }
 
 @media screen and (max-width: 1595px) {
@@ -189,25 +198,32 @@ body:not(.is-authenticated).stretch {
 }
 
 @media screen and (max-width: 1499px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -18.4vw;
   }
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -19vw;
   }
+
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
+    margin: 0 -19.5vw;
+  }
 }
 
 @media screen and (max-width: 1399px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -18.5vw;
   }
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -19.2vw;
   }
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
+    margin: 0 -19.8vw;
+  }
 }
 
 @media screen and (max-width: 1299px) {
@@ -217,88 +233,108 @@ body:not(.is-authenticated).stretch {
 }
 
 @media screen and (max-width: 1280px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -17.8vw;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -15.3rem;
   }
 }
 
 @media screen and (max-width: 1220px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -14.9rem;
   }
 }
 
 @media screen and (max-width: 1200px) {
-  body:not(.is-authenticated) .stretch {
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
     margin: 0 -0.6rem;
   }
+
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
+    margin: 0 -3.7vw;
+  }
 }
 
 @media screen and (max-width: 1199px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -3.6vw;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -3.5vw;
   }
 }
 
 @media screen and (max-width: 1049px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -4vw;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -4vw;
   }
+
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
+    margin: 0 -4.3vw;
+  }
 }
 
 @media screen and (max-width: 1000px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -4.2vw;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -4.3vw;
   }
+
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
+    margin: 0 -4.5vw;
+  }
 }
 
 @media screen and (max-width: 900px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -4.65vw;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -4.9vw;
   }
+
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
+    margin: 0 -4.5vw;
+  }
 }
 
 @media screen and (max-width: 849px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -1.2vw;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -5vw;
   }
+
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
+    margin: 0 -5.2vw;
+  }
 }
 
 @media screen and (max-width: 867px) {
@@ -325,29 +361,29 @@ body:not(.is-authenticated).stretch {
 }
 
 @media screen and (max-width: 787px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     margin: 0 -1.2vw;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     margin: 0 -1.2vw;
   }
 }
 
 @media screen and (max-width: 767px) {
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar-collapsed)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
     .stretch {
     padding: 0;
   }
 
-  body:not(.view-editview):not(.view-defaultviewwide):not(.is-anonymous):not(.has-toolbar)
+  body:not(.view-editview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
     .stretch {
     padding: 0;
   }
 
-  body:not(.is-authenticated) .stretch {
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
     padding: 0;
   }
 
@@ -359,4 +395,8 @@ body:not(.is-authenticated).stretch {
   body:not(.view-viewview):not(.has-sidebar):not(.has-toolbar) .stretch {
     padding: 0;
   }
+
+  body:not(.is-authenticated):not(.document_wide_view) .stretch {
+    margin: 0 -1.3vw;
+  }
 }
diff --git a/src/StyleWrapper/stretchStyleWideView.css b/src/StyleWrapper/stretchStyleWideView.css
index 321a908..26ec5b8 100644
--- a/src/StyleWrapper/stretchStyleWideView.css
+++ b/src/StyleWrapper/stretchStyleWideView.css
@@ -1,5 +1,5 @@
 
-.stretch {
+body:not(.view-defaultview).stretch {
   position: relative;
   z-index: 3;
   right: 50%;
@@ -28,7 +28,7 @@ body:not(.view-viewview) .stretch {
 }
 
 /* detect if is authenticated or anon */
-body:not(.is-authenticated) .stretch {
+body:not(.is-authenticated):not(.view-defaultview) .stretch {
   right: 0;
   left: 0;
   width: auto;
@@ -81,7 +81,7 @@ body:not(.view-viewview):not(.has-sidebar-collapsed):not(.has-toolbar)
   left: 19em !important;
 }
 
-body:not(.is-authenticated).stretch {
+body:not(.is-authenticated):not(.view-defaultview).stretch {
   padding: 0;
 }
 
@@ -97,7 +97,7 @@ body:not(.is-authenticated).stretch {
 }
 
 @media screen and (max-width: 1700px) {
-  .stretch {
+  body:not(.view-defaultview) .stretch {
     margin-right: 0;
     margin-left: 0;
     transform: translate(-50%, 0%);
@@ -120,7 +120,7 @@ body:not(.is-authenticated).stretch {
     max-width: 1778px;
   }
 
-  body:not(.is-authenticated) .stretch {
+  body:not(.is-authenticated):not(.view-defaultview) .stretch {
     max-width: 1700px;
   }
 
@@ -174,7 +174,7 @@ body:not(.is-authenticated).stretch {
 }
 
 @media screen and (max-width: 1200px) {
-  body:not(.is-authenticated) .stretch {
+  body:not(.is-authenticated):not(.view-defaultview) .stretch {
     margin: 0 -0.6rem;
   }
 }
@@ -212,7 +212,7 @@ body:not(.is-authenticated).stretch {
     padding: 0;
   }
 
-  body:not(.is-authenticated) .stretch {
+  body:not(.is-authenticated):not(.view-defaultview) .stretch {
     padding: 0;
   }