diff --git a/src/definitions/behaviors/state.js b/src/definitions/behaviors/state.js index 6efd5faca..d1e1abf8d 100644 --- a/src/definitions/behaviors/state.js +++ b/src/definitions/behaviors/state.js @@ -246,7 +246,11 @@ $.fn.state = function(parameters) { text: function() { if( module.is.textEnabled() ) { - if( module.is.active() ) { + if(module.is.disabled() ) { + module.verbose('Changing text to disabled text', text.hover); + module.update.text(text.disabled); + } + else if( module.is.active() ) { if(text.hover) { module.verbose('Changing text to hover text', text.hover); module.update.text(text.hover); @@ -321,16 +325,18 @@ $.fn.state = function(parameters) { }, flash: { - text: function(text, duration) { + text: function(text, duration, callback) { var previousText = module.get.text() ; module.debug('Flashing text message', text, duration); text = text || settings.text.flash; duration = duration || settings.flashDuration; + callback = callback || function() {}; module.update.text(text); setTimeout(function(){ module.update.text(previousText); + $.proxy(callback, element)(); }, duration); } }, @@ -652,6 +658,7 @@ $.fn.state.settings = { }, text : { + disabled : false, flash : false, hover : false, active : false, diff --git a/src/definitions/collections/form.less b/src/definitions/collections/form.less index ac264735a..1b945d9c6 100644 --- a/src/definitions/collections/form.less +++ b/src/definitions/collections/form.less @@ -48,7 +48,7 @@ margin: 0em 0em 0.3em; display: block; - color: #555555; + color: #111111; font-size: 0.875em; } @@ -79,7 +79,7 @@ .ui.form input[type="tel"] { margin: 0em; - padding: 0.5em 1em; + padding: 0.65em 1em; font-size: 1em; background-color: #FFFFFF; diff --git a/src/definitions/collections/grid.less b/src/definitions/collections/grid.less index 9700c601f..e684cca29 100644 --- a/src/definitions/collections/grid.less +++ b/src/definitions/collections/grid.less @@ -75,8 +75,8 @@ body > .ui.grid { .ui.grid > .row { display: block; width: 100% !important; - margin-top: @rowSpacing; - padding: @rowSpacing 0% 0%; + margin-top: (@rowSpacing / 2); + padding: (@rowSpacing / 2) 0% 0%; font-size: 0rem; } .ui.grid > .row:first-child { diff --git a/src/definitions/collections/menu.less b/src/definitions/collections/menu.less index 25a339c5e..72f45e91c 100644 --- a/src/definitions/collections/menu.less +++ b/src/definitions/collections/menu.less @@ -80,8 +80,7 @@ color: rgba(0, 0, 0, 0.85); } /* Active */ -.ui.menu .active.item, -.ui.menu .active.item a:not(.button) { +.ui.menu .active.item { color: @selectedTextColor; } @@ -998,6 +997,11 @@ text-transform: uppercase; font-weight: bold; } +.ui.text.menu .text.item { + opacity: 1; + color: rgba(50, 50, 50, 0.8); + font-weight: bold; +} /*--- fluid text ---*/ .ui.text.item.menu .item { @@ -1192,8 +1196,7 @@ .ui.inverted.menu .item .item > a { color: @invertedSubMenuColor; } -.ui.inverted.menu .dropdown .menu .item, -.ui.inverted.menu .dropdown .menu .item a { +.ui.inverted.menu .dropdown .menu .item { color: @dropdownTextColor !important; } .ui.inverted.menu .item.disabled, @@ -1238,8 +1241,7 @@ box-shadow: none !important; background-color: rgba(255, 255, 255, 0.2); } -.ui.inverted.menu .active.item, -.ui.inverted.menu .active.item a { +.ui.inverted.menu .active.item { color: rgba(255, 255, 255, 1) !important; } .ui.inverted.vertical.menu .item .menu .active.item { diff --git a/src/definitions/elements/header.less b/src/definitions/elements/header.less index 91a2c3a4d..347d8b8af 100644 --- a/src/definitions/elements/header.less +++ b/src/definitions/elements/header.less @@ -45,7 +45,7 @@ } /* Icon and Content Together */ -.ui.header .icon { +.ui.header > .icon { display: table-cell; font-size: @iconSize; padding-top: @iconOffset; @@ -53,7 +53,7 @@ vertical-align: @iconAlignment; padding-right: (@iconMargin / 2); } -.ui.header .icon + .content { +.ui.header > .icon + .content { padding-left: (@iconMargin / 2); display: table-cell; } @@ -70,6 +70,12 @@ } /* Positioning */ +.ui.header:first-child { + margin-top: 0em; +} +.ui.header:last-child { + margin-bottom: 0em; +} .ui.header + p { margin-top: @precedingParagraphMargin; } diff --git a/src/definitions/elements/image.less b/src/definitions/elements/image.less index aa4f0ebc8..dc14d2816 100644 --- a/src/definitions/elements/image.less +++ b/src/definitions/elements/image.less @@ -115,7 +115,6 @@ img.ui.image { } - /*------------------- Floated --------------------*/ diff --git a/src/definitions/elements/label.less b/src/definitions/elements/label.less index 3cdfcadd0..23cd5498a 100644 --- a/src/definitions/elements/label.less +++ b/src/definitions/elements/label.less @@ -99,6 +99,14 @@ a.ui.label { opacity: 1; } +/*------------------- + Group +--------------------*/ + +.ui.labels .label { + margin: 0em @groupHorizontalMargin @groupVerticalMargin 0em; +} + /*------------------- Coupling diff --git a/src/definitions/modules/checkbox.less b/src/definitions/modules/checkbox.less index 1f817f898..71f4cb641 100644 --- a/src/definitions/modules/checkbox.less +++ b/src/definitions/modules/checkbox.less @@ -301,7 +301,6 @@ content: ''; top: @toggleSwitchVerticalOffset; - left: 0em; z-index: 1; border: none; @@ -334,6 +333,18 @@ ; } +/* Off */ +/* +.ui.toggle.checkbox input + .box:before, +.ui.toggle.checkbox input + label:before { + background-color: @negativeCheckbox; +} +*/ +.ui.toggle.checkbox input + .box:after, +.ui.toggle.checkbox input + label:after { + left: @toggleOffOffset; +} + /* Focus */ .ui.toggle.checkbox input:focus + .box:before, .ui.toggle.checkbox input:focus + label:before { @@ -342,13 +353,17 @@ } /* Active */ +.ui.toggle.checkbox input:checked + .box, +.ui.toggle.checkbox input:checked + label { + color: @positiveCheckbox; +} .ui.toggle.checkbox input:checked + .box:before, .ui.toggle.checkbox input:checked + label:before { background-color: @positiveCheckbox; } .ui.toggle.checkbox input:checked + .box:after, .ui.toggle.checkbox input:checked + label:after { - left: 1em; + left: @toggleOnOffset; } diff --git a/src/definitions/modules/dropdown.js b/src/definitions/modules/dropdown.js index 517badd93..f5a57fca6 100644 --- a/src/definitions/modules/dropdown.js +++ b/src/definitions/modules/dropdown.js @@ -432,6 +432,20 @@ $.fn.dropdown = function(parameters) { }, set: { + scrollPosition: function() { + var + $activeItem = module.get.item(), + activeOffset = ($activeItem.size() > 0) + ? $activeItem.position().top + : false + ; + if(activeOffset) { + module.debug('Scrolling to active item'); + $menu + .scrollTop(activeOffset) + ; + } + }, text: function(text) { if(settings.action == 'combo') { module.debug('Changing combo button text', text, $combo); diff --git a/src/definitions/modules/dropdown.less b/src/definitions/modules/dropdown.less index 80b1be92e..ec4b5f37b 100644 --- a/src/definitions/modules/dropdown.less +++ b/src/definitions/modules/dropdown.less @@ -299,7 +299,7 @@ white-space: normal; background-color: #FFFFFF; - padding: 0.5em 1em; + padding: 0.65em 1em; line-height: 1.33; color: rgba(0, 0, 0, 0.8); diff --git a/src/definitions/modules/search.js b/src/definitions/modules/search.js index 98d22f224..f1395aae0 100644 --- a/src/definitions/modules/search.js +++ b/src/definitions/modules/search.js @@ -98,6 +98,8 @@ $.fn.search = function(parameters) { $module .addClass(className.focus) ; + clearTimeout(module.timer); + module.search.throttle(); module.results.show(); }, blur: function() { @@ -105,7 +107,7 @@ $.fn.search = function(parameters) { $module .removeClass(className.focus) ; - module.results.hide(); + module.timer = setTimeout(module.results.hide, settings.hideDelay); } }, handleKeyboard: function(event) { @@ -137,8 +139,8 @@ $.fn.search = function(parameters) { if($results.filter(':visible').size() > 0) { if(keyCode == keys.enter) { module.verbose('Enter key pressed, selecting active result'); - if( $result.filter('.' + activeClass).exists() ) { - $.proxy(module.results.select, $result.filter('.' + activeClass) )(); + if( $result.filter('.' + activeClass).size() > 0 ) { + $.proxy(module.results.select, $result.filter('.' + activeClass) )(event); event.preventDefault(); return false; } @@ -400,9 +402,6 @@ $.fn.search = function(parameters) { target = $link.attr('target') || false ; module.results.hide(); - $prompt - .val(title) - ; if(href) { if(target == '_blank' || event.ctrlKey) { window.open(href); @@ -415,6 +414,13 @@ $.fn.search = function(parameters) { } }, + // displays mesage visibly in search results + message: function(text, type) { + type = type || 'standard'; + module.results.add( settings.templates.message(text, type) ); + return settings.templates.message(text, type); + }, + setting: function(name, value) { if( $.isPlainObject(name) ) { $.extend(true, settings, name); @@ -616,6 +622,7 @@ $.fn.search.settings = { automatic : 'true', type : 'simple', + hideDelay : 600, minCharacters : 3, searchThrottle : 300, maxResults : 7, diff --git a/src/definitions/modules/search.less b/src/definitions/modules/search.less index 1f6171e40..d4b249512 100644 --- a/src/definitions/modules/search.less +++ b/src/definitions/modules/search.less @@ -99,17 +99,16 @@ -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; - width: 38px; - height: 38px; + height: 30px; } .ui.search .result .image img { display: block; - width: 38px; - height: 38px; + width: 73px; + height: 30px; } .ui.search .result .image ~ .info { float: none; - margin-left: 50px; + margin-left: 80px; } .ui.search .result .info { @@ -179,6 +178,7 @@ background-color: #FFFFFF; margin-left: 80px; border-left: 1px solid rgba(0, 0, 0, 0.1); + border-bottom: 1px solid rgba(0, 0, 0, 0.1); } /* View All Results */ @@ -217,7 +217,7 @@ ---------------*/ .ui.search.loading .input .icon { - background: url(../images/loader-mini.gif) no-repeat 50% 50%; + background: url(../../themes/packages/default/assets/images/loader-mini.gif) no-repeat 50% 50%; } .ui.search.loading .input .icon:before, .ui.search.loading .input .icon:after { diff --git a/src/definitions/modules/sticky.js b/src/definitions/modules/sticky.js index 75682f370..75b41e69a 100644 --- a/src/definitions/modules/sticky.js +++ b/src/definitions/modules/sticky.js @@ -88,6 +88,10 @@ $.fn.sticky = function(parameters) { destroy: function() { module.verbose('Destroying previous module'); module.reset(); + $window + .off('resize', module.event.resize) + .off('scroll', module.event.scroll) + ; $module .removeData(moduleNamespace) ; @@ -201,7 +205,7 @@ $.fn.sticky = function(parameters) { set: { containerSize: function() { if($module.is(':visible') && $container.get(0).tagName === 'HTML') { - module.error(error.container); + module.error(error.container, $container.get(0), $container.get(0).tagName); } else { module.debug('Settings container size', module.cache.context.height); @@ -259,6 +263,10 @@ $.fn.sticky = function(parameters) { if( screen.top < element.top ) { module.unfix(); } + else if( bottomEdge > context.bottom ) { + module.debug('Top attached rail has reached bottom of container'); + module.bindBottom(); + } } if(module.is.bottom() ) { // top edge @@ -267,10 +275,10 @@ $.fn.sticky = function(parameters) { } // bottom edge else if(screen.bottom > context.bottom) { + module.debug('Bottom attached rail has reached bottom of container'); module.bindBottom(); } } - // exit bottom of container if( bottomEdge > context.bottom ) { module.bindBottom(); } diff --git a/src/themes/packages/default/elements/button.variables b/src/themes/packages/default/elements/button.variables index 328007416..a53f4f0b2 100644 --- a/src/themes/packages/default/elements/button.variables +++ b/src/themes/packages/default/elements/button.variables @@ -83,7 +83,7 @@ @downBackgroundImage: ''; @downBoxShadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important; -@activeBackgroundColor: #EAEAEA; +@activeBackgroundColor: #DDDDDD; @activeBackgroundImage: none; @activeBoxShadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important; diff --git a/src/themes/packages/default/elements/input.variables b/src/themes/packages/default/elements/input.variables index 37f640bd1..ea784ebc1 100644 --- a/src/themes/packages/default/elements/input.variables +++ b/src/themes/packages/default/elements/input.variables @@ -85,7 +85,7 @@ @errorBoxShadow: none; /* Loading */ -@loadingImage: "../images/loader-mini.gif"; +@loadingImage: "@{imagePath}/loader-mini.gif"; /*------------------- Variations diff --git a/src/themes/packages/default/elements/label.variables b/src/themes/packages/default/elements/label.variables index 75a7e37c9..df6feea77 100644 --- a/src/themes/packages/default/elements/label.variables +++ b/src/themes/packages/default/elements/label.variables @@ -10,9 +10,12 @@ Standard --------------------*/ -@verticalMargin: -0.25em; +@verticalMargin: 0.25em; @horizontalMargin: 0.125em; +@groupVerticalMargin: 0.75em; +@groupHorizontalMargin: 0.5em; + @backgroundColor: #E8E8E8; @backgroundImage: none; diff --git a/src/themes/packages/default/modules/checkbox.variables b/src/themes/packages/default/modules/checkbox.variables index 5d15b4b43..1e6be57f1 100644 --- a/src/themes/packages/default/modules/checkbox.variables +++ b/src/themes/packages/default/modules/checkbox.variables @@ -68,11 +68,12 @@ @toggleSwitchVerticalOffset: (1em - @toggleSwitchHeight) / 2; @toggleFocusColor: @strongTransparentBlack; - @toggleHandleOffset: (1em - @handleSize) / 2; @toggleTravelDistance: @toggleSwitchWidth - @handleSize; @toggleLabelDistance: @toggleSwitchWidth + 1em; +@toggleOffOffset: -0.15em; +@toggleOnOffset: 1em;