updates stretch for public

eea · Mar 1, 2022 · 58ecbd8 · 58ecbd8
1 parent 5be7871
commit 58ecbd8
Show file tree

Hide file tree

Showing 2 changed files with 89 additions and 49 deletions.
diff --git 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,27 +103,27 @@ 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;
   }
 }
 
 @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
@@ -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;
   }