From 4d826771eea68ad64db870d33aff52a2694164d6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20HUBSCHER?= <rhubscher@mozilla.com>
Date: Wed, 18 Jan 2017 19:23:37 +0100
Subject: [PATCH] Improve the lock feedback

---
 popup/hoverpad.css | 19 +++++++++++++++++--
 popup/hoverpad.js  |  1 +
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/popup/hoverpad.css b/popup/hoverpad.css
index 5d4e2ad..b59b357 100644
--- a/popup/hoverpad.css
+++ b/popup/hoverpad.css
@@ -58,11 +58,11 @@ h1 {
 	position: absolute;
 	top: 5px;
 	left: 20px;
-	z-index: 10;
+	z-index: 30;
 	font-size: 20px;
 	font-weight: normal;
 	font-family: sans-serif;
-	color: #bbb;
+	color: #999;
 }
 
 #lock {
@@ -75,6 +75,21 @@ h1 {
 	font-size: 16px;
 }
 
+#lock.locked {
+	display: block;
+	top: 0;
+	left: 0;
+	text-align: center;
+	padding-top: 220px;
+	color: black;
+	font-weight: bold;
+	font-size: 30px;
+	height: 100%;
+	width: 100%;
+	background: #ebb;
+	z-index: 20;
+}
+
 span {
 	position: absolute;
 	bottom: 20px;
diff --git a/popup/hoverpad.js b/popup/hoverpad.js
index 12521b0..f8b1fc1 100644
--- a/popup/hoverpad.js
+++ b/popup/hoverpad.js
@@ -31,6 +31,7 @@ function initialize() {
 
 
 function toggleLock() {
+  lock.classList.toggle('locked');
   if (inputBody.style.display === 'none') {
     inputBody.style.display = '';
     // Put focus at the end of the textarea.