Merge pull request #256 from ericf/hidden

Add `[hidden]` selector to Base to counteract all `display` declarations

.csslintrc

@@ -1,5 +1,6 @@
 {
     "box-sizing"               : false,
     "display-property-grouping": false,
-    "star-property-hack"       : false
+    "star-property-hack"       : false,
+    "unqualified-attributes"   : false
 }

Gruntfile.js

@@ -21,23 +21,10 @@ grunt.initConfig({
 
     copy: {
         build: {
-            expand : true,
-            flatten: true,
+            src    : 'src/**/css/*.css',
             dest   : 'build/',
-
-            src: [
-                'bower_components/normalize-css/normalize.css',
-                'src/**/css/*.css'
-            ],
-
-            rename: function (dest, src) {
-                // normalize -> base
-                if (src === 'normalize.css') {
-                    src = 'base.css';
-                }
-
-                return path.join(dest, src);
-            }
+            expand : true,
+            flatten: true
         }
     },
 
@@ -46,6 +33,11 @@ grunt.initConfig({
     concat: {
         build: {
             files: [
+                {'build/base.css': [
+                    'bower_components/normalize-css/normalize.css',
+                    'build/base.css'
+                ]},
+
                 {'build/buttons.css': [
                     'build/buttons-core.css',
                     'build/buttons.css'
@@ -85,18 +77,18 @@ grunt.initConfig({
 
                 {'build/<%= pkg.name %>.css': [
                     'build/base.css',
+                    'build/grids.css',
                     'build/buttons.css',
                     'build/forms.css',
-                    'build/grids.css',
                     'build/menus.css',
                     'build/tables.css'
                 ]},
 
                 {'build/<%= pkg.name %>-nr.css': [
                     'build/base.css',
+                    'build/grids-nr.css',
                     'build/buttons.css',
                     'build/forms-nr.css',
-                    'build/grids-nr.css',
                     'build/menus-nr.css',
                     'build/tables.css'
                 ]}
@@ -111,9 +103,12 @@ grunt.initConfig({
             csslintrc: '.csslintrc'
         },
 
-        src: {
-            src: 'src/**/css/*.css'
-        }
+        base   : ['src/base/css/*.css'],
+        buttons: ['src/buttons/css/*.css'],
+        forms  : ['src/forms/css/*.css'],
+        grids  : ['src/grids/css/*.css'],
+        menus  : ['src/menus/css/*.css'],
+        tables : ['src/tables/css/*.css']
     },
 
     // -- CSSMin Config --------------------------------------------------------
@@ -239,10 +234,10 @@ grunt.registerTask('test', ['csslint']);
 grunt.registerTask('build', [
     'clean:build',
     'copy:build',
-    'css_selectors:base',
     'grid_units',
     'concat:build',
     'clean:build_res',
+    'css_selectors:base',
     'cssmin',
     'license'
 ]);

HISTORY.md

@@ -6,8 +6,17 @@ NEXT
 
 ### Base
 
-* The `body` selector in the `base-context` module is now replaced with `.pure`,
-  like the `html` selector.
+* Elements that have Pure classnames which set a `display` declaration _and_ use
+  the `hidden` HTML attribute will now properly be hidden. With these changes,
+  the following button will be hidden from view:
+
+    ```html
+    <button class="pure-button" hidden>No showy</button>
+    ```
+
+  A new rule for the `[hidden]` selector has been added with the declaration:
+  `display: none !important;`. This is a time where it's appropriate for a
+  project like Pure to use `!important`. ([#177][])
 
 ### Buttons
 
@@ -47,6 +56,7 @@ NEXT
 [#144]: https://github.com/yui/pure/issues/144
 [#164]: https://github.com/yui/pure/issues/164
 [#174]: https://github.com/yui/pure/issues/174
+[#177]: https://github.com/yui/pure/issues/177
 [#191]: https://github.com/yui/pure/issues/191
 [#200]: https://github.com/yui/pure/issues/200
 [#221]: https://github.com/yui/pure/issues/221

src/base/css/base.css

@@ -0,0 +1,17 @@
+/*csslint important:false*/
+
+/* ==========================================================================
+   Pure Base Extras
+   ========================================================================== */
+
+/**
+ * Extra rules that Pure adds on top of Normalize.css
+ */
+
+/**
+ * Always hide an element when it has the `hidden` HTML attribute.
+ */
+
+[hidden] {
+    display: none !important;
+}

src/buttons/css/buttons.css

@@ -1,4 +1,4 @@
-/*csslint unqualified-attributes:false, outline-none:false*/
+/*csslint outline-none:false*/
 
 .pure-button {
     font-family: inherit;