From 022f05a0ef4719132fcd7dc5dc7bbf15b3f7d7a2 Mon Sep 17 00:00:00 2001
From: Stephanie <ststimac@microsoft.com>
Date: Fri, 1 Mar 2019 15:30:57 -0800
Subject: [PATCH] Fix: Color updates and code cleanup

* Update the colors used on the scan results page
because the bulk of the color audit work was done
in the website rep and needed to be updated here
as well.

* Remove old classes and CSS not being used in the
HTML Formatter.

- - - - - - - - - - - -

Ref webhintio/webhint.io#640
Close #1993
---
 .../src/assets/styles/layouts.css             | 78 ------------------
 .../src/assets/styles/scan/scan-results.css   | 81 ++-----------------
 2 files changed, 7 insertions(+), 152 deletions(-)

diff --git a/packages/formatter-html/src/assets/styles/layouts.css b/packages/formatter-html/src/assets/styles/layouts.css
index 87d6797ba2b..dba31346f0f 100644
--- a/packages/formatter-html/src/assets/styles/layouts.css
+++ b/packages/formatter-html/src/assets/styles/layouts.css
@@ -96,81 +96,3 @@
     }
 
 }
-
-/* Fixed sidebar width */
-
-@media (min-width: 48em) {
-
-    [class*="layout--sidebar"] > .module {
-        margin-top: 0;
-    }
-
-    [class*="layout--sidebar"] > .module--primary {
-        width: calc(100% - 26rem);
-    }
-
-    .layout--sidebar--alt > .module--primary {
-        float: left;
-    }
-}
-
-@media (min-width: 64em) {
-
-    [class*="layout--sidebar"] > .module--primary {
-        width: calc(100% - 36rem);
-    }
-
-}
-
-/*
- *	FIFTHS LAYOUT
- *	---------------------------------------------
- */
-
-@media (min-width: 33.75em) and (max-width: 48em) {
-
- 	.layout--fifths .module {
-		width: 50%;
- 	}
-
- 	.layout--fifths .module:nth-child(-n+2) {
-	    margin-top: 0;
-	}
-
-	.layout--fifths .module:nth-child(2n+1) {
-	    clear: left;
-	}
-
-}
-
-@media (min-width: 48em) and (max-width: 64em) {
-
-	.layout--fifths .module {
-		width: 33%;
-	}
-
-	.layout--fifths .module:nth-child(-n+3) {
-		margin-top: 0;
-	}
-
-	.layout--fifths .module:nth-child(3n+1) {
-		clear: left;
-	}
-
-}
-
-@media (min-width: 64em) {
-
-	.layout--fifths .module {
-		width: 20%;
-	}
-
-	.layout--fifths .module:nth-child(-n+5) {
-		margin-top: 0;
-	}
-
-	.layout--fifths .module:nth-child(5n+1) {
-		clear: left;
-	}
-
-}
diff --git a/packages/formatter-html/src/assets/styles/scan/scan-results.css b/packages/formatter-html/src/assets/styles/scan/scan-results.css
index daf4bd5b8f8..21a4fc44c46 100644
--- a/packages/formatter-html/src/assets/styles/scan/scan-results.css
+++ b/packages/formatter-html/src/assets/styles/scan/scan-results.css
@@ -15,17 +15,6 @@
     width: 100%;
 }
 
-.scan-overview__header {
-    background-color: #e6e6e6;
-    padding: 1rem 2rem;
-    word-wrap: break-word;
-}
-
-.scan-overview__header p:first-child {
-    margin-bottom: 1rem;
-    margin-right: 0;
-}
-
 .scan-overview__status {
     background-color: #e6e6e6;
     display: flex;
@@ -62,6 +51,7 @@
 }
 
 @keyframes progressBarAnimation {
+    
     0% {
         background-position: 0% 50%
     }
@@ -71,27 +61,7 @@
     100% {
         background-position: 0% 50%
     }
-}
 
-.analyzing {
-    animation: fade 3s linear infinite;
-}
-
-@keyframes fade {
-    0% {
-        opacity: 0;
-    }
-    50% {
-        opacity: 1;
-    }
-    100% {
-        opacity: 0;
-    }
-}
-
-.scan-overview__header a {
-    font-size: 1.8rem;
-    letter-spacing: .05rem;
 }
 
 .scan-overview--details {
@@ -189,15 +159,6 @@
 }
 
 @media (min-width: 33.75em) {
-    .scan-overview__header {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: space-between;
-    }
-
-    .scan-overview__header a {
-        font-size: 1.8rem;
-    }
 
     .scan-overview--details {
         display: flex;
@@ -234,13 +195,6 @@
     }
 }
 
-@media (min-width: 43.75em) {
-    .scan-overview__header p:first-child {
-        margin-bottom: 0;
-        margin-right: 5rem;
-    }
-}
-
 @media (min-width: 58em) {
     [class*="scan-overview__body--"] {
         font-size: 3.6rem;
@@ -386,6 +340,7 @@ a > .rule-tile:hover {
         max-width: 4rem;
         max-height: 5rem;
     }
+
 }
 
 @media (min-width: 48em) {
@@ -422,6 +377,7 @@ a > .rule-tile:hover {
     .rule-tile--wrapper:first-child {
         border-top: none;
     }
+
 }
 
 @media (min-width: 48em) and (max-width: 82.5em) {
@@ -462,6 +418,7 @@ a > .rule-tile:hover {
     .rule-tile__sub-category {
         font-size: 1.2rem;
     }
+
 }
 
 /* SCAN DETAILS */
@@ -607,12 +564,6 @@ button {
     text-transform: none;
 }
 
-@media(min-width: 33.75em) {
-    a.docs-button {
-        margin-bottom: 0;
-    }
-}
-
 .rule-result--details__body {
     padding: 1.4rem 0;
     margin-left: 3rem;
@@ -633,12 +584,6 @@ button {
     padding: .2rem .4rem;
 }
 
-.error-badge {
-    color: #b91b06;
-    font-size: 1.4rem;
-    padding-left: 3rem;
-}
-
 .rule-result__code {
     background-color: #f4f4f4;
     margin-top: 3rem;
@@ -655,24 +600,10 @@ button {
     hyphens: auto;
 }
 
-.rule-result__code p {
-    padding: 0 0 1.4rem 0;
-}
-
 .rule-result__code code {
     background-color: #f4f4f4;
 }
 
-@media (min-width: 48.75em) {
-    .rule-result--details__header {
-        align-items: center;
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: space-between;
-        margin-bottom: 2.4rem;
-    }
-}
-
 /* RULE RESULT MESSAGES */
 
 .rule-result__message--compiling {
@@ -701,12 +632,14 @@ button {
 /* RESULTS LOADER ANIMATION */
 
 @keyframes spin {
+
     0% {
         transform: rotate(0deg);
     }
     100% {
         transform: rotate(360deg);
     }
+
 }
 
 .rule-result__message--passed {
@@ -740,7 +673,7 @@ button {
 }
 
 .rule-result--details__footer-msg img.axe-logo {
-    width: 10rem;
+    width: 7rem;
 }
 
 /* SCAN QUEUE */