Merge pull request #1106 from mozilla/vnext-hover-states

Fix #1103

app/main.css

@@ -132,6 +132,14 @@ a {
   flex-shrink: 0;
 }
 
+.delete:hover {
+  opacity: 0.7;
+}
+
+footer li:hover {
+  text-decoration: underline;
+}
+
 #password-msg::after {
   content: '\200b';
 }

app/ui/archiveTile.js

@@ -177,7 +177,7 @@ module.exports = function(state, emit, archive) {
       <img class="float-left mr-3" src="${assets.get('blue_file.svg')}"/>
       <input
         type="image"
-        class="float-right self-center text-white"
+        class="float-right self-center text-white delete"
         alt="Delete"
         src="${assets.get('close-16.svg')}"
         onclick=${del}/>
@@ -292,7 +292,7 @@ module.exports.wip = function(state, emit) {
     return html`
       <input
         type="image"
-        class="self-center text-white ml-4"
+        class="self-center text-white ml-4 delete"
         alt="Delete"
         src="${assets.get('close-16.svg')}"
         onclick="${del}"

app/ui/signupDialog.js

@@ -36,7 +36,7 @@ module.exports = function() {
         ${state.translate('signInMenuOption')}
       </label>
       <button
-        class="my-4 text-blue font-medium"
+        class="my-4 text-blue hover:text-blue-dark focus:text-blue-darker font-medium"
         title="${state.translate('deletePopupCancel')}"
         onclick=${close}>${state.translate('deletePopupCancel')}
       </button>