From f4f2fa4e19b3f35ab738ee1030f17028a1438e9c Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 24 Nov 2017 15:33:48 +0000
Subject: [PATCH] Use Overleaf logo as the main menu icon.

---
 .../web/app/views/project/editor/header.pug    |  2 +-
 .../public/img/ol-brand/overleaf-o-white.svg   | 18 ++++++++++++++++++
 .../web/public/stylesheets/app/editor.less     | 10 ++++++++++
 .../public/stylesheets/core/ol-variables.less  |  2 +-
 4 files changed, 30 insertions(+), 2 deletions(-)
 create mode 100644 services/web/public/img/ol-brand/overleaf-o-white.svg

diff --git a/services/web/app/views/project/editor/header.pug b/services/web/app/views/project/editor/header.pug
index 8bd37f707c..4eaae86373 100644
--- a/services/web/app/views/project/editor/header.pug
+++ b/services/web/app/views/project/editor/header.pug
@@ -7,7 +7,7 @@ header.toolbar.toolbar-header.toolbar-with-labels(
 			href,
 			ng-click="ui.leftMenuShown = true;",
 		)
-			i.fa.fa-fw.fa-bars
+			i.fa.fa-fw.fa-bars.editor-menu-icon
 			p.toolbar-label #{translate("menu")}
 		a(
 			href="/project"
diff --git a/services/web/public/img/ol-brand/overleaf-o-white.svg b/services/web/public/img/ol-brand/overleaf-o-white.svg
new file mode 100644
index 0000000000..be896abcc3
--- /dev/null
+++ b/services/web/public/img/ol-brand/overleaf-o-white.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 136 157" style="enable-background:new 0 0 136 157;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+</style>
+<g id="Page-1">
+	<g id="overleaf">
+		<g id="Group">
+			<path id="Fill-1" class="st0" d="M37.2,39.7C14.8,54,0,77.3,0,102.3C0,132.5,24.5,157,54.7,157s54.7-24.5,54.7-54.7
+				c0-23.3-14.6-43.3-35.2-51.1c-4-1.5-12.6-4.2-19.4-3.6C45,53.8,33,66.6,27.4,79.4c8.4-10.1,21.5-14.5,33.2-12.6
+				c17.1,2.8,30.2,17.6,30.2,35.6c0,19.9-16.1,36-36,36c-11,0-20.8-4.9-27.4-12.6c-9.9-11.5-12.4-23.9-10.4-36
+				c6.9-42.4,57.2-66.5,94.6-75.8C99.4,20.5,77.4,31.1,62,42.6c44.9,17.3,52.2-20.5,73.2-37.5C114-3.1,37.3-6.1,37.2,39.7z"/>
+		</g>
+	</g>
+</g>
+</svg>
diff --git a/services/web/public/stylesheets/app/editor.less b/services/web/public/stylesheets/app/editor.less
index 017ea2ecc8..46b85fde26 100644
--- a/services/web/public/stylesheets/app/editor.less
+++ b/services/web/public/stylesheets/app/editor.less
@@ -26,6 +26,16 @@
 	}
 }
 
+.editor-menu-icon when (@is-overleaf = true) {
+	&.fa::before {
+		// Disable the font-awesome icon when in Overleaf by replacing it with a
+		// non-breakable space instead (otherwise the browser would render a 
+		// zero-width element).
+		content: "\00a0"; 
+	}
+	background: url(/img/ol-brand/overleaf-o-white.svg) center / contain no-repeat;
+}
+
 .full-size {
 	position: absolute;
 	top: 0;
diff --git a/services/web/public/stylesheets/core/ol-variables.less b/services/web/public/stylesheets/core/ol-variables.less
index d6d925a8ca..4911a9d2c4 100644
--- a/services/web/public/stylesheets/core/ol-variables.less
+++ b/services/web/public/stylesheets/core/ol-variables.less
@@ -171,7 +171,7 @@
 @toolbar-icon-btn-color         : #FFF;
 @toolbar-icon-btn-hover-color   : #FFF;
 @toolbar-icon-btn-hover-shadow  : none;
-@toolbar-border-bottom          : 0;
+@toolbar-border-bottom          : 1px solid @toolbar-border-color;
 // Editor file-tree
 @file-tree-bg                   : @ol-blue-gray-4;
 @file-tree-item-color           : #FFF;