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/webhintio.github.io#640 Close #1993
webhintio · Mar 1, 2019 · 022f05a · 022f05a
1 parent 2cc07c5
commit 022f05a
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 152 deletions.
diff --git 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
@@ -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 */