From ecd81738cb2e1403e9d54c2876ad24f00e94abaf Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Thu, 24 Nov 2016 15:55:09 +0000
Subject: [PATCH] Restyle toggle.

---
 .../views/project/editor/review-panel.jade    |  5 +++-
 .../stylesheets/app/editor/review-panel.less  | 30 +++----------------
 2 files changed, 8 insertions(+), 27 deletions(-)

diff --git a/services/web/app/views/project/editor/review-panel.jade b/services/web/app/views/project/editor/review-panel.jade
index f50008271a..dbb3a34631 100644
--- a/services/web/app/views/project/editor/review-panel.jade
+++ b/services/web/app/views/project/editor/review-panel.jade
@@ -1,6 +1,9 @@
 #review-panel
 	.review-panel-toolbar
-		span.review-panel-toolbar-label(ng-click="reviewPanel.trackNewChanges = !reviewPanel.trackNewChanges;") Track Changes 
+		span.review-panel-toolbar-label(ng-click="reviewPanel.trackNewChanges = true;", ng-if="reviewPanel.trackNewChanges === false") Track Changes is 
+			strong off
+		span.review-panel-toolbar-label(ng-click="reviewPanel.trackNewChanges = false;", ng-if="reviewPanel.trackNewChanges === true") Track Changes is 
+			strong on
 		review-panel-toggle(ng-model="reviewPanel.trackNewChanges")
 
 	.rp-entry-list(
diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 3a7b2bb838..d14e843591 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -99,7 +99,8 @@
 	.rp-size-expanded & {
 		display: flex;
 		align-items: center;
-		justify-content: center;
+		justify-content: space-between;
+		padding: 0 5px;
 	}
 	.rp-state-current-file & {
 		position: absolute;
@@ -618,33 +619,17 @@
 			border-radius: .875em;
 			transition: background .15s ease, border-color 0.15s ease;
 
-			&::before,
-			&::after {
-				display: block;
-				width: 50%;
-				height: 100%;
-			}
-
 			&::before {
 				content: '';
 				display: block;
+				width: 50%;
+				height: 100%;
 				position: relative;
 				left: 0;
 				background-color: #FFF;
 				border-radius: .875em;
 				transition: background-color 0.15s ease, color 0.15s ease, left 0.15s ease;
 			}
-
-			&::after {
-				content: 'OFF';
-				position: absolute;
-				top: 0;
-				right: 1px;
-				font-size: .75em;
-				font-weight: normal;
-				line-height: 215%;
-				color: #FFF;
-			}
 		}
 
 		&:checked + .rp-toggle-btn {
@@ -655,13 +640,6 @@
 				left: 50%;
 				background-color: #FFF;
 			}
-
-			&::after {
-				content: 'ON';
-				left: 1px;
-				right: auto;
-				color: #FFF;
-			}
 		}
 	}