From 926fd69bb536d85360721943d675bd2cd8a47c57 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 24 Nov 2017 15:53:49 +0000
Subject: [PATCH] Use resizer icons in Overleaf, to switch the PDF layout.

---
 services/web/app/views/project/editor/pdf.pug |  2 ++
 .../public/stylesheets/app/editor/pdf.less    | 28 +++++++++++++++++--
 2 files changed, 28 insertions(+), 2 deletions(-)

diff --git a/services/web/app/views/project/editor/pdf.pug b/services/web/app/views/project/editor/pdf.pug
index 5bb2d5173a..a3b3a2e2f9 100644
--- a/services/web/app/views/project/editor/pdf.pug
+++ b/services/web/app/views/project/editor/pdf.pug
@@ -102,6 +102,7 @@ div.full-size.pdf(ng-controller="PdfController")
 				tooltip-placement="bottom"
 				tooltip-append-to-body="true"
 			)
+				i.fa.fa-expand
 				i.full-screen
 			a(
 				href,
@@ -111,6 +112,7 @@ div.full-size.pdf(ng-controller="PdfController")
 				tooltip-placement="bottom"
 				tooltip-append-to-body="true"
 			)
+				i.fa.fa-compress
 				i.split-screen
 				i.split-screen
 	// end of toolbar
diff --git a/services/web/public/stylesheets/app/editor/pdf.less b/services/web/public/stylesheets/app/editor/pdf.less
index edf0846bee..58d8a9427b 100644
--- a/services/web/public/stylesheets/app/editor/pdf.less
+++ b/services/web/public/stylesheets/app/editor/pdf.less
@@ -41,6 +41,17 @@
 	.btn-info;
 }
 
+.btn-split-screen when (@is-overleaf = false) {
+	.fa {
+		display: none;
+	}
+}
+.btn-split-screen when (@is-overleaf = true) {
+	.fa {
+		display: none;
+	}
+}
+
 .pdf-viewer {
 	iframe {
 		width: 100%;
@@ -112,28 +123,41 @@
 	.toolbar-right {
 		a {
 			&:hover {
-				i {
+				i when (@is-overleaf = false) {
 					box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.25);
 					border-color: @gray-dark;
 				}
 			}
-			i {
+			i when (@is-overleaf = false) {
 				display: inline-block;
 				width: 16px;
 				height: 16px;
 				border: 1px solid @gray-light;
 				margin-top: 5px;
 			}
+
 			i.full-screen {
 				border-top-width: 3px;
 				border-radius: 2px;
 			}
+
+			i.full-screen when (@is-overleaf = true) {
+				display: none;
+			}
 			i.split-screen {
 				width: 7px;
 				border-top-width: 3px;
 				border-radius: 2px;
 				margin-left: 2px;
 			}
+
+			i.split-screen when (@is-overleaf = true) {
+				display: none;
+			}
+
+			i.fa when (@is-overleaf = false) {
+				display: none;
+			}
 		}
 	}
 }