Adds #1535, box-sizing now inherits. removes from site.less (now only in reset)

RELEASE-NOTES.md

@@ -1,13 +1,14 @@
 ## RELEASE NOTES
 
 
-### Version 1.5.0 - December 23, 2014
+### Version 1.5.0 - December 30, 2014
 
 **Critical Bugs**
 - Concatenated ``dist/`` release included duplicate components when no component array specified. Added default components to ``tasks/default.js`` to allay issues
 
 **Enhancements*
 - **Dropdown** - New setting ``allowCategorySelection`` lets menu items with sub menus be selected. Added example in docs.
+- **Reset** - Reset now inherits ``box-sizing`` [from html tag](http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/)
 - **Label** - ``ui ribbon label`` can now appear on the right side of content when specifying ``ui right ribbon label``
 - **Checkbox** - Checkboxes now can handle labels with multiple lines of text
 - **Progress** - Progress bars now display all intermediary percentage values when animating. Improved performance when progress bar is rapidly updated.

dist/components/checkbox.css

@@ -23,7 +23,7 @@
 .ui.checkbox {
   position: relative;
   display: inline-block;
-  height: 17px;
+  min-height: 17px;
   font-size: 1rem;
   line-height: 15px;
   min-width: 17px;
@@ -201,7 +201,7 @@
 ---------------*/
 
 .ui.radio.checkbox {
-  height: 14px;
+  min-height: 14px;
 }
 
 /* Box */
@@ -247,7 +247,7 @@
 
 .ui.slider.checkbox {
   cursor: pointer;
-  height: 1.25rem;
+  min-height: 1.25rem;
 }
 .ui.slider.checkbox .box,
 .ui.slider.checkbox label {
@@ -342,15 +342,17 @@
 
 .ui.toggle.checkbox {
   cursor: pointer;
-  height: 1.5rem;
+  min-height: 1.5rem;
 }
 .ui.toggle.checkbox .box,
 .ui.toggle.checkbox label {
-  height: 1.5rem;
+  min-height: 1.5rem;
   padding-left: 4.5rem;
-  line-height: 1.5rem;
   color: rgba(0, 0, 0, 0.8);
 }
+.ui.toggle.checkbox label {
+  padding-top: 0.15em;
+}
 
 /* Switch */
 .ui.toggle.checkbox .box:before,

dist/components/dropdown.js

@@ -1496,21 +1496,21 @@ $.fn.dropdown = function(parameters) {
 
 $.fn.dropdown.settings = {
 
-  debug              : false,
-  verbose            : true,
-  performance        : true,
+  debug                  : false,
+  verbose                : true,
+  performance            : true,
 
-  on                 : 'click',
-  action             : 'activate',
+  on                     : 'click',
+  action                 : 'activate',
 
-  allowTab           : true,
-  fullTextSearch     : false,
-  preserveHTML       : true,
-  sortSelect         : false,
+  allowTab               : true,
+  fullTextSearch         : false,
+  preserveHTML           : true,
+  sortSelect             : false,
 
   allowCategorySelection : false,
 
-  delay          : {
+  delay                  : {
     hide   : 300,
     show   : 200,
     search : 50,

dist/components/grid.css

@@ -1564,14 +1564,10 @@
   .ui.stackable.grid {
     display: block !important;
     width: auto;
-    margin-left: -1rem !important;
-    margin-right: -1rem !important;
+    margin-left: 0em !important;
+    margin-right: 0em !important;
     padding: 0em;
   }
-  .ui.stackable.padded.grid:not(.vertically) {
-    margin-left: -1rem !important;
-    margin-right: -1rem !important;
-  }
   .ui.stackable.grid > .row > .wide.column,
   .ui.stackable.grid > .wide.column,
   .ui.stackable.grid > .column.grid > .column,
@@ -1581,44 +1577,44 @@
     display: block !important;
     width: auto !important;
     margin: 0em 0em !important;
-    padding: 1rem 2rem !important;
     box-shadow: none !important;
+    padding: 1rem 1rem !important;
   }
   .ui.stackable.grid > .row {
     margin: 0em;
     padding: 0em;
   }
   .ui.stackable.grid .column > .ui.stackable.grid {
-    margin-left: -2rem !important;
-    margin-right: -2rem !important;
-  }
-  .ui.stackable.celled.grid > .column:not(.row),
-  .ui.stackable.divided.grid > .column:not(.row),
-  .ui.stackable.celled.grid > .row > .column,
-  .ui.stackable.divided.grid > .row > .column {
-    border-top: 1px solid rgba(39, 41, 43, 0.15);
-    box-shadow: none !important;
+    margin-left: -1rem !important;
+    margin-right: -1rem !important;
   }
-  .ui.inverted.stackable.celled.grid > .column:not(.row),
-  .ui.inverted.stackable.divided.grid > .column:not(.row),
-  .ui.inverted.stackable.celled.grid > .row > .column,
-  .ui.inverted.stackable.divided.grid > .row > .column {
-    border-top: 1px solid rgba(255, 255, 255, 0.2);
+  
+/* Equal Height Stackable */
+  .ui[class*="equal height"].stackable.page.grid {
+    display: block !important;
   }
+  
+/* Divided Stackable */
   .ui.stackable.divided.grid > .row:first-child > .column:first-child,
   .ui.stackable.celled.grid > .row:first-child > .column:first-child,
   .ui.stackable.divided.grid > .column:not(.row):first-child,
   .ui.stackable.celled.grid > .column:not(.row):first-child {
     border-top: none !important;
   }
-  .ui[class*="equal height"].stackable.page.grid {
-    display: block !important;
-    width: 100% !important;
+  .ui.inverted.stackable.celled.grid > .column:not(.row),
+  .ui.inverted.stackable.divided.grid > .column:not(.row),
+  .ui.inverted.stackable.celled.grid > .row > .column,
+  .ui.inverted.stackable.divided.grid > .row > .column {
+    border-top: 1px solid rgba(255, 255, 255, 0.2);
   }
-  
-/* Remove pointers from vertical menus */
-  .ui.stackable.grid .vertical.pointing.menu .item:after {
-    display: none;
+  .ui.stackable.celled.grid > .column:not(.row),
+  .ui.stackable.divided.grid > .column:not(.row),
+  .ui.stackable.celled.grid > .row > .column,
+  .ui.stackable.divided.grid > .row > .column {
+    border-top: 1px solid rgba(39, 41, 43, 0.15);
+    box-shadow: none !important;
+    padding-top: 2rem !important;
+    padding-bottom: 2rem !important;
   }
 }
 

dist/components/list.css

@@ -86,8 +86,8 @@ ol.ui.list ol,
 }
 
 /* Icon */
-.ui.list .list > .item > .icon,
-.ui.list > .item > .icon {
+.ui.list .list > .item > i.icon,
+.ui.list > .item > i.icon {
   display: table-cell;
   margin: 0em;
   padding-top: 0.1rem;
@@ -96,12 +96,12 @@ ol.ui.list ol,
   -webkit-transition: color 0.2s ease;
           transition: color 0.2s ease;
 }
-.ui.list .list > .item [class*="top aligned"].icon,
-.ui.list > .item > [class*="top aligned"].icon {
+.ui.list .list > .item [class*="top aligned"]i.icon,
+.ui.list > .item > [class*="top aligned"]i.icon {
   vertical-align: top;
 }
-.ui.list .list > .item > .icon:only-child,
-.ui.list > .item > .icon:only-child {
+.ui.list .list > .item > i.icon:only-child,
+.ui.list > .item > i.icon:only-child {
   display: inline-block;
   vertical-align: top;
 }
@@ -177,8 +177,8 @@ ol.ui.list ol,
 }
 
 /* Linked Item Icons */
-.ui.list .list > a.item .icon,
-.ui.list > a.item .icon {
+.ui.list .list > a.item i.icon,
+.ui.list > a.item i.icon {
   color: rgba(0, 0, 0, 0.4);
 }
 
@@ -282,7 +282,7 @@ ol.ui.list ol,
 }
 
 /* Horizontal List */
-.ui.horizontal.list > .item > .icon {
+.ui.horizontal.list > .item > i.icon {
   margin: 0em;
   padding: 0em 0.25em 0em 0em;
 }

dist/components/menu.css

@@ -1424,13 +1424,14 @@
 .ui.menu.fixed .item:last-child {
   border-radius: 0px !important;
 }
-.ui.menu.fixed.top {
+.ui.fixed.menu,
+.ui.top.fixed.menu {
   top: 0px;
   left: 0px;
   right: auto;
   bottom: auto;
 }
-.ui.menu.fixed.right {
+.ui.right.fixed.menu {
   top: 0px;
   right: 0px;
   left: auto;
@@ -1438,13 +1439,13 @@
   width: auto;
   height: 100%;
 }
-.ui.menu.fixed.bottom {
+.ui.bottom.fixed.menu {
   bottom: 0px;
   left: 0px;
   top: auto;
   right: auto;
 }
-.ui.menu.fixed.left {
+.ui.left.fixed.menu {
   top: 0px;
   left: 0px;
   right: auto;

dist/components/tab.js

@@ -37,9 +37,6 @@ $.fn.tab = function(parameters) {
     returnedValue
   ;
 
-  console.log(arguments);
-
-
   $allModules
     .each(function() {
       var

dist/semantic.css

@@ -10048,8 +10048,8 @@ ol.ui.list ol,
 
 /* Icon */
 
-.ui.list .list > .item > .icon,
-.ui.list > .item > .icon {
+.ui.list .list > .item > i.icon,
+.ui.list > .item > i.icon {
   display: table-cell;
   margin: 0em;
   padding-top: 0.1rem;
@@ -10059,13 +10059,13 @@ ol.ui.list ol,
   transition: color 0.2s ease;
 }
 
-.ui.list .list > .item [class*="top aligned"].icon,
-.ui.list > .item > [class*="top aligned"].icon {
+.ui.list .list > .item [class*="top aligned"]i.icon,
+.ui.list > .item > [class*="top aligned"]i.icon {
   vertical-align: top;
 }
 
-.ui.list .list > .item > .icon:only-child,
-.ui.list > .item > .icon:only-child {
+.ui.list .list > .item > i.icon:only-child,
+.ui.list > .item > i.icon:only-child {
   display: inline-block;
   vertical-align: top;
 }
@@ -10154,8 +10154,8 @@ ol.ui.list ol,
 
 /* Linked Item Icons */
 
-.ui.list .list > a.item .icon,
-.ui.list > a.item .icon {
+.ui.list .list > a.item i.icon,
+.ui.list > a.item i.icon {
   color: rgba(0, 0, 0, 0.4);
 }
 
@@ -10270,7 +10270,7 @@ ol.ui.list ol,
 
 /* Horizontal List */
 
-.ui.horizontal.list > .item > .icon {
+.ui.horizontal.list > .item > i.icon {
   margin: 0em;
   padding: 0em 0.25em 0em 0em;
 }
@@ -15696,16 +15696,11 @@ ol.ui.horizontal.list li:before,
   .ui.stackable.grid {
     display: block !important;
     width: auto;
-    margin-left: -1rem !important;
-    margin-right: -1rem !important;
+    margin-left: 0em !important;
+    margin-right: 0em !important;
     padding: 0em;
   }
 
-  .ui.stackable.padded.grid:not(.vertically) {
-    margin-left: -1rem !important;
-    margin-right: -1rem !important;
-  }
-
   .ui.stackable.grid > .row > .wide.column,
   .ui.stackable.grid > .wide.column,
   .ui.stackable.grid > .column.grid > .column,
@@ -15715,8 +15710,8 @@ ol.ui.horizontal.list li:before,
     display: block !important;
     width: auto !important;
     margin: 0em 0em !important;
-    padding: 1rem 2rem !important;
     box-shadow: none !important;
+    padding: 1rem 1rem !important;
   }
 
   .ui.stackable.grid > .row {
@@ -15725,25 +15720,18 @@ ol.ui.horizontal.list li:before,
   }
 
   .ui.stackable.grid .column > .ui.stackable.grid {
-    margin-left: -2rem !important;
-    margin-right: -2rem !important;
+    margin-left: -1rem !important;
+    margin-right: -1rem !important;
   }
 
-  .ui.stackable.celled.grid > .column:not(.row),
-  .ui.stackable.divided.grid > .column:not(.row),
-  .ui.stackable.celled.grid > .row > .column,
-  .ui.stackable.divided.grid > .row > .column {
-    border-top: 1px solid rgba(39, 41, 43, 0.15);
-    box-shadow: none !important;
-  }
+  /* Equal Height Stackable */
 
-  .ui.inverted.stackable.celled.grid > .column:not(.row),
-  .ui.inverted.stackable.divided.grid > .column:not(.row),
-  .ui.inverted.stackable.celled.grid > .row > .column,
-  .ui.inverted.stackable.divided.grid > .row > .column {
-    border-top: 1px solid rgba(255, 255, 255, 0.2);
+  .ui[class*="equal height"].stackable.page.grid {
+    display: block !important;
   }
 
+  /* Divided Stackable */
+
   .ui.stackable.divided.grid > .row:first-child > .column:first-child,
   .ui.stackable.celled.grid > .row:first-child > .column:first-child,
   .ui.stackable.divided.grid > .column:not(.row):first-child,
@@ -15751,15 +15739,21 @@ ol.ui.horizontal.list li:before,
     border-top: none !important;
   }
 
-  .ui[class*="equal height"].stackable.page.grid {
-    display: block !important;
-    width: 100% !important;
+  .ui.inverted.stackable.celled.grid > .column:not(.row),
+  .ui.inverted.stackable.divided.grid > .column:not(.row),
+  .ui.inverted.stackable.celled.grid > .row > .column,
+  .ui.inverted.stackable.divided.grid > .row > .column {
+    border-top: 1px solid rgba(255, 255, 255, 0.2);
   }
 
-  /* Remove pointers from vertical menus */
-
-  .ui.stackable.grid .vertical.pointing.menu .item:after {
-    display: none;
+  .ui.stackable.celled.grid > .column:not(.row),
+  .ui.stackable.divided.grid > .column:not(.row),
+  .ui.stackable.celled.grid > .row > .column,
+  .ui.stackable.divided.grid > .row > .column {
+    border-top: 1px solid rgba(39, 41, 43, 0.15);
+    box-shadow: none !important;
+    padding-top: 2rem !important;
+    padding-bottom: 2rem !important;
   }
 }
 
@@ -17429,14 +17423,15 @@ ol.ui.horizontal.list li:before,
   border-radius: 0px !important;
 }
 
-.ui.menu.fixed.top {
+.ui.fixed.menu,
+.ui.top.fixed.menu {
   top: 0px;
   left: 0px;
   right: auto;
   bottom: auto;
 }
 
-.ui.menu.fixed.right {
+.ui.right.fixed.menu {
   top: 0px;
   right: 0px;
   left: auto;
@@ -17445,14 +17440,14 @@ ol.ui.horizontal.list li:before,
   height: 100%;
 }
 
-.ui.menu.fixed.bottom {
+.ui.bottom.fixed.menu {
   bottom: 0px;
   left: 0px;
   top: auto;
   right: auto;
 }
 
-.ui.menu.fixed.left {
+.ui.left.fixed.menu {
   top: 0px;
   left: 0px;
   right: auto;
@@ -22137,7 +22132,7 @@ a.ui.card:hover,
 .ui.checkbox {
   position: relative;
   display: inline-block;
-  height: 17px;
+  min-height: 17px;
   font-size: 1rem;
   line-height: 15px;
   min-width: 17px;
@@ -22318,7 +22313,7 @@ a.ui.card:hover,
 ---------------*/
 
 .ui.radio.checkbox {
-  height: 14px;
+  min-height: 14px;
 }
 
 /* Box */
@@ -22367,7 +22362,7 @@ a.ui.card:hover,
 
 .ui.slider.checkbox {
   cursor: pointer;
-  height: 1.25rem;
+  min-height: 1.25rem;
 }
 
 .ui.slider.checkbox .box,
@@ -22467,17 +22462,20 @@ a.ui.card:hover,
 
 .ui.toggle.checkbox {
   cursor: pointer;
-  height: 1.5rem;
+  min-height: 1.5rem;
 }
 
 .ui.toggle.checkbox .box,
 .ui.toggle.checkbox label {
-  height: 1.5rem;
+  min-height: 1.5rem;
   padding-left: 4.5rem;
-  line-height: 1.5rem;
   color: rgba(0, 0, 0, 0.8);
 }
 
+.ui.toggle.checkbox label {
+  padding-top: 0.15em;
+}
+
 /* Switch */
 
 .ui.toggle.checkbox .box:before,

dist/semantic.js

@@ -4457,21 +4457,21 @@ $.fn.dropdown = function(parameters) {
 
 $.fn.dropdown.settings = {
 
-  debug              : false,
-  verbose            : true,
-  performance        : true,
+  debug                  : false,
+  verbose                : true,
+  performance            : true,
 
-  on                 : 'click',
-  action             : 'activate',
+  on                     : 'click',
+  action                 : 'activate',
 
-  allowTab           : true,
-  fullTextSearch     : false,
-  preserveHTML       : true,
-  sortSelect         : false,
+  allowTab               : true,
+  fullTextSearch         : false,
+  preserveHTML           : true,
+  sortSelect             : false,
 
   allowCategorySelection : false,
 
-  delay          : {
+  delay                  : {
     hide   : 300,
     show   : 200,
     search : 50,
@@ -11862,9 +11862,6 @@ $.fn.tab = function(parameters) {
     returnedValue
   ;
 
-  console.log(arguments);
-
-
   $allModules
     .each(function() {
       var

package.json

@@ -1,6 +1,6 @@
 {
   "name": "semantic-ui",
-  "version": "1.4.1",
+  "version": "1.5.0",
   "title": "Semantic UI",
   "description": "Semantic empowers designers and developers by creating a shared vocabulary for UI.",
   "homepage": "http://www.semantic-ui.com",

src/definitions/globals/reset.less

@@ -27,6 +27,9 @@
 *,
 *:before,
 *:after {
+  box-sizing: inherit;
+}
+html {
   box-sizing: border-box;
 }
 

src/definitions/globals/site.less

@@ -24,13 +24,6 @@
              Page
 *******************************/
 
-/* UI requires Border-Box */
-*,
-*:before,
-*:after {
-  box-sizing: border-box;
-}
-
 html,
 body {
   height: 100%;