diff --git a/app/node_views/results.html b/app/node_views/results.html index 27e30e7..89d30c2 100644 --- a/app/node_views/results.html +++ b/app/node_views/results.html @@ -44,238 +44,383 @@
{{notations.domComplexity}}
DOM complexity
- +
+
+
DOM elements count
+
{{phantomasResults.metrics.DOMelementsCount}}
+
+
+
+
DOM max depth
+
+ {{phantomasResults.metrics.DOMelementMaxDepth}} + +
+
+
+
+
Number of iframes
+
{{phantomasResults.metrics.iframesCount}}
+
+
+
+
IDs duplicated
+
+ {{phantomasResults.metrics.DOMidDuplicated}} + +
+
+
+
{{notations.domManipulations}}
DOM read and write
- +
+
+
DOM inserts
+
+ {{phantomasResults.metrics.DOMinserts}} + +
+
+
+
+
DOM queries
+
{{phantomasResults.metrics.DOMqueries}}
+
+
+
+
Time they took
+
{{totalJSTime}} ms
+
+
+
{{notations.duplicatedDomQueries}}
Duplicated DOM queries
- +
+
+
Avoidable queries
+
+ {{duplicatedQueriesCountAll}} + +
+
+
+
{{notations.eventsBound}}
Events bound
- +
+
+
Events bound
+
+ {{phantomasResults.metrics.eventsBound}} + +
+
+
+
{{notations.jsBadPractices}}
Bad Javascript
- +
+
+
Javascript errors
+
+ {{phantomasResults.metrics.jsErrors}} + +
+
+
+
+
eval calls
+
{{phantomasResults.metrics.evalCalls}}
+
+
+
+
document.write calls
+
{{phantomasResults.metrics.documentWriteCalls}}
+
+
+
+
Console messages
+
{{phantomasResults.metrics.consoleMessages}}
+
+
+
+
Global variables
+
+ {{phantomasResults.metrics.globalVariables}} + +
+
+
+
{{notations.jQueryLoading}}
jQuery version
- +
+
+
jQuery version
+
{{phantomasResults.metrics.jQueryVersion}}
+
+
+
+
{{phantomasResults.metrics.jQueryDifferentVersions}} versions loaded
+
{{version}} &
+
+
+
{{notations.cssComplexity}}
CSS complexity
- +
+
+
Rules count
+
{{phantomasResults.metrics.cssRules}}
+
+
+
+
Complex selectors
+
+ {{phantomasResults.metrics.cssComplexSelectors}} + +
+
+
+
{{notations.badCss}}
Bad CSS
- +
+
+
Duplicated selectors
+
+ {{phantomasResults.metrics.cssDuplicatedSelectors}} + +
+
+
+
+
Empty rules
+
+ {{phantomasResults.metrics.cssEmptyRules}} + +
+
+
+
+
CSS expressions
+
+ {{phantomasResults.metrics.cssExpressions}} + +
+
+
+
+
Uses of !important
+
+ {{phantomasResults.metrics.cssImportants}} + +
+
+
+
+
Old IE fixes
+
+ {{phantomasResults.metrics.cssOldIEFixes}} + +
+
+
+
+
Old prefixes
+
+ {{phantomasResults.metrics.cssOldPropertyPrefixes}} + +
+
+
+
+
Universal selectors
+
+ {{phantomasResults.metrics.cssUniversalSelectors}} + +
+
+
+
+
Redundant body selectors
+
+ {{phantomasResults.metrics.cssRedundantBodySelectors}} + +
+
+
+
{{notations.requests}}
Requests number
- +
+
+
Total requests
+
{{phantomasResults.metrics.requests}}
+
+
+
+
Documents
+
+ {{phantomasResults.metrics.htmlCount}} + +
+
+
+
+
Scripts
+
+ {{phantomasResults.metrics.jsCount}} + +
+
+
+
+
Stylesheets
+
+ {{phantomasResults.metrics.cssCount}} + +
+
+
+
+
Images
+
+ {{phantomasResults.metrics.imageCount}} + +
+
+
+
+
Fonts
+
+ {{phantomasResults.metrics.webfontCount}} + +
+
+
+
+
Videos
+
+ {{phantomasResults.metrics.videoCount}} + +
+
+
+
+
JSON
+
+ {{phantomasResults.metrics.jsonCount}} + +
+
+
+
+
Other
+
+ {{phantomasResults.metrics.otherCount}} + +
+
+
+
{{notations.network}}
Network
- +
+
+
404 not found
+
+ {{phantomasResults.metrics.otherCount}} + +
+
+
+
+
Connections closed
+
+ {{phantomasResults.metrics.otherCount}} + +
+
+
+
+
Duplicated requests
+
+ {{phantomasResults.metrics.otherCount}} + +
+
+
+
+
Caching disabled
+
+ {{phantomasResults.metrics.otherCount}} + +
+
+
+
+
Caching not specified
+
+ {{phantomasResults.metrics.otherCount}} + +
+
+
+
+
Caching too short
+
+ {{phantomasResults.metrics.otherCount}} + +
+
+
+
+
Different domains
+
+ {{phantomasResults.metrics.otherCount}} + +
+
+
+
diff --git a/app/public/styles/less/results.less b/app/public/styles/less/results.less index 3f61da4..75868e8 100644 --- a/app/public/styles/less/results.less +++ b/app/public/styles/less/results.less @@ -67,15 +67,9 @@ h4 { .notations { display: table; - width: 40em; - margin-left: 6em; - border-spacing: 0.5em; -} -@media screen and (max-width: 800px) { - .notations { - width: 30em; - margin-left: 0; - } + width: 90%; + margin: 0 10%; + border-spacing: 1em; } .notations > div { display: table-row; @@ -90,7 +84,6 @@ h4 { text-align: center; } .notations .criteria { - padding-top: 0.9em; font-weight: normal; } .notations .A, .notations .B, .notations .C, .notations .D, .notations .E, .notations .F, .notations .NA { @@ -133,6 +126,25 @@ h4 { cursor: pointer; } +.notations .criteria .table { + width: 75%; +} +.notations .criteria .label { + width: 70%; +} +.notations .criteria .result { + width: 20%; + font-weight: bold; + white-space: nowrap; + text-align: center; +} +.notations .criteria .icon-question { + width: 10%; + text-align: center; + color: #f1c40f; + cursor: pointer; +} + .timeline { margin: 2em 0 5em; @@ -420,6 +432,7 @@ input.textFilter { left: 0; width: 100%; height: 100%; + text-align: left; } .ng-modal-overlay { position: absolute; @@ -448,8 +461,9 @@ input.textFilter { overflow-x: hidden; overflow-y: scroll; word-wrap: break-word; - /*height: calc(~"100% - 47px");*/ max-height: 20em; + font-weight: normal; + white-space: normal; } .ng-modal-close { position: absolute; diff --git a/app/public/styles/results.css b/app/public/styles/results.css index 83425d1..5289a8d 100644 --- a/app/public/styles/results.css +++ b/app/public/styles/results.css @@ -51,15 +51,9 @@ h4 { } .notations { display: table; - width: 40em; - margin-left: 6em; - border-spacing: 0.5em; -} -@media screen and (max-width: 800px) { - .notations { - width: 30em; - margin-left: 0; - } + width: 90%; + margin: 0 10%; + border-spacing: 1em; } .notations > div { display: table-row; @@ -74,7 +68,6 @@ h4 { text-align: center; } .notations .criteria { - padding-top: 0.9em; font-weight: normal; } .notations .A, @@ -122,6 +115,24 @@ h4 { color: #9c4274; cursor: pointer; } +.notations .criteria .table { + width: 75%; +} +.notations .criteria .label { + width: 70%; +} +.notations .criteria .result { + width: 20%; + font-weight: bold; + white-space: nowrap; + text-align: center; +} +.notations .criteria .icon-question { + width: 10%; + text-align: center; + color: #f1c40f; + cursor: pointer; +} .timeline { margin: 2em 0 5em; } @@ -388,6 +399,7 @@ input.textFilter { left: 0; width: 100%; height: 100%; + text-align: left; } .ng-modal-overlay { position: absolute; @@ -416,8 +428,9 @@ input.textFilter { overflow-x: hidden; overflow-y: scroll; word-wrap: break-word; - /*height: calc(~"100% - 47px");*/ max-height: 20em; + font-weight: normal; + white-space: normal; } .ng-modal-close { position: absolute;