WEBDIENSTE/YellowLabTools
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add rule about CSS @import (ready for analyze-css 0.7.0)

Browse Source
This commit is contained in:
Gaël Métais
2014-10-23 16:53:32 +02:00
parent 0083fcf0fc
commit 65a4947884
2 changed files with 25 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/node_views/results.html
+15 -1
View File
@@ -283,7 +283,7 @@
<div class="notation">CSS complexity</div>
<div class="criteria">
<div class="table">
<div ng-if="phantomasResults.metrics.cssRules" ng-class="{'warning': phantomasResults.metrics.cssRules > 3000}">
<div ng-if="phantomasResults.metrics.cssRules" ng-class="{'warning': phantomasResults.metrics.cssRules > 4000}">
<div class="label">Rules count</div>
<div class="result">
{{phantomasResults.metrics.cssRules}}
@@ -332,6 +332,20 @@
</modal-dialog>
</div>
</div>
<div ng-if="phantomasResults.metrics.cssImports" class="warning">
<div class="label">Uses of @import</div>
<div class="result">
{{phantomasResults.metrics.cssImports}}
<show-offenders modal-title="Uses of @import" metric-name="cssImports" phantomas-results="phantomasResults"></show-offenders>
</div>
<div class="info">
<div class="icon-question" ng-click="cssImportsTooltip = true"></div>
<modal-dialog show="cssImportsTooltip" dialog-title="Don't use @import">
<p>It’s bad for performance to use @import because CSS files don't get downloaded in parallel.</p>
<p>You should use &lt;link rel='stylesheet' href='a.css'&gt; instead.</p>
</modal-dialog>
</div>
</div>
<div ng-if="phantomasResults.metrics.cssDuplicatedSelectors" ng-class="{'warning': phantomasResults.metrics.cssDuplicatedSelectors > 100}">
<div class="label">Duplicated selectors</div>
<div class="result">
app/public/scripts/resultsCtrl.js
+10 -9
View File
@@ -296,7 +296,7 @@ app.controller('ResultsCtrl', function ($scope) {
var note = 'A';
var score = $scope.phantomasResults.metrics.cssRules +
$scope.phantomasResults.metrics.cssComplexSelectors * 10;
$scope.phantomasResults.metrics.cssComplexSelectors * 5;
if (score > 500) {
note = 'B';
}
@@ -306,10 +306,10 @@ app.controller('ResultsCtrl', function ($scope) {
if (score > 2000) {
note = 'D';
}
if (score > 4500) {
if (score > 4000) {
note = 'E';
}
if (score > 7000) {
if (score > 6000) {
note = 'F';
}
return note;
@@ -330,20 +330,21 @@ app.controller('ResultsCtrl', function ($scope) {
$scope.phantomasResults.metrics.cssOldIEFixes * 10 +
$scope.phantomasResults.metrics.cssOldPropertyPrefixes +
$scope.phantomasResults.metrics.cssUniversalSelectors * 5 +
$scope.phantomasResults.metrics.cssRedundantBodySelectors;
if (score > 20) {
$scope.phantomasResults.metrics.cssRedundantBodySelectors +
$scope.phantomasResults.metrics.cssImports * 50;
if (score > 50) {
note = 'B';
}
if (score > 50) {
if (score > 10) {
note = 'C';
}
if (score > 100) {
if (score > 200) {
note = 'D';
}
if (score > 200) {
if (score > 500) {
note = 'E';
}
if (score > 500) {
if (score > 1000) {
note = 'F';
}
return note;