#2050 - Fix doubling row in doubling grid. fix doubling grid column row

RELEASE-NOTES.md

@@ -27,6 +27,7 @@
 - **Build Tools** - Adjusting `site.variables` will now rebuild all UI, instead of just `site.less`
 - **Divider** - `vertical divider` inside `ui grid` now accounts for column padding
 - **Dropdown** - Dropdowns now automatically observe changes in `menu` and will update selector cache with new additions
+- **Dropdown** - Added `showOnFocus` option
 - **Form** - Added placeholder color rules for IE, `ms-input-placeholder`
 - **Form Validation** - Form validation now has `minCount`, `maxCount`, and `exactCount` for validating multiple selections
 - **Grid** - `celled grid` now removes internal cells on mobile and tablet when used with `doubling` grid responsive variation
@@ -94,6 +95,8 @@
 - **Dropdown** - Dropdown `menu` now use same font size as dropdown
 - **Form** - Form sizes and input sizes now inherit from `site.variables`
 - **Form Validation** - Form validation now validates correctly on `<select>` change
+- **Grid** - Fix `doubling row` not working correctly inside a different `doubling grid` (css spec issue)
+- **Grid** - Fix `doubling grid` incorrectly applying width to `(x) column row`
 - **Grid** - First column on `stackable grid` no longer receives top margin
 - **Grid** - `x column wide` inside `equal width/height` now cannot grow beyond column size
 - **Grid** - Fixes colored grid columns not appearing when not nested in rows

src/definitions/collections/grid.less

@@ -222,67 +222,67 @@ body > .ui.grid {
 
 /* Grid Based */
 .ui[class*="one column"].grid > .row > .column,
-.ui[class*="one column"].grid > .column {
+.ui[class*="one column"].grid > .column:not(.row) {
   width: @oneColumn;
 }
 .ui[class*="two column"].grid > .row > .column,
-.ui[class*="two column"].grid > .column {
+.ui[class*="two column"].grid > .column:not(.row) {
   width: @twoColumn;
 }
 .ui[class*="three column"].grid > .row > .column,
-.ui[class*="three column"].grid > .column {
+.ui[class*="three column"].grid > .column:not(.row) {
   width: @threeColumn;
 }
 .ui[class*="four column"].grid > .row > .column,
-.ui[class*="four column"].grid > .column {
+.ui[class*="four column"].grid > .column:not(.row) {
   width: @fourColumn;
 }
 .ui[class*="five column"].grid > .row > .column,
-.ui[class*="five column"].grid > .column {
+.ui[class*="five column"].grid > .column:not(.row) {
   width: @fiveColumn;
 }
 .ui[class*="six column"].grid > .row > .column,
-.ui[class*="six column"].grid > .column {
+.ui[class*="six column"].grid > .column:not(.row) {
   width: @sixColumn;
 }
 .ui[class*="seven column"].grid > .row > .column,
-.ui[class*="seven column"].grid > .column {
+.ui[class*="seven column"].grid > .column:not(.row) {
   width: @sevenColumn;
 }
 .ui[class*="eight column"].grid > .row > .column,
-.ui[class*="eight column"].grid > .column {
+.ui[class*="eight column"].grid > .column:not(.row) {
   width: @eightColumn;
 }
 .ui[class*="nine column"].grid > .row > .column,
-.ui[class*="nine column"].grid > .column {
+.ui[class*="nine column"].grid > .column:not(.row) {
   width: @nineColumn;
 }
 .ui[class*="ten column"].grid > .row > .column,
-.ui[class*="ten column"].grid > .column {
+.ui[class*="ten column"].grid > .column:not(.row) {
   width: @tenColumn;
 }
 .ui[class*="eleven column"].grid > .row > .column,
-.ui[class*="eleven column"].grid > .column {
+.ui[class*="eleven column"].grid > .column:not(.row) {
   width: @elevenColumn;
 }
 .ui[class*="twelve column"].grid > .row > .column,
-.ui[class*="twelve column"].grid > .column {
+.ui[class*="twelve column"].grid > .column:not(.row) {
   width: @twelveColumn;
 }
 .ui[class*="thirteen column"].grid > .row > .column,
-.ui[class*="thirteen column"].grid > .column {
+.ui[class*="thirteen column"].grid > .column:not(.row) {
   width: @thirteenColumn;
 }
 .ui[class*="fourteen column"].grid > .row > .column,
-.ui[class*="fourteen column"].grid > .column {
+.ui[class*="fourteen column"].grid > .column:not(.row) {
   width: @fourteenColumn;
 }
 .ui[class*="fifteen column"].grid > .row > .column,
-.ui[class*="fifteen column"].grid > .column {
+.ui[class*="fifteen column"].grid > .column:not(.row) {
   width: @fifteenColumn;
 }
 .ui[class*="sixteen column"].grid > .row > .column,
-.ui[class*="sixteen column"].grid > .column {
+.ui[class*="sixteen column"].grid > .column:not(.row) {
   width: @sixteenColumn;
 }
 
@@ -1449,78 +1449,78 @@ body > .ui.grid {
     margin: 0em;
   }
   .ui[class*="two column"].doubling.grid > .row > .column,
-  .ui[class*="two column"].doubling.grid > .column,
-  .ui.grid > [class*="two column"].doubling.row > .column {
+  .ui[class*="two column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="two column"].doubling.row.row > .column {
     width: @oneColumn !important;
   }
   .ui[class*="three column"].doubling.grid > .row > .column,
-  .ui[class*="three column"].doubling.grid > .column,
-  .ui.grid > [class*="three column"].doubling.row > .column {
+  .ui[class*="three column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="three column"].doubling.row.row > .column {
     width: @twoColumn !important;
   }
   .ui[class*="four column"].doubling.grid > .row > .column,
-  .ui[class*="four column"].doubling.grid > .column,
-  .ui.grid > [class*="four column"].doubling.row > .column {
+  .ui[class*="four column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="four column"].doubling.row.row > .column {
     width: @twoColumn !important;
   }
   .ui[class*="five column"].doubling.grid > .row > .column,
-  .ui[class*="five column"].doubling.grid > .column,
-  .ui.grid > [class*="five column"].doubling.row > .column {
+  .ui[class*="five column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="five column"].doubling.row.row > .column {
     width: @threeColumn !important;
   }
   .ui[class*="six column"].doubling.grid > .row > .column,
-  .ui[class*="six column"].doubling.grid > .column,
-  .ui.grid > [class*="six column"].doubling.row > .column {
+  .ui[class*="six column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="six column"].doubling.row.row > .column {
     width: @threeColumn !important;
   }
   .ui[class*="seven column"].doubling.grid > .row > .column,
-  .ui[class*="seven column"].doubling.grid > .column,
-  .ui.grid > [class*="seven column"].doubling.row > .column {
+  .ui[class*="seven column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="seven column"].doubling.row.row > .column {
     width: @threeColumn !important;
   }
   .ui[class*="eight column"].doubling.grid > .row > .column,
-  .ui[class*="eight column"].doubling.grid > .column,
-  .ui.grid > [class*="eight column"].doubling.row > .column {
+  .ui[class*="eight column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="eight column"].doubling.row.row > .column {
     width: @fourColumn !important;
   }
   .ui[class*="nine column"].doubling.grid > .row > .column,
-  .ui[class*="nine column"].doubling.grid > .column,
-  .ui.grid > [class*="nine column"].doubling.row > .column {
+  .ui[class*="nine column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="nine column"].doubling.row.row > .column {
     width: @fourColumn !important;
   }
   .ui[class*="ten column"].doubling.grid > .row > .column,
-  .ui[class*="ten column"].doubling.grid > .column,
-  .ui.grid > [class*="ten column"].doubling.row > .column {
+  .ui[class*="ten column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="ten column"].doubling.row.row > .column {
     width: @fiveColumn !important;
   }
   .ui[class*="eleven column"].doubling.grid > .row > .column,
-  .ui[class*="eleven column"].doubling.grid > .column,
-  .ui.grid > [class*="eleven column"].doubling.row > .column {
+  .ui[class*="eleven column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="eleven column"].doubling.row.row > .column {
     width: @fiveColumn !important;
   }
   .ui[class*="twelve column"].doubling.grid > .row > .column,
-  .ui[class*="twelve column"].doubling.grid > .column,
-  .ui.grid > [class*="twelve column"].doubling.row > .column {
+  .ui[class*="twelve column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="twelve column"].doubling.row.row > .column {
     width: @sixColumn !important;
   }
   .ui[class*="thirteen column"].doubling.grid > .row > .column,
-  .ui[class*="thirteen column"].doubling.grid > .column,
-  .ui.grid > [class*="thirteen column"].doubling.row > .column {
+  .ui[class*="thirteen column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="thirteen column"].doubling.row.row > .column {
     width: @sixColumn !important;
   }
   .ui[class*="fourteen column"].doubling.grid > .row > .column,
-  .ui[class*="fourteen column"].doubling.grid > .column,
-  .ui.grid > [class*="fourteen column"].doubling.row > .column {
+  .ui[class*="fourteen column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="fourteen column"].doubling.row.row > .column {
     width: @sevenColumn !important;
   }
   .ui[class*="fifteen column"].doubling.grid > .row > .column,
-  .ui[class*="fifteen column"].doubling.grid > .column,
-  .ui.grid > [class*="fifteen column"].doubling.row > .column {
+  .ui[class*="fifteen column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="fifteen column"].doubling.row.row > .column {
     width: @sevenColumn !important;
   }
   .ui[class*="sixteen column"].doubling.grid > .row > .column,
-  .ui[class*="sixteen column"].doubling.grid > .column,
-  .ui.grid > [class*="sixteen column"].doubling.row > .column {
+  .ui[class*="sixteen column"].doubling.grid > .column:not(.row),
+  .ui.grid > [class*="sixteen column"].doubling.row.row > .column {
     width: @eightColumn !important;
   }
 }
@@ -1542,78 +1542,78 @@ body > .ui.grid {
     box-shadow: none !important;
   }
   .ui[class*="two column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="two column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="two column"].doubling:not(.stackable).row > .column {
+  .ui[class*="two column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="two column"].doubling:not(.stackable).row.row > .column {
     width: @oneColumn !important;
   }
   .ui[class*="three column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="three column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="three column"].doubling:not(.stackable).row > .column {
+  .ui[class*="three column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="three column"].doubling:not(.stackable).row.row > .column {
     width: @twoColumn !important;
   }
   .ui[class*="four column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="four column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="four column"].doubling:not(.stackable).row > .column {
+  .ui[class*="four column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="four column"].doubling:not(.stackable).row.row > .column {
     width: @twoColumn !important;
   }
   .ui[class*="five column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="five column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="five column"].doubling:not(.stackable).row > .column {
+  .ui[class*="five column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="five column"].doubling:not(.stackable).row.row > .column {
     width: @twoColumn !important;
   }
   .ui[class*="six column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="six column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="six column"].doubling:not(.stackable).row > .column {
+  .ui[class*="six column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="six column"].doubling:not(.stackable).row.row > .column {
     width: @twoColumn !important;
   }
   .ui[class*="seven column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="seven column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="seven column"].doubling:not(.stackable).row > .column {
+  .ui[class*="seven column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="seven column"].doubling:not(.stackable).row.row > .column {
     width: @twoColumn !important;
   }
   .ui[class*="eight column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="eight column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="eight column"].doubling:not(.stackable).row > .column {
+  .ui[class*="eight column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="eight column"].doubling:not(.stackable).row.row > .column {
     width: @twoColumn !important;
   }
   .ui[class*="nine column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="nine column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="nine column"].doubling:not(.stackable).row > .column {
+  .ui[class*="nine column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="nine column"].doubling:not(.stackable).row.row > .column {
     width: @threeColumn !important;
   }
   .ui[class*="ten column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="ten column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="ten column"].doubling:not(.stackable).row > .column {
+  .ui[class*="ten column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="ten column"].doubling:not(.stackable).row.row > .column {
     width: @threeColumn !important;
   }
   .ui[class*="eleven column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="eleven column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="eleven column"].doubling:not(.stackable).row > .column {
+  .ui[class*="eleven column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="eleven column"].doubling:not(.stackable).row.row > .column {
     width: @threeColumn !important;
   }
   .ui[class*="twelve column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="twelve column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="twelve column"].doubling:not(.stackable).row > .column {
+  .ui[class*="twelve column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="twelve column"].doubling:not(.stackable).row.row > .column {
     width: @threeColumn !important;
   }
   .ui[class*="thirteen column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="thirteen column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="thirteen column"].doubling:not(.stackable).row > .column {
+  .ui[class*="thirteen column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="thirteen column"].doubling:not(.stackable).row.row > .column {
     width: @threeColumn !important;
   }
   .ui[class*="fourteen column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="fourteen column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="fourteen column"].doubling:not(.stackable).row > .column {
+  .ui[class*="fourteen column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="fourteen column"].doubling:not(.stackable).row.row > .column {
     width: @fourColumn !important;
   }
   .ui[class*="fifteen column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="fifteen column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="fifteen column"].doubling:not(.stackable).row > .column {
+  .ui[class*="fifteen column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="fifteen column"].doubling:not(.stackable).row.row > .column {
     width: @fourColumn !important;
   }
   .ui[class*="sixteen column"].doubling:not(.stackable).grid > .row > .column,
-  .ui[class*="sixteen column"].doubling:not(.stackable).grid > .column,
-  .ui.grid > [class*="sixteen column"].doubling:not(.stackable).row > .column {
+  .ui[class*="sixteen column"].doubling:not(.stackable).grid > .column:not(.row),
+  .ui.grid > [class*="sixteen column"].doubling:not(.stackable).row.row > .column {
     width: @fourColumn !important;
   }
 }