Hover effect on the screenshot on dashboard

front/src/css/dashboard.css

@@ -29,6 +29,23 @@
   font-weight: bold;
   margin: 0.5em 0 1em;
 }
+.summary .globalScore .screenshotWrapper:hover {
+  opacity: 0.75;
+}
+.summary .globalScore .screenshotWrapper:hover:after {
+  position: absolute;
+  width: 1.25em;
+  height: 1.25em;
+  top: 0.7em;
+  left: 1.55em;
+  font-size: 3em;
+  color: #FFF;
+  background: #000;
+  border-radius: 0.2em;
+  text-align: center;
+  content: "+";
+  opacity: 0.6;
+}
 .summary .notations {
   display: table;
   width: 80%;

front/src/css/main.css

@@ -146,6 +146,7 @@ h1 span {
   width: 12em;
   height: 6.75em;
   overflow: scroll;
+  position: relative;
 }
 .screenshotWrapper.desktop .screenshotImage {
   width: 100%;

front/src/less/dashboard.less

@@ -32,6 +32,25 @@
         font-weight: bold;
         margin: 0.5em 0 1em;
     }
+
+    .screenshotWrapper:hover {
+        opacity: 0.75;
+
+        &:after {
+            position: absolute;
+            width: 1.25em;
+            height: 1.25em;
+            top: 0.7em;
+            left: 1.55em;
+            font-size: 3em;
+            color: #FFF;
+            background: #000;
+            border-radius: 0.2em;
+            text-align: center;
+            content: "+";
+            opacity: 0.6;
+        }
+    }
 }
 
 .summary .notations {

front/src/less/main.less

@@ -148,6 +148,7 @@ h1 span {
         width: 12em;
         height: 6.75em;
         overflow: scroll;
+        position: relative;
     }
 
     .screenshotImage {