diff --git a/services/web/app/views/project/list.pug b/services/web/app/views/project/list.pug
index 3abcde9ba7..fcf93accb3 100644
--- a/services/web/app/views/project/list.pug
+++ b/services/web/app/views/project/list.pug
@@ -61,21 +61,30 @@ block content
.row.project-list-row(ng-cloak)
.project-list-container(ng-if="projects.length > 0")
- aside.project-list-sidebar.col-md-2.col-xs-3
- include ./list/side-bar
+ .project-list-sidebar-wrapper.col-md-2.col-xs-3
+ aside.project-list-sidebar
+ include ./list/side-bar
- if hasFeature('v1-return-message')
- .project-list-sidebar-v2-pane.col-md-2.col-xs-3
- span Welcome to the Overleaf v2 alpha! #[a(href="https://www.overleaf.com/help/342-overleaf-v2-faq") Find out more].
- if userIsFromOLv1(user)
- span To tag or rename your v1 projects, please go back to Overleaf v1.
- a.project-list-sidebar-v1-link(
- href=settings.overleaf.host + "/dash?prefer-v1-dash=1"
- ) Go back to v1
- if userIsFromSL(user)
- a.project-list-sidebar-v1-link(
- href=settings.accountMerge.sharelatexHost
- ) Go back to ShareLaTeX
+ if hasFeature('v1-return-message')
+ .project-list-sidebar-v2-pane(ng-controller="OverleafV1NotificationController")
+ div
+ button.btn-link.pull-right.project-list-sidebar-v2-pane-toggle(
+ ng-click="toggle()"
+ )
+ i.fa.fa-fw(ng-class="{ 'fa-chevron-up': !visible, 'fa-close': visible }")
+ | Welcome to the Overleaf v2 beta!
+ div(ng-show="visible") #[a(href="https://www.overleaf.com/help/342-overleaf-v2-faq") Find out more].
+ if userIsFromOLv1(user)
+ div(ng-show="visible")
+ | To tag or rename your v1 projects, please go back to Overleaf v1.
+ a.project-list-sidebar-v1-link(
+ href=settings.overleaf.host + "/dash?prefer-v1-dash=1"
+ ) Go back to v1
+ if userIsFromSL(user)
+ div(ng-show="visible")
+ a.project-list-sidebar-v1-link(
+ href=settings.accountMerge.sharelatexHost
+ ) Go back to ShareLaTeX
.project-list-main.col-md-10.col-xs-9
include ./list/notifications
diff --git a/services/web/app/views/project/list/notifications.pug b/services/web/app/views/project/list/notifications.pug
index 69fc1806a0..15301482a3 100644
--- a/services/web/app/views/project/list/notifications.pug
+++ b/services/web/app/views/project/list/notifications.pug
@@ -1,10 +1,20 @@
if (user.awareOfV2 && !settings.overleaf)
- .alert.alert-info.small
- a.pull-right.btn.btn-info.btn-sm(href="/user/login_to_ol_v2" style="margin-left: 12px") Click here to try Overleaf v2
- p
- | ShareLaTeX is joining Overleaf and will become Overleaf v2 in late 2018 (read more).
-
- | We’re beta testing Overleaf v2 now and you can try it out with your ShareLaTeX account.
+ .userNotifications
+ ul.list-unstyled.notifications-list(ng-controller="OverleafV2NotificationController", ng-show="visible")
+ li.notification_entry
+ .row
+ .col-xs-12
+ .alert.alert-info
+ .notification_inner
+ .notification_body
+ a.btn.btn-info.btn-sm.pull-right(href="/user/login_to_ol_v2") Try Overleaf v2
+ | ShareLaTeX is joining Overleaf and will become Overleaf v2 in late 2018 (read more).
+
+ | We’re beta testing Overleaf v2 now and you can try it out with your ShareLaTeX account.
+ .notification_close
+ button(ng-click="dismiss()").close.pull-right
+ span(aria-hidden="true") ×
+ span.sr-only #{translate("close")}
span(ng-controller="NotificationsController").userNotifications
ul.list-unstyled.notifications-list(
diff --git a/services/web/public/coffee/main/announcements.coffee b/services/web/public/coffee/main/announcements.coffee
index 5663be9ca6..92c0cb4f4a 100644
--- a/services/web/public/coffee/main/announcements.coffee
+++ b/services/web/public/coffee/main/announcements.coffee
@@ -29,4 +29,3 @@ define [
$scope.showAll = ->
$scope.ui.newItems = 0
-
diff --git a/services/web/public/coffee/main/project-list/notifications-controller.coffee b/services/web/public/coffee/main/project-list/notifications-controller.coffee
index 21476f4f04..fff75d0f35 100644
--- a/services/web/public/coffee/main/project-list/notifications-controller.coffee
+++ b/services/web/public/coffee/main/project-list/notifications-controller.coffee
@@ -35,4 +35,21 @@ define [
$scope.notification.accepted = true
.catch () ->
$scope.notification.inflight = false
- $scope.notification.error = true
\ No newline at end of file
+ $scope.notification.error = true
+
+ App.controller "OverleafV2NotificationController", ($scope, localStorage) ->
+ $scope.visible = !localStorage('overleaf_v2_notification_hidden_at')
+
+ $scope.dismiss = () ->
+ $scope.visible = false
+ localStorage('overleaf_v2_notification_hidden_at', Date.now())
+
+ App.controller "OverleafV1NotificationController", ($scope, localStorage) ->
+ $scope.visible = !localStorage('overleaf_v1_notification_hidden_at')
+
+ $scope.toggle = () ->
+ $scope.visible = !$scope.visible
+ if !$scope.visible
+ localStorage('overleaf_v1_notification_hidden_at', Date.now())
+ else
+ localStorage('overleaf_v1_notification_hidden_at', null)
\ No newline at end of file
diff --git a/services/web/public/stylesheets/app/project-list.less b/services/web/public/stylesheets/app/project-list.less
index 99506f7c93..982086a262 100644
--- a/services/web/public/stylesheets/app/project-list.less
+++ b/services/web/public/stylesheets/app/project-list.less
@@ -130,10 +130,6 @@
padding-right: 15px;
vertical-align: middle;
}
- .notification_close {
- display: table-cell;
- vertical-align: middle;
- }
}
}
}
diff --git a/services/web/public/stylesheets/app/sidebar-v2-dash-pane.less b/services/web/public/stylesheets/app/sidebar-v2-dash-pane.less
index d1586b4a5c..6000b08d02 100644
--- a/services/web/public/stylesheets/app/sidebar-v2-dash-pane.less
+++ b/services/web/public/stylesheets/app/sidebar-v2-dash-pane.less
@@ -1,20 +1,25 @@
-@v2-dash-pane-link-height: 130px;
+.project-list-sidebar-wrapper {
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ margin: 0 -15px;
+}
.project-list-sidebar {
- height: calc(~"100% -" @v2-dash-pane-link-height);
+ flex-grow: 1;
+ height: 100%;
+ padding-left: 15px;
+ padding-right: 15px;
}
.project-list-sidebar-v2-pane {
- position: absolute;
- bottom: 0;
- height: @v2-dash-pane-link-height;
- background-color: @v2-dash-pane-bg;
+ flex-grow: 0;
+ flex-shrink: 0;
text-align: center;
- display: flex;
- flex-direction: column;
- justify-content: center;
+ background-color: @v2-dash-pane-bg;
color: white;
font-size: 13px;
+ padding: @line-height-computed / 2;
}
.project-list-sidebar-v2-pane a {
@@ -25,3 +30,12 @@
.project-list-sidebar-v2-pane a:hover {
text-decoration: none;
}
+
+ .project-list-sidebar-v2-pane-toggle {
+ color: white;
+ padding: 0;
+ line-height: 1;
+ &:hover, &:active {
+ color: white;
+ }
+ }
diff --git a/services/web/public/stylesheets/components/close.less b/services/web/public/stylesheets/components/close.less
index 9b4e74f2b8..0bb09033ef 100755
--- a/services/web/public/stylesheets/components/close.less
+++ b/services/web/public/stylesheets/components/close.less
@@ -10,7 +10,7 @@
line-height: 1;
color: @close-color;
text-shadow: @close-text-shadow;
- .opacity(.2);
+ .opacity(.4);
&:hover,
&:focus {