Fixes #346 - overriding !important by !important which is less understandable.

diff --git a/History.md b/History.md
index 49fe1eb..dd9154c 100644 (file)
--- a/History.md
+++ b/History.md
@@ -6,6 +6,7 @@
 [2.2.15 / 2014-xx-xx](https://github.com/jakubpawlowicz/clean-css/compare/v2.2.14...v2.2.15)
 ==================
 
+* Fixed issue [#346](https://github.com/GoalSmashers/clean-css/issues/346) - overriding !important by !important.
 * Fixed issue [#345](https://github.com/GoalSmashers/clean-css/issues/345) - URL rebasing for document relative ones.
 * Fixed issue [#343](https://github.com/GoalSmashers/clean-css/issues/343) - too aggressive rgba/hsla minification.
 

diff --git a/lib/properties/override-compactor.js b/lib/properties/override-compactor.js
index 5eaf4ec..7c6186c 100644 (file)
--- a/lib/properties/override-compactor.js
+++ b/lib/properties/override-compactor.js
@@ -1,6 +1,8 @@
 
 // Compacts the given tokens according to their ability to override each other.
 
+var validator = require('./validator');
+
 module.exports = (function () {
   // Default override function: only allow overrides when the two values are the same
   var sameValue = function (val1, val2) {
@@ -116,6 +118,8 @@ module.exports = (function () {
         } else if (t.prop !== token.prop || !can(t.value, token.value)) {
           // in every other case, use the override mechanism
           result.push(t);
+        } else if (t.isImportant && token.isImportant && (validator.isValidFunction(t.value) ^ validator.isValidFunction(token.value))) {
+          result.push(t);
         }
       }
       if (removeSelf) {

diff --git a/test/unit-test.js b/test/unit-test.js
index 42b14fa..c1ab439 100644 (file)
--- a/test/unit-test.js
+++ b/test/unit-test.js
@@ -1530,6 +1530,8 @@ title']{display:block}",
       'a{display:inline-block!important;color:red;display:block!important}',
       'a{color:red;display:block!important}'
     ],
+    'of two properties in one declaration with both as !important but 2nd less understandable': 'a{color:red!important;display:block;color:rgba(0,255,0,.5)!important}',
+    'of two properties in one declaration with both as !important but 2nd more understandable': 'a{color:rgba(0,255,0,.5)!important;display:block;color:red!important}',
     'of many properties in one declaration': [
       'a{display:inline-block;color:red;font-weight:bolder;font-weight:700;display:block!important;color:#fff}',
       'a{font-weight:bolder;font-weight:700;display:block!important;color:#fff}'