From a5e1758b33d1c9e0dabb1943bcd57f097fa1c6e3 Mon Sep 17 00:00:00 2001
From: Eric Mc Sween <eric.mcsween@overleaf.com>
Date: Tue, 11 Oct 2022 10:44:36 -0400
Subject: [PATCH] Merge pull request #9895 from overleaf/jel-react-dash-survey

[web] Fixed position survey at bottom left of viewport on React dash

GitOrigin-RevId: a48c50e0cb90ef7356b461c0a480f7b163692303
---
 .../components/project-list-root.tsx             |  6 +++++-
 .../stylesheets/app/project-list-react.less      | 16 +++++++++++++++-
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/services/web/frontend/js/features/project-list/components/project-list-root.tsx b/services/web/frontend/js/features/project-list/components/project-list-root.tsx
index 823978a2f6..177cfdd2c4 100644
--- a/services/web/frontend/js/features/project-list/components/project-list-root.tsx
+++ b/services/web/frontend/js/features/project-list/components/project-list-root.tsx
@@ -54,7 +54,6 @@ function ProjectListPageContent() {
                 <NewProjectButton id="new-project-button-sidebar" />
                 <SidebarFilters />
               </aside>
-              <SurveyWidget />
             </div>
           </div>
           <div className="project-list-main-react">
@@ -119,6 +118,11 @@ function ProjectListPageContent() {
               </Col>
             </Row>
           </div>
+          <div className="project-list-sidebar-survey-wrapper hidden-xs">
+            <div className="project-list-sidebar-survey-subwrapper">
+              <SurveyWidget />
+            </div>
+          </div>
         </>
       ) : (
         <div className="project-list-welcome-wrapper">
diff --git a/services/web/frontend/stylesheets/app/project-list-react.less b/services/web/frontend/stylesheets/app/project-list-react.less
index 768a9af3be..b41f5eaa0a 100644
--- a/services/web/frontend/stylesheets/app/project-list-react.less
+++ b/services/web/frontend/stylesheets/app/project-list-react.less
@@ -1,3 +1,5 @@
+@project-list-sidebar-wrapper-flex: 0 0 15%;
+
 .project-list-react {
   overflow-x: hidden;
 
@@ -32,7 +34,7 @@
 
   .project-list-sidebar-wrapper-react {
     background-color: @sidebar-bg;
-    flex: 0 0 15%;
+    flex: @project-list-sidebar-wrapper-flex;
     min-height: calc(~'100vh -' @header-height);
 
     .project-list-sidebar-subwrapper {
@@ -695,3 +697,15 @@
     background-color: @ol-green;
   }
 }
+
+.project-list-sidebar-survey-wrapper {
+  display: flex;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+
+  .project-list-sidebar-survey-subwrapper {
+    flex: @project-list-sidebar-wrapper-flex;
+  }
+}