From 7c3002e608e2e39888b27d1feedc9faba43a0885 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Timoth=C3=A9e=20Alby?= Date: Tue, 21 Dec 2021 14:46:15 +0100 Subject: [PATCH] Merge pull request #6190 from overleaf/ta-survey-future Add Product Survey 2021 GitOrigin-RevId: 838380993688262f6541101c7ee2f8d85da4323e --- services/web/app/views/project/list.pug | 22 +++++++++ .../js/main/project-list/project-list.js | 11 +++++ .../stylesheets/app/sidebar-v2-dash-pane.less | 45 +++++++++++++++++++ .../frontend/stylesheets/core/variables.less | 1 + 4 files changed, 79 insertions(+) diff --git a/services/web/app/views/project/list.pug b/services/web/app/views/project/list.pug index ea7cbc4b59..018155c547 100644 --- a/services/web/app/views/project/list.pug +++ b/services/web/app/views/project/list.pug @@ -43,6 +43,28 @@ block content aside.project-list-sidebar include ./list/side-bar + .project-list-sidebar-survey( + ng-if="shouldShowSurveyLink" + ng-cloak + ) + | Help us shape the future of Overleaf! + | + | + a.project-list-sidebar-survey-link( + href="https://forms.gle/UmuN1w9xyemnoMK96" + target="_blank" + rel="noreferrer noopener" + ) Take part in our annual survey + | . + button.project-list-sidebar-survey-dismiss( + type="button" + title="Dismiss Overleaf survey" + ng-click="dismissSurvey()" + ) + span( + aria-hidden="true" + ) × + .project-list-main.col-md-10.col-xs-9 include ./list/notifications include ./list/project-list diff --git a/services/web/frontend/js/main/project-list/project-list.js b/services/web/frontend/js/main/project-list/project-list.js index 031a7bce01..6489ef8255 100644 --- a/services/web/frontend/js/main/project-list/project-list.js +++ b/services/web/frontend/js/main/project-list/project-list.js @@ -27,6 +27,17 @@ App.controller('ProjectPageController', function ( newValue === 'ownerName' ? ownerNameComparator : defaultComparator }) + $scope.shouldShowSurveyLink = true + + if (localStorage('dismissed-2021-future-survey') === true) { + $scope.shouldShowSurveyLink = false + } + + $scope.dismissSurvey = () => { + localStorage('dismissed-2021-future-survey', true) + $scope.shouldShowSurveyLink = false + } + $timeout(() => recalculateProjectListHeight(), 10) $scope.$watch( diff --git a/services/web/frontend/stylesheets/app/sidebar-v2-dash-pane.less b/services/web/frontend/stylesheets/app/sidebar-v2-dash-pane.less index 5262b72058..edb4a600a9 100644 --- a/services/web/frontend/stylesheets/app/sidebar-v2-dash-pane.less +++ b/services/web/frontend/stylesheets/app/sidebar-v2-dash-pane.less @@ -11,6 +11,51 @@ padding-right: 15px; } +.project-list-sidebar-survey { + position: relative; + font-size: @font-size-small; + background-color: @v2-dash-pane-bg; + color: @v2-dash-pane-subdued-color; + padding: @folders-menu-item-v-padding 20px @folders-menu-item-v-padding + @folders-menu-item-h-padding; + &::before { + content: ''; + display: block; + height: 15px; + background-image: linear-gradient(to top, rgba(0, 0, 0, 0.1), transparent); + position: absolute; + bottom: 100%; + width: 100%; + left: 0; + } +} +.project-list-sidebar-survey-link { + color: @v2-dash-pane-color; + font-weight: bold; + &:hover, + &:active, + &:focus { + text-decoration: none; + color: @v2-dash-pane-color; + } +} + +.project-list-sidebar-survey-dismiss { + .btn-inline-link; + position: absolute; + top: @folders-menu-item-v-padding; + right: @folders-menu-item-v-padding; + font-size: @font-size-base; + line-height: 1; + color: @v2-dash-pane-color; + &:hover, + &:active, + &:focus { + text-decoration: none; + color: @v2-dash-pane-color; + } +} + .project-list-sidebar-v2-pane { flex-grow: 0; flex-shrink: 0; diff --git a/services/web/frontend/stylesheets/core/variables.less b/services/web/frontend/stylesheets/core/variables.less index 953e31ee4b..cf04a4ffd2 100644 --- a/services/web/frontend/stylesheets/core/variables.less +++ b/services/web/frontend/stylesheets/core/variables.less @@ -933,6 +933,7 @@ @v2-dash-pane-bg: @ol-blue-gray-4; @v2-dash-pane-link-color: #fff; @v2-dash-pane-color: #fff; +@v2-dash-pane-subdued-color: @ol-blue-gray-2; @v2-dash-pane-toggle-color: #fff; @v2-dash-pane-btn-bg: @ol-blue-gray-5; @v2-dash-pane-btn-hover-bg: @ol-blue-gray-6;