Merge branch 'next' of github.com:Semantic-Org/Semantic-UI into multiselect

RELEASE-NOTES.md

@@ -30,6 +30,7 @@
 - **Visibility/Sticky** - Visibility now uses pub/sub pattern to greatly improve scroll performance when attaching multiple events
 
 **Changes**
+- **Checkbox** - Slider now uses `positive text color` a slightly more legible green for label
 - **Dropdown** - Dropdown padding values now resolve to exact pixel values from em
 - **Grid** - Small computer `page grid` gutters have been adjusted from 8% to 3% to allow for roomier layouts on small screens.
 - **Grid** - `center aligned` no longer centers rows, just text. Use `centered grid` to center a grid column on the page.
@@ -63,6 +64,7 @@
 - **Modal** - `scrollable modal` now correctly adds padding below modal
 - **Modal** - Modal with `detachable: false` inside `ui sidebar`  `pusher` element will now show correctly
 - **Popup** - Fixes issue with `min-width` in firefox exceeding `max-width` causing element to not wrap correctly
+- **Tab** - Tab name is no longer case sensitive
 - **Table** - `very basic table` now works together with `padded table`
 - **Table** - Fix inheritance of text alignment and vertical alignment
 - **Transition** - Fixed bug where transition could sometimes not occur when an element was determined to always be hidden

dist/components/checkbox.css

@@ -86,8 +86,8 @@
   text-align: center;
   opacity: 0;
   color: rgba(0, 0, 0, 0.8);
-  -webkit-transition: all 0.1s ease;
-          transition: all 0.1s ease;
+  -webkit-transition: all 0.2s ease;
+          transition: all 0.2s ease;
 }
 
 /*--------------
@@ -431,7 +431,7 @@
 .ui.toggle.checkbox input[type="checkbox"]:checked ~ label,
 .ui.toggle.checkbox input[type="radio"]:checked ~ .box,
 .ui.toggle.checkbox input[type="radio"]:checked ~ label {
-  color: #5bbd72;
+  color: #3c763d;
 }
 .ui.toggle.checkbox input[type="checkbox"]:checked ~ .box:before,
 .ui.toggle.checkbox input[type="checkbox"]:checked ~ label:before,

dist/components/dropdown.css

@@ -413,7 +413,7 @@ select.ui.dropdown {
 
 /* Menu Item */
 .ui.selection.dropdown .menu > .item {
-  border-top: 1px solid rgba(0, 0, 0, 0.05);
+  border-top: 1px solid rgba(34, 36, 38, 0.15);
   padding-left: 1.1em !important;
   
 /* Add in spacing for scroll bar */
@@ -445,13 +445,13 @@ select.ui.dropdown {
   box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
 }
 .ui.selection.visible.dropdown:hover .menu {
-  border: 1px solid rgba(34, 36, 38, 0.3);
-  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1);
+  border-color: rgba(34, 36, 38, 0.3);
+  box-shadow: 0px 2px 6px 0px rgba(34, 36, 38, 0.15);
 }
 
 /* Visible */
 .ui.selection.dropdown.visible {
-  border-color: rgba(34, 36, 38, 0.15);
+  border-color: rgba(34, 36, 38, 0.3);
   box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
 }
 
@@ -502,10 +502,12 @@ select.ui.dropdown {
 }
 
 /* Text Layering */
+.ui.search.dropdown > .pointer > input.search,
 .ui.search.dropdown > input.search {
   position: absolute;
   z-index: 2;
 }
+.ui.search.dropdown > .pointer > .text,
 .ui.search.dropdown > .text {
   cursor: text;
   position: relative;
@@ -513,21 +515,32 @@ select.ui.dropdown {
 }
 
 /* Search Selection */
+.ui.search.selection.dropdown > .pointer > input.search,
 .ui.search.selection.dropdown > input.search {
   line-height: 1.2142em;
   padding: 0.6929em 1.1em;
 }
 
 /* Active/Visible Search */
+.ui.search.dropdown.active > .pointer > input.search,
+.ui.search.dropdown.visible > .pointer > input.search,
 .ui.search.dropdown.active > input.search,
 .ui.search.dropdown.visible > input.search {
   cursor: auto;
 }
+.ui.search.dropdown.active > .pointer > .text,
+.ui.search.dropdown.visible > .pointer > .text,
 .ui.search.dropdown.active > .text,
 .ui.search.dropdown.visible > .text {
   pointer-events: none;
 }
-.ui.active.search.dropdown > input.search:focus + .text {
+
+/* Filtered Text */
+.ui.active.search.dropdown input.search:focus + .text .icon,
+.ui.active.search.dropdown input.search:focus + .text .flag {
+  opacity: 0.3;
+}
+.ui.active.search.dropdown input.search:focus + .text {
   color: rgba(0, 0, 0, 0.4) !important;
 }
 
@@ -560,6 +573,36 @@ select.ui.dropdown {
   }
 }
 
+/*--------------
+    Multiple
+---------------*/
+
+
+/* Multiple Search Selection */
+.ui.multiple.dropdown > .labels {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+/* Search Selection */
+.ui.multiple.search.selection.dropdown > .labels {
+  margin: -0.8em 0em;
+}
+.ui.multiple.search.selection.dropdown > input.search {
+  left: auto;
+  min-width: 200px;
+  padding-left: 0;
+}
+.ui.multiple.search.selection.dropdown > .labels + input.search,
+.ui.multiple.search.selection.dropdown > .labels ~ .text {
+  padding-left: 0.5em;
+}
+
+/* Don't Allow Repeat Selections */
+.ui.multiple.search.selection.dropdown .menu .active.item {
+  display: none;
+}
+
 /*--------------
      Inline
 ---------------*/

dist/components/dropdown.js

@@ -49,6 +49,7 @@ $.fn.dropdown = function(parameters) {
         $module         = $(this),
         $text           = $module.find(selector.text),
         $search         = $module.find(selector.search),
+        $labels         = $module.find(selector.labels),
         $input          = $module.find(selector.input),
 
         $combo = ($module.prev().find(selector.text).length > 0)
@@ -65,7 +66,8 @@ $.fn.dropdown = function(parameters) {
 
         elementNamespace,
         id,
-        observer,
+        selectObserver,
+        menuObserver,
         module
       ;
 
@@ -117,25 +119,37 @@ $.fn.dropdown = function(parameters) {
           $document
             .off(elementNamespace)
           ;
+          if(selectObserver) {
+            selectObserver.disconnect();
+          }
+          if(menuObserver) {
+            menuObserver.disconnect();
+          }
         },
 
         observeChanges: function() {
           if('MutationObserver' in window) {
-            observer = new MutationObserver(function(mutations) {
-              if( module.is.selectMutation(mutations) ) {
-                module.debug('<select> modified, recreating menu');
-                module.setup.select();
-              }
-              else {
-                module.debug('DOM tree modified, updating selector cache');
-                module.refresh();
-              }
+            selectObserver = new MutationObserver(function(mutations) {
+              module.debug('<select> modified, recreating menu');
+              module.setup.select();
             });
-            observer.observe(element, {
-              childList : true,
-              subtree   : true
+            menuObserver = new MutationObserver(function(mutations) {
+              module.debug('Menu modified, updating selector cache');
+              module.refresh();
             });
-            module.debug('Setting up mutation observer', observer);
+            if(module.has.input()) {
+              selectObserver.observe($input[0], {
+                childList : true,
+                subtree   : true
+              });
+            }
+            if(module.has.menu()) {
+              menuObserver.observe($menu[0], {
+                childList : true,
+                subtree   : true
+              });
+            }
+            module.debug('Setting up mutation observer', selectObserver, menuObserver);
           }
         },
 
@@ -165,12 +179,15 @@ $.fn.dropdown = function(parameters) {
             if( $module.is('select') ) {
               module.setup.select();
             }
-            if( module.is.search() && !module.is.searchable() ) {
+            if( module.is.search() && !module.has.search() ) {
               $search = $('<input />')
                 .addClass(className.search)
                 .insertBefore($text)
               ;
             }
+            if( module.is.multiple() && !module.has.labels()) {
+              $labels = $('<div />').addClass(className.labels).insertBefore($search);
+            }
             if(settings.allowTab) {
               module.set.tabbable();
             }
@@ -210,6 +227,9 @@ $.fn.dropdown = function(parameters) {
                 .prependTo($module)
               ;
             }
+            if($input.is('[multiple]')) {
+              module.set.multiple();
+            }
             module.refresh();
           },
           reference: function() {
@@ -238,8 +258,10 @@ $.fn.dropdown = function(parameters) {
             ? $module.prev().find(selector.text)
             : $module.prev()
           ;
-          $menu   = $module.children(selector.menu);
-          $item   = $menu.find(selector.item);
+          $menu    = $module.children(selector.menu);
+          $item    = $menu.find(selector.item);
+          // multiple
+          $labels  = $module.find(selector.labels);
         },
 
         toggle: function() {
@@ -310,7 +332,7 @@ $.fn.dropdown = function(parameters) {
             $module
               .on('keydown' + eventNamespace, module.event.keydown)
             ;
-            if( module.is.searchable() ) {
+            if( module.has.search() ) {
               $module
                 .on(module.get.inputEvent(), selector.search, module.event.input)
               ;
@@ -472,6 +494,9 @@ $.fn.dropdown = function(parameters) {
             module.event.item.click.call($selectedItem);
             module.remove.filteredItem();
           }
+          else {
+            module.hide();
+          }
         },
 
         event: {
@@ -843,12 +868,26 @@ $.fn.dropdown = function(parameters) {
           text: function() {
             return $text.text();
           },
+          uniqueArray: function(array) {
+            return $.grep(array, function (value, index) {
+                return $.inArray(value, array) === index;
+            });
+          },
           value: function() {
             return ($input.length > 0)
               ? $input.val()
               : $module.data(metadata.value)
             ;
           },
+          values: function() {
+            var
+              value = module.get.value()
+            ;
+            return $.isArray(value)
+              ? value
+              : [value]
+            ;
+          },
           choiceText: function($choice, preserveHTML) {
             preserveHTML = (preserveHTML !== undefined)
               ? preserveHTML
@@ -941,6 +980,7 @@ $.fn.dropdown = function(parameters) {
           },
           item: function(value, strict) {
             var
+              isMultiple    = module.is.multiple(),
               $selectedItem = false
             ;
             value = (value !== undefined)
@@ -1031,7 +1071,7 @@ $.fn.dropdown = function(parameters) {
             module.save.defaultValue();
           },
           defaultValue: function() {
-            $module.data(metadata.defaultValue, module.get.value() );
+            $module.data(metadata.defaultValue, module.get.value());
           },
           defaultText: function() {
             $module.data(metadata.defaultText, $text.text() );
@@ -1048,12 +1088,16 @@ $.fn.dropdown = function(parameters) {
             placeholderText = $module.data(metadata.placeholderText)
           ;
           module.set.text(placeholderText);
-          module.set.value('');
+          module.clearValue();
           module.remove.activeItem();
           module.remove.selectedItem();
           $text.addClass(className.placeholder);
         },
 
+        clearValue: function() {
+          module.set.value('');
+        },
+
         set: {
           filtered: function() {
             var
@@ -1068,7 +1112,7 @@ $.fn.dropdown = function(parameters) {
             }
           },
           tabbable: function() {
-            if( module.is.searchable() ) {
+            if( module.has.search() ) {
               module.debug('Searchable dropdown initialized');
               $search
                 .val('')
@@ -1161,20 +1205,51 @@ $.fn.dropdown = function(parameters) {
           value: function(value) {
             module.debug('Adding selected value to hidden input', value, $input);
             if($input.length > 0) {
-              $input
-                .val(value)
-                .trigger('change')
-              ;
+              if( module.is.multiple() ) {
+                var
+                  values = module.get.values()
+                ;
+                if($.isArray(values)) {
+                  values.push(value);
+                  values = module.get.uniqueArray(values);
+                }
+                else {
+                  values = [value];
+                }
+                module.debug('Adding value to multiple', value, values);
+                module.set.values(values);
+              }
+              else {
+                module.debug('Updating input value', value);
+                $input
+                  .val(value)
+                  .trigger('change')
+                ;
+              }
             }
             else {
               $module.data(metadata.value, value);
             }
           },
+          values: function(values) {
+            if( $input.is('select') ) {
+              $input.val(values);
+              module.debug('Setting mutiple select values', values, $input);
+            }
+            else {
+              values = values.join(',');
+              $input.val(values);
+              module.debug('Setting hidden input to comma separatd values', values, $input);
+            }
+          },
           active: function() {
             $module
               .addClass(className.active)
             ;
           },
+          multiple: function() {
+            $module.addClass(className.multiple);
+          },
           visible: function() {
             $module.addClass(className.visible);
           },
@@ -1221,7 +1296,7 @@ $.fn.dropdown = function(parameters) {
             $item.removeClass(className.selected);
           },
           tabbable: function() {
-            if( module.is.searchable() ) {
+            if( module.has.search() ) {
               module.debug('Searchable dropdown initialized');
               $search
                 .attr('tabindex', '-1')
@@ -1242,6 +1317,21 @@ $.fn.dropdown = function(parameters) {
           }
         },
 
+        has: {
+          labels: function() {
+            return ($labels.length > 0);
+          },
+          search: function() {
+            return ($search.length > 0);
+          },
+          input: function() {
+            return ($input.length > 0);
+          },
+          menu: function() {
+            return ($menu.length > 0);
+          }
+        },
+
         is: {
           active: function() {
             return $module.hasClass(className.active);
@@ -1264,6 +1354,9 @@ $.fn.dropdown = function(parameters) {
               : $menu.is(':hidden')
             ;
           },
+          multiple: function() {
+            return $module.hasClass(className.multiple);
+          },
           selectMutation: function(mutations) {
             var
               selectChanged = false
@@ -1279,11 +1372,8 @@ $.fn.dropdown = function(parameters) {
           search: function() {
             return $module.hasClass(className.search);
           },
-          searchable: function() {
-            return ($search.length > 0);
-          },
           searchSelection: function() {
-            return ( module.is.searchable() && $search.parent().is($module) );
+            return ( module.has.search() && $search.closest(selector.menu).length == 0 );
           },
           selection: function() {
             return $module.hasClass(className.selection);
@@ -1729,9 +1819,10 @@ $.fn.dropdown.settings = {
     dropdown : '.ui.dropdown',
     input    : '> input[type="hidden"], > select',
     item     : '.item',
+    labels   : '> .labels',
     menu     : '.menu',
     menuIcon : '.dropdown.icon',
-    search   : '> input.search, .menu > .search > input, .menu > input.search',
+    search   : 'input.search, .menu > .search > input',
     text     : '> .text:not(.icon)'
   },
 
@@ -1741,8 +1832,10 @@ $.fn.dropdown.settings = {
     disabled    : 'disabled',
     dropdown    : 'ui dropdown',
     filtered    : 'filtered',
+    labels      : 'labels',
     loading     : 'loading',
     menu        : 'menu',
+    multiple    : 'multiple',
     placeholder : 'default',
     search      : 'search',
     selected    : 'selected',

dist/components/form.css

@@ -289,16 +289,16 @@
 .ui.form input[type="url"]:focus {
   color: rgba(0, 0, 0, 0.85);
   border-color: rgba(34, 36, 38, 0.3);
-  border-radius: 0em 0.2857rem 0.2857rem 0em;
+  border-radius: 0.2857rem;
   background: #ffffff;
-  box-shadow: 1px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
+  box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
 }
 .ui.form textarea:focus {
   color: rgba(0, 0, 0, 0.85);
   border-color: rgba(34, 36, 38, 0.3);
-  border-radius: 0em 0.2857rem 0.2857rem 0em;
+  border-radius: 0.2857rem;
   background: #ffffff;
-  box-shadow: 1px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
+  box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
   -webkit-appearance: none;
 }
 
@@ -373,8 +373,8 @@
   background: #fff0f0;
   border-color: #dbb1b1;
   color: #d95c5c;
-  border-radius: 0em 0.2857rem 0.2857rem 0em;
-  box-shadow: 2px 0em 0em 0em #d95c5c inset;
+  border-radius: 0.2857rem;
+  box-shadow: none;
 }
 .ui.form .field.error textarea:focus,
 .ui.form .field.error select:focus,
@@ -391,9 +391,9 @@
 .ui.form .field.error input[type="url"]:focus {
   background: #fff0f0;
   border-color: #dbb1b1;
-  color: #dc6868;
+  color: #e07979;
   -webkit-appearance: none;
-  box-shadow: 2px 0em 0em 0em #dc6868 inset;
+  box-shadow: none;
 }
 
 /* Preserve Native Select Stylings */

dist/components/form.js

@@ -100,7 +100,7 @@ $.fn.form = function(fields, parameters) {
         attachEvents: function(selector, action) {
           action = action || 'submit';
           $(selector)
-            .on('click', function(event) {
+            .on('click' + eventNamespace, function(event) {
               module[action]();
               event.preventDefault();
             })

dist/components/popup.js

@@ -228,14 +228,14 @@ $.fn.popup = function(parameters) {
           else if($target.next(selector.popup).length !== 0) {
             module.verbose('Pre-existing popup found');
             settings.inline = true;
-            settings.popup  = $target.next(selector.popup).data(metadata.activator, $module);
+            settings.popups  = $target.next(selector.popup).data(metadata.activator, $module);
             module.refresh();
             if(settings.hoverable) {
               module.bind.popup();
             }
           }
           else if(settings.popup) {
-            settings.popup.data(metadata.activator, $module);
+            $(settings.popup).data(metadata.activator, $module);
             module.verbose('Used popup specified in settings');
             module.refresh();
             if(settings.hoverable) {

dist/components/sticky.js

@@ -112,7 +112,7 @@ $.fn.sticky = function(parameters) {
               module.timer = setTimeout(function() {
                 module.verbose('DOM tree modified, updating sticky menu');
                 module.refresh();
-              }, 20);
+              }, 100);
             });
             observer.observe(element, {
               childList : true,

dist/components/tab.js

@@ -258,6 +258,9 @@ $.fn.tab = function(parameters) {
 
         changeTab: function(tabPath) {
           var
+            tabPath = (typeof tabPath == 'string')
+              ? tabPath.toLowerCase()
+              : tabPath,
             pushStateAvailable = (window.history && window.history.pushState),
             shouldIgnoreLoad   = (pushStateAvailable && settings.ignoreFirstLoad && firstLoad),
             remoteContent      = (settings.auto || $.isPlainObject(settings.apiSettings) ),

dist/components/transition.css

@@ -35,8 +35,6 @@
 .animating.transition {
   -webkit-backface-visibility: hidden;
           backface-visibility: hidden;
-  -webkit-transform: translateZ(0);
-          transform: translateZ(0);
   visibility: visible !important;
 }
 
@@ -59,8 +57,8 @@
   visibility: visible !important;
   -webkit-backface-visibility: hidden;
           backface-visibility: hidden;
-  -webkit-transform: translateZ(0);
-          transform: translateZ(0);
+  -webkit-transform: rotateZ(0deg);
+          transform: rotateZ(0deg);
 }
 
 /* Disabled */

dist/components/visibility.js

@@ -120,7 +120,10 @@ $.fn.visibility = function(parameters) {
           if('MutationObserver' in window) {
             observer = new MutationObserver(function(mutations) {
               module.verbose('DOM tree modified, updating visibility calculations');
-              module.refresh();
+              module.timer = setTimeout(function() {
+                module.verbose('DOM tree modified, updating sticky menu');
+                module.refresh();
+              }, 100);
             });
             observer.observe(element, {
               childList : true,
@@ -180,11 +183,11 @@ $.fn.visibility = function(parameters) {
 
         event: {
           resize: function() {
-            module.verbose('Window resized');
+            module.debug('Window resized');
             requestAnimationFrame(module.refresh);
           },
           load: function() {
-            module.verbose('Page finished loading');
+            module.debug('Page finished loading');
             requestAnimationFrame(module.refresh);
           },
           // publishes scrollchange event on one scroll
@@ -336,7 +339,7 @@ $.fn.visibility = function(parameters) {
         },
 
         refresh: function() {
-          module.debug('Refreshing constants (element width/height)');
+          module.debug('Refreshing constants (width/height)');
           module.reset();
           module.save.position();
           module.checkVisibility();

dist/semantic.css

@@ -14063,17 +14063,17 @@ ol.ui.horizontal.list li:before,
 .ui.form input[type="url"]:focus {
   color: rgba(0, 0, 0, 0.85);
   border-color: rgba(34, 36, 38, 0.3);
-  border-radius: 0em 0.2857rem 0.2857rem 0em;
+  border-radius: 0.2857rem;
   background: #ffffff;
-  box-shadow: 1px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
+  box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
 }
 
 .ui.form textarea:focus {
   color: rgba(0, 0, 0, 0.85);
   border-color: rgba(34, 36, 38, 0.3);
-  border-radius: 0em 0.2857rem 0.2857rem 0em;
+  border-radius: 0.2857rem;
   background: #ffffff;
-  box-shadow: 1px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
+  box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
   -webkit-appearance: none;
 }
 
@@ -14151,8 +14151,8 @@ ol.ui.horizontal.list li:before,
   background: #fff0f0;
   border-color: #dbb1b1;
   color: #d95c5c;
-  border-radius: 0em 0.2857rem 0.2857rem 0em;
-  box-shadow: 2px 0em 0em 0em #d95c5c inset;
+  border-radius: 0.2857rem;
+  box-shadow: none;
 }
 
 .ui.form .field.error textarea:focus,
@@ -14170,9 +14170,9 @@ ol.ui.horizontal.list li:before,
 .ui.form .field.error input[type="url"]:focus {
   background: #fff0f0;
   border-color: #dbb1b1;
-  color: #dc6868;
+  color: #e07979;
   -webkit-appearance: none;
-  box-shadow: 2px 0em 0em 0em #dc6868 inset;
+  box-shadow: none;
 }
 
 /* Preserve Native Select Stylings */
@@ -23559,8 +23559,8 @@ a.ui.card:hover,
   text-align: center;
   opacity: 0;
   color: rgba(0, 0, 0, 0.8);
-  -webkit-transition: all 0.1s ease;
-  transition: all 0.1s ease;
+  -webkit-transition: all 0.2s ease;
+  transition: all 0.2s ease;
 }
 
 /*--------------
@@ -23918,7 +23918,7 @@ a.ui.card:hover,
 .ui.toggle.checkbox input[type="checkbox"]:checked ~ label,
 .ui.toggle.checkbox input[type="radio"]:checked ~ .box,
 .ui.toggle.checkbox input[type="radio"]:checked ~ label {
-  color: #5bbd72;
+  color: #3c763d;
 }
 
 .ui.toggle.checkbox input[type="checkbox"]:checked ~ .box:before,
@@ -24623,7 +24623,7 @@ select.ui.dropdown {
 /* Menu Item */
 
 .ui.selection.dropdown .menu > .item {
-  border-top: 1px solid rgba(0, 0, 0, 0.05);
+  border-top: 1px solid rgba(34, 36, 38, 0.15);
   padding-left: 1.1em !important;
   /* Add in spacing for scroll bar */
   padding-right: -webkit-calc(2.1em) !important;
@@ -24658,14 +24658,14 @@ select.ui.dropdown {
 }
 
 .ui.selection.visible.dropdown:hover .menu {
-  border: 1px solid rgba(34, 36, 38, 0.3);
-  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1);
+  border-color: rgba(34, 36, 38, 0.3);
+  box-shadow: 0px 2px 6px 0px rgba(34, 36, 38, 0.15);
 }
 
 /* Visible */
 
 .ui.selection.dropdown.visible {
-  border-color: rgba(34, 36, 38, 0.15);
+  border-color: rgba(34, 36, 38, 0.3);
   box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
 }
 
@@ -24721,11 +24721,13 @@ select.ui.dropdown {
 
 /* Text Layering */
 
+.ui.search.dropdown > .pointer > input.search,
 .ui.search.dropdown > input.search {
   position: absolute;
   z-index: 2;
 }
 
+.ui.search.dropdown > .pointer > .text,
 .ui.search.dropdown > .text {
   cursor: text;
   position: relative;
@@ -24734,6 +24736,7 @@ select.ui.dropdown {
 
 /* Search Selection */
 
+.ui.search.selection.dropdown > .pointer > input.search,
 .ui.search.selection.dropdown > input.search {
   line-height: 1.2142em;
   padding: 0.6929em 1.1em;
@@ -24741,17 +24744,28 @@ select.ui.dropdown {
 
 /* Active/Visible Search */
 
+.ui.search.dropdown.active > .pointer > input.search,
+.ui.search.dropdown.visible > .pointer > input.search,
 .ui.search.dropdown.active > input.search,
 .ui.search.dropdown.visible > input.search {
   cursor: auto;
 }
 
+.ui.search.dropdown.active > .pointer > .text,
+.ui.search.dropdown.visible > .pointer > .text,
 .ui.search.dropdown.active > .text,
 .ui.search.dropdown.visible > .text {
   pointer-events: none;
 }
 
-.ui.active.search.dropdown > input.search:focus + .text {
+/* Filtered Text */
+
+.ui.active.search.dropdown input.search:focus + .text .icon,
+.ui.active.search.dropdown input.search:focus + .text .flag {
+  opacity: 0.3;
+}
+
+.ui.active.search.dropdown input.search:focus + .text {
   color: rgba(0, 0, 0, 0.4) !important;
 }
 
@@ -24789,6 +24803,40 @@ select.ui.dropdown {
   }
 }
 
+/*--------------
+    Multiple
+---------------*/
+
+/* Multiple Search Selection */
+
+.ui.multiple.dropdown > .labels {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+/* Search Selection */
+
+.ui.multiple.search.selection.dropdown > .labels {
+  margin: -0.8em 0em;
+}
+
+.ui.multiple.search.selection.dropdown > input.search {
+  left: auto;
+  min-width: 200px;
+  padding-left: 0;
+}
+
+.ui.multiple.search.selection.dropdown > .labels + input.search,
+.ui.multiple.search.selection.dropdown > .labels ~ .text {
+  padding-left: 0.5em;
+}
+
+/* Don't Allow Repeat Selections */
+
+.ui.multiple.search.selection.dropdown .menu .active.item {
+  display: none;
+}
+
 /*--------------
      Inline
 ---------------*/
@@ -29653,8 +29701,6 @@ html.ios {
 .animating.transition {
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
-  -webkit-transform: translateZ(0);
-  transform: translateZ(0);
   visibility: visible !important;
 }
 
@@ -29680,8 +29726,8 @@ html.ios {
   visibility: visible !important;
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
-  -webkit-transform: translateZ(0);
-  transform: translateZ(0);
+  -webkit-transform: rotateZ(0deg);
+  transform: rotateZ(0deg);
 }
 
 /* Disabled */
@@ -32310,17 +32356,17 @@ html.ios {
 .ui.form input[type="url"]:focus {
   color: rgba(0, 0, 0, 0.85);
   border-color: rgba(34, 36, 38, 0.3);
-  border-radius: 0em 0.2857rem 0.2857rem 0em;
+  border-radius: 0.2857rem;
   background: #ffffff;
-  box-shadow: 1px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
+  box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
 }
 
 .ui.form textarea:focus {
   color: rgba(0, 0, 0, 0.85);
   border-color: rgba(34, 36, 38, 0.3);
-  border-radius: 0em 0.2857rem 0.2857rem 0em;
+  border-radius: 0.2857rem;
   background: #ffffff;
-  box-shadow: 1px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
+  box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.3) inset;
   -webkit-appearance: none;
 }
 
@@ -32398,8 +32444,8 @@ html.ios {
   background: #fff0f0;
   border-color: #dbb1b1;
   color: #d95c5c;
-  border-radius: 0em 0.2857rem 0.2857rem 0em;
-  box-shadow: 2px 0em 0em 0em #d95c5c inset;
+  border-radius: 0.2857rem;
+  box-shadow: none;
 }
 
 .ui.form .field.error textarea:focus,
@@ -32417,9 +32463,9 @@ html.ios {
 .ui.form .field.error input[type="url"]:focus {
   background: #fff0f0;
   border-color: #dbb1b1;
-  color: #dc6868;
+  color: #e07979;
   -webkit-appearance: none;
-  box-shadow: 2px 0em 0em 0em #dc6868 inset;
+  box-shadow: none;
 }
 
 /* Preserve Native Select Stylings */

src/definitions/modules/checkbox.less

@@ -102,7 +102,7 @@
 
   opacity: 0;
   color: @checkboxColor;
-  transition: all 0.1s ease;
+  transition: all @transitionDuration @transitionEasing;
 }
 
 /*--------------

src/definitions/modules/dropdown.less

@@ -400,7 +400,7 @@ select.ui.dropdown {
 /* Scrollbar in IE */
 @media all and (-ms-high-contrast:none) {
   .ui.selection.dropdown .menu {
-    min-width: calc(100% - @scrollBarWidth);
+    min-width: ~"calc(100% - "@scrollBarWidth~")";
   }
 }
 
@@ -430,7 +430,7 @@ select.ui.dropdown {
   border-top: @selectionItemDivider;
   padding-left: @selectionHorizontalPadding !important;
   /* Add in spacing for scroll bar */
-  padding-right: calc(@selectionHorizontalPadding + 1em) !important;
+  padding-right: ~"calc("@selectionHorizontalPadding~" + 1em) !important~";
   white-space: normal;
   word-wrap: normal;
 }
@@ -451,6 +451,17 @@ select.ui.dropdown {
   opacity: @disabledOpacity !important;
 }
 
+/* Visible */
+.ui.selection.dropdown.visible {
+  border-color: @selectionVisibleBorderColor;
+  box-shadow: @selectionVisibleBoxShadow;
+}
+.ui.selection.visible.dropdown .menu {
+  border-color: @selectionVisibleBorderColor;
+  box-shadow: @selectionVisibleMenuBoxShadow;
+}
+
+
 /* Visible Hover */
 .ui.selection.visible.dropdown:hover {
   border-color: @selectionVisibleHoverBorderColor;
@@ -461,11 +472,6 @@ select.ui.dropdown {
   box-shadow: @selectionVisibleHoverMenuBoxShadow;
 }
 
-/* Visible */
-.ui.selection.dropdown.visible {
-  border-color: @selectionVisibleBorderColor;
-  box-shadow: @selectionVisibleBoxShadow;
-}
 
 /* Active Item */
 .ui.selection.active.dropdown > .text:not(.default),

src/definitions/modules/tab.js

@@ -258,6 +258,9 @@ $.fn.tab = function(parameters) {
 
         changeTab: function(tabPath) {
           var
+            tabPath = (typeof tabPath == 'string')
+              ? tabPath.toLowerCase()
+              : tabPath,
             pushStateAvailable = (window.history && window.history.pushState),
             shouldIgnoreLoad   = (pushStateAvailable && settings.ignoreFirstLoad && firstLoad),
             remoteContent      = (settings.auto || $.isPlainObject(settings.apiSettings) ),

src/definitions/modules/transition.less

@@ -59,6 +59,7 @@
   display: block !important;
   visibility: visible !important;
   backface-visibility: @backfaceVisibility;
+  transform: rotateZ(0deg);
 }
 
 /* Disabled */

src/themes/default/modules/checkbox.variables

@@ -130,7 +130,7 @@
 @toggleHoverColor: @toggleFocusColor;
 
 @toggleOffLabelColor: @checkboxColor;
-@toggleOnLabelColor: @positiveCheckbox;
+@toggleOnLabelColor: @positiveTextColor;
 @toggleOnLaneColor: @positiveCheckbox;
 
 

src/themes/default/modules/dropdown.variables

@@ -175,15 +175,17 @@
 @selectionHoverBoxShadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.05);
 
 /* Visible */
-@selectionVisibleBorderColor: @selectedBorderColor;
-@selectionVisibleBoxShadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
 @selectionVisibleTextFontWeight: normal;
 @selectionVisibleTextColor: @hoveredTextColor;
 
+@selectionVisibleBorderColor: @selectedBorderColor;
+@selectionVisibleBoxShadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
+@selectionVisibleMenuBoxShadow: 0px 2px 6px 0px @borderColor;
+
 /* Visible Hover */
 @selectionVisibleHoverBorderColor: @selectedBorderColor;
-@selectionVisibleHoverBoxShadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
-@selectionVisibleHoverMenuBoxShadow: 0px 2px 6px 0px @borderColor;
+@selectionVisibleHoverBoxShadow: @selectionVisibleBoxShadow;
+@selectionVisibleHoverMenuBoxShadow: @selectionVisibleMenuBoxShadow;
 
 @selectionVisibleConnectingBorder: 0em;
 @selectionVisibleIconOpacity: 1;

src/themes/flat/collections/form.overrides

@@ -18,6 +18,10 @@
   border-bottom: 1px solid #DDDDDD;
   border-radius: 0em !important;
 }
+.ui.form .selection.dropdown > .menu {
+  border-top-width: 1px !important;
+  border-radius: @defaultBorderRadius !important;
+}
 
 .ui.form .ui.icon.input > .icon {
   width: 1em;

tasks/config/project/tasks.js

@@ -83,6 +83,10 @@ module.exports = {
           if(error.filename.match(/theme.less/)) {
             console.error('Looks like your theme.config is out of date. You will need to add new elements from theme.config.example');
           }
+          else {
+            console.log(error);
+            this.emit('end');
+          }
         }
       }
     },

tasks/watch.js

@@ -136,6 +136,7 @@ module.exports = function(callback) {
         stream = gulp.src(lessPath)
           .pipe(plumber(settings.plumber.less))
           .pipe(less(settings.less))
+          .pipe(print(log.created))
           .pipe(replace(comments.variables.in, comments.variables.out))
           .pipe(replace(comments.license.in, comments.license.out))
           .pipe(replace(comments.large.in, comments.large.out))
@@ -170,7 +171,6 @@ module.exports = function(callback) {
             gulp.start('package compressed css');
           })
         ;
-
       }
       else {
         console.log('Cannot find UI definition at path', lessPath);