You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@tapestry.apache.org by jk...@apache.org on 2014/06/30 10:30:19 UTC
[3/6] update Bootstrap to 3.2.0
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/js/popover.js
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/js/popover.js b/tapestry-webresources/src/test/webapp/bootstrap/js/popover.js
index 23aa829..825e1b3 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/js/popover.js
+++ b/tapestry-webresources/src/test/webapp/bootstrap/js/popover.js
@@ -1,5 +1,5 @@
/* ========================================================================
- * Bootstrap: popover.js v3.1.1
+ * Bootstrap: popover.js v3.2.0
* http://getbootstrap.com/javascript/#popovers
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@@ -19,11 +19,13 @@
if (!$.fn.tooltip) throw new Error('Popover requires tooltip.js')
+ Popover.VERSION = '3.2.0'
+
Popover.DEFAULTS = $.extend({}, $.fn.tooltip.Constructor.DEFAULTS, {
placement: 'right',
trigger: 'click',
content: '',
- template: '<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
+ template: '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
})
@@ -44,7 +46,7 @@
var content = this.getContent()
$tip.find('.popover-title')[this.options.html ? 'html' : 'text'](title)
- $tip.find('.popover-content')[ // we use append for html objects to maintain js events
+ $tip.find('.popover-content').empty()[ // we use append for html objects to maintain js events
this.options.html ? (typeof content == 'string' ? 'html' : 'append') : 'text'
](content)
@@ -70,7 +72,7 @@
}
Popover.prototype.arrow = function () {
- return this.$arrow = this.$arrow || this.tip().find('.arrow')
+ return (this.$arrow = this.$arrow || this.tip().find('.arrow'))
}
Popover.prototype.tip = function () {
@@ -82,9 +84,7 @@
// POPOVER PLUGIN DEFINITION
// =========================
- var old = $.fn.popover
-
- $.fn.popover = function (option) {
+ function Plugin(option) {
return this.each(function () {
var $this = $(this)
var data = $this.data('bs.popover')
@@ -96,6 +96,9 @@
})
}
+ var old = $.fn.popover
+
+ $.fn.popover = Plugin
$.fn.popover.Constructor = Popover
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/js/scrollspy.js
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/js/scrollspy.js b/tapestry-webresources/src/test/webapp/bootstrap/js/scrollspy.js
index 4346c86..db23787 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/js/scrollspy.js
+++ b/tapestry-webresources/src/test/webapp/bootstrap/js/scrollspy.js
@@ -1,5 +1,5 @@
/* ========================================================================
- * Bootstrap: scrollspy.js v3.1.1
+ * Bootstrap: scrollspy.js v3.2.0
* http://getbootstrap.com/javascript/#scrollspy
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@@ -14,36 +14,48 @@
// ==========================
function ScrollSpy(element, options) {
- var href
var process = $.proxy(this.process, this)
- this.$element = $(element).is('body') ? $(window) : $(element)
this.$body = $('body')
- this.$scrollElement = this.$element.on('scroll.bs.scroll-spy.data-api', process)
+ this.$scrollElement = $(element).is('body') ? $(window) : $(element)
this.options = $.extend({}, ScrollSpy.DEFAULTS, options)
- this.selector = (this.options.target
- || ((href = $(element).attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
- || '') + ' .nav li > a'
- this.offsets = $([])
- this.targets = $([])
+ this.selector = (this.options.target || '') + ' .nav li > a'
+ this.offsets = []
+ this.targets = []
this.activeTarget = null
+ this.scrollHeight = 0
+ this.$scrollElement.on('scroll.bs.scrollspy', process)
this.refresh()
this.process()
}
+ ScrollSpy.VERSION = '3.2.0'
+
ScrollSpy.DEFAULTS = {
offset: 10
}
+ ScrollSpy.prototype.getScrollHeight = function () {
+ return this.$scrollElement[0].scrollHeight || Math.max(this.$body[0].scrollHeight, document.documentElement.scrollHeight)
+ }
+
ScrollSpy.prototype.refresh = function () {
- var offsetMethod = this.$element[0] == window ? 'offset' : 'position'
+ var offsetMethod = 'offset'
+ var offsetBase = 0
- this.offsets = $([])
- this.targets = $([])
+ if (!$.isWindow(this.$scrollElement[0])) {
+ offsetMethod = 'position'
+ offsetBase = this.$scrollElement.scrollTop()
+ }
+
+ this.offsets = []
+ this.targets = []
+ this.scrollHeight = this.getScrollHeight()
var self = this
- var $targets = this.$body
+
+ this.$body
.find(this.selector)
.map(function () {
var $el = $(this)
@@ -53,7 +65,7 @@
return ($href
&& $href.length
&& $href.is(':visible')
- && [[ $href[offsetMethod]().top + (!$.isWindow(self.$scrollElement.get(0)) && self.$scrollElement.scrollTop()), href ]]) || null
+ && [[$href[offsetMethod]().top + offsetBase, href]]) || null
})
.sort(function (a, b) { return a[0] - b[0] })
.each(function () {
@@ -64,15 +76,19 @@
ScrollSpy.prototype.process = function () {
var scrollTop = this.$scrollElement.scrollTop() + this.options.offset
- var scrollHeight = this.$scrollElement[0].scrollHeight || this.$body[0].scrollHeight
- var maxScroll = scrollHeight - this.$scrollElement.height()
+ var scrollHeight = this.getScrollHeight()
+ var maxScroll = this.options.offset + scrollHeight - this.$scrollElement.height()
var offsets = this.offsets
var targets = this.targets
var activeTarget = this.activeTarget
var i
+ if (this.scrollHeight != scrollHeight) {
+ this.refresh()
+ }
+
if (scrollTop >= maxScroll) {
- return activeTarget != (i = targets.last()[0]) && this.activate(i)
+ return activeTarget != (i = targets[targets.length - 1]) && this.activate(i)
}
if (activeTarget && scrollTop <= offsets[0]) {
@@ -83,7 +99,7 @@
activeTarget != targets[i]
&& scrollTop >= offsets[i]
&& (!offsets[i + 1] || scrollTop <= offsets[i + 1])
- && this.activate( targets[i] )
+ && this.activate(targets[i])
}
}
@@ -115,9 +131,7 @@
// SCROLLSPY PLUGIN DEFINITION
// ===========================
- var old = $.fn.scrollspy
-
- $.fn.scrollspy = function (option) {
+ function Plugin(option) {
return this.each(function () {
var $this = $(this)
var data = $this.data('bs.scrollspy')
@@ -128,6 +142,9 @@
})
}
+ var old = $.fn.scrollspy
+
+ $.fn.scrollspy = Plugin
$.fn.scrollspy.Constructor = ScrollSpy
@@ -143,10 +160,10 @@
// SCROLLSPY DATA-API
// ==================
- $(window).on('load', function () {
+ $(window).on('load.bs.scrollspy.data-api', function () {
$('[data-spy="scroll"]').each(function () {
var $spy = $(this)
- $spy.scrollspy($spy.data())
+ Plugin.call($spy, $spy.data())
})
})
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/js/tab.js
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/js/tab.js b/tapestry-webresources/src/test/webapp/bootstrap/js/tab.js
index 400cb7b..c0e1e46 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/js/tab.js
+++ b/tapestry-webresources/src/test/webapp/bootstrap/js/tab.js
@@ -1,5 +1,5 @@
/* ========================================================================
- * Bootstrap: tab.js v3.1.1
+ * Bootstrap: tab.js v3.2.0
* http://getbootstrap.com/javascript/#tabs
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@@ -17,6 +17,8 @@
this.element = $(element)
}
+ Tab.VERSION = '3.2.0'
+
Tab.prototype.show = function () {
var $this = this.element
var $ul = $this.closest('ul:not(.dropdown-menu)')
@@ -24,7 +26,7 @@
if (!selector) {
selector = $this.attr('href')
- selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
+ selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
}
if ($this.parent('li').hasClass('active')) return
@@ -40,7 +42,7 @@
var $target = $(selector)
- this.activate($this.parent('li'), $ul)
+ this.activate($this.closest('li'), $ul)
this.activate($target, $target.parent(), function () {
$this.trigger({
type: 'shown.bs.tab',
@@ -79,7 +81,7 @@
transition ?
$active
- .one($.support.transition.end, next)
+ .one('bsTransitionEnd', next)
.emulateTransitionEnd(150) :
next()
@@ -90,9 +92,7 @@
// TAB PLUGIN DEFINITION
// =====================
- var old = $.fn.tab
-
- $.fn.tab = function ( option ) {
+ function Plugin(option) {
return this.each(function () {
var $this = $(this)
var data = $this.data('bs.tab')
@@ -102,6 +102,9 @@
})
}
+ var old = $.fn.tab
+
+ $.fn.tab = Plugin
$.fn.tab.Constructor = Tab
@@ -119,7 +122,7 @@
$(document).on('click.bs.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
e.preventDefault()
- $(this).tab('show')
+ Plugin.call($(this), 'show')
})
}(jQuery);
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/js/tooltip.js
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/js/tooltip.js b/tapestry-webresources/src/test/webapp/bootstrap/js/tooltip.js
index f6c0a37..9cdb6c9 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/js/tooltip.js
+++ b/tapestry-webresources/src/test/webapp/bootstrap/js/tooltip.js
@@ -1,5 +1,5 @@
/* ========================================================================
- * Bootstrap: tooltip.js v3.1.1
+ * Bootstrap: tooltip.js v3.2.0
* http://getbootstrap.com/javascript/#tooltip
* Inspired by the original jQuery.tipsy by Jason Frame
* ========================================================================
@@ -25,23 +25,30 @@
this.init('tooltip', element, options)
}
+ Tooltip.VERSION = '3.2.0'
+
Tooltip.DEFAULTS = {
animation: true,
placement: 'top',
selector: false,
- template: '<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',
+ template: '<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',
trigger: 'hover focus',
title: '',
delay: 0,
html: false,
- container: false
+ container: false,
+ viewport: {
+ selector: 'body',
+ padding: 0
+ }
}
Tooltip.prototype.init = function (type, element, options) {
- this.enabled = true
- this.type = type
- this.$element = $(element)
- this.options = this.getOptions(options)
+ this.enabled = true
+ this.type = type
+ this.$element = $(element)
+ this.options = this.getOptions(options)
+ this.$viewport = this.options.viewport && $(this.options.viewport.selector || this.options.viewport)
var triggers = this.options.trigger.split(' ')
@@ -94,7 +101,12 @@
Tooltip.prototype.enter = function (obj) {
var self = obj instanceof this.constructor ?
- obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
+ obj : $(obj.currentTarget).data('bs.' + this.type)
+
+ if (!self) {
+ self = new this.constructor(obj.currentTarget, this.getDelegateOptions())
+ $(obj.currentTarget).data('bs.' + this.type, self)
+ }
clearTimeout(self.timeout)
@@ -109,7 +121,12 @@
Tooltip.prototype.leave = function (obj) {
var self = obj instanceof this.constructor ?
- obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
+ obj : $(obj.currentTarget).data('bs.' + this.type)
+
+ if (!self) {
+ self = new this.constructor(obj.currentTarget, this.getDelegateOptions())
+ $(obj.currentTarget).data('bs.' + this.type, self)
+ }
clearTimeout(self.timeout)
@@ -128,12 +145,17 @@
if (this.hasContent() && this.enabled) {
this.$element.trigger(e)
- if (e.isDefaultPrevented()) return
- var that = this;
+ var inDom = $.contains(document.documentElement, this.$element[0])
+ if (e.isDefaultPrevented() || !inDom) return
+ var that = this
var $tip = this.tip()
+ var tipId = this.getUID(this.type)
+
this.setContent()
+ $tip.attr('id', tipId)
+ this.$element.attr('aria-describedby', tipId)
if (this.options.animation) $tip.addClass('fade')
@@ -149,6 +171,7 @@
.detach()
.css({ top: 0, left: 0, display: 'block' })
.addClass(placement)
+ .data('bs.' + this.type, this)
this.options.container ? $tip.appendTo(this.options.container) : $tip.insertAfter(this.$element)
@@ -157,18 +180,14 @@
var actualHeight = $tip[0].offsetHeight
if (autoPlace) {
- var $parent = this.$element.parent()
-
var orgPlacement = placement
- var docScroll = document.documentElement.scrollTop || document.body.scrollTop
- var parentWidth = this.options.container == 'body' ? window.innerWidth : $parent.outerWidth()
- var parentHeight = this.options.container == 'body' ? window.innerHeight : $parent.outerHeight()
- var parentLeft = this.options.container == 'body' ? 0 : $parent.offset().left
-
- placement = placement == 'bottom' && pos.top + pos.height + actualHeight - docScroll > parentHeight ? 'top' :
- placement == 'top' && pos.top - docScroll - actualHeight < 0 ? 'bottom' :
- placement == 'right' && pos.right + actualWidth > parentWidth ? 'left' :
- placement == 'left' && pos.left - actualWidth < parentLeft ? 'right' :
+ var $parent = this.$element.parent()
+ var parentDim = this.getPosition($parent)
+
+ placement = placement == 'bottom' && pos.top + pos.height + actualHeight - parentDim.scroll > parentDim.height ? 'top' :
+ placement == 'top' && pos.top - parentDim.scroll - actualHeight < 0 ? 'bottom' :
+ placement == 'right' && pos.right + actualWidth > parentDim.width ? 'left' :
+ placement == 'left' && pos.left - actualWidth < parentDim.left ? 'right' :
placement
$tip
@@ -179,22 +198,21 @@
var calculatedOffset = this.getCalculatedOffset(placement, pos, actualWidth, actualHeight)
this.applyPlacement(calculatedOffset, placement)
- this.hoverState = null
- var complete = function() {
+ var complete = function () {
that.$element.trigger('shown.bs.' + that.type)
+ that.hoverState = null
}
$.support.transition && this.$tip.hasClass('fade') ?
$tip
- .one($.support.transition.end, complete)
+ .one('bsTransitionEnd', complete)
.emulateTransitionEnd(150) :
complete()
}
}
Tooltip.prototype.applyPlacement = function (offset, placement) {
- var replace
var $tip = this.tip()
var width = $tip[0].offsetWidth
var height = $tip[0].offsetHeight
@@ -228,29 +246,20 @@
var actualHeight = $tip[0].offsetHeight
if (placement == 'top' && actualHeight != height) {
- replace = true
offset.top = offset.top + height - actualHeight
}
- if (/bottom|top/.test(placement)) {
- var delta = 0
+ var delta = this.getViewportAdjustedDelta(placement, offset, actualWidth, actualHeight)
- if (offset.left < 0) {
- delta = offset.left * -2
- offset.left = 0
+ if (delta.left) offset.left += delta.left
+ else offset.top += delta.top
- $tip.offset(offset)
+ var arrowDelta = delta.left ? delta.left * 2 - width + actualWidth : delta.top * 2 - height + actualHeight
+ var arrowPosition = delta.left ? 'left' : 'top'
+ var arrowOffsetPosition = delta.left ? 'offsetWidth' : 'offsetHeight'
- actualWidth = $tip[0].offsetWidth
- actualHeight = $tip[0].offsetHeight
- }
-
- this.replaceArrow(delta - width + actualWidth, actualWidth, 'left')
- } else {
- this.replaceArrow(actualHeight - height, actualHeight, 'top')
- }
-
- if (replace) $tip.offset(offset)
+ $tip.offset(offset)
+ this.replaceArrow(arrowDelta, $tip[0][arrowOffsetPosition], arrowPosition)
}
Tooltip.prototype.replaceArrow = function (delta, dimension, position) {
@@ -270,6 +279,8 @@
var $tip = this.tip()
var e = $.Event('hide.bs.' + this.type)
+ this.$element.removeAttr('aria-describedby')
+
function complete() {
if (that.hoverState != 'in') $tip.detach()
that.$element.trigger('hidden.bs.' + that.type)
@@ -283,7 +294,7 @@
$.support.transition && this.$tip.hasClass('fade') ?
$tip
- .one($.support.transition.end, complete)
+ .one('bsTransitionEnd', complete)
.emulateTransitionEnd(150) :
complete()
@@ -294,7 +305,7 @@
Tooltip.prototype.fixTitle = function () {
var $e = this.$element
- if ($e.attr('title') || typeof($e.attr('data-original-title')) != 'string') {
+ if ($e.attr('title') || typeof ($e.attr('data-original-title')) != 'string') {
$e.attr('data-original-title', $e.attr('title') || '').attr('title', '')
}
}
@@ -303,12 +314,15 @@
return this.getTitle()
}
- Tooltip.prototype.getPosition = function () {
- var el = this.$element[0]
- return $.extend({}, (typeof el.getBoundingClientRect == 'function') ? el.getBoundingClientRect() : {
- width: el.offsetWidth,
- height: el.offsetHeight
- }, this.$element.offset())
+ Tooltip.prototype.getPosition = function ($element) {
+ $element = $element || this.$element
+ var el = $element[0]
+ var isBody = el.tagName == 'BODY'
+ return $.extend({}, (typeof el.getBoundingClientRect == 'function') ? el.getBoundingClientRect() : null, {
+ scroll: isBody ? document.documentElement.scrollTop || document.body.scrollTop : $element.scrollTop(),
+ width: isBody ? $(window).width() : $element.outerWidth(),
+ height: isBody ? $(window).height() : $element.outerHeight()
+ }, isBody ? { top: 0, left: 0 } : $element.offset())
}
Tooltip.prototype.getCalculatedOffset = function (placement, pos, actualWidth, actualHeight) {
@@ -316,6 +330,35 @@
placement == 'top' ? { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2 } :
placement == 'left' ? { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth } :
/* placement == 'right' */ { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width }
+
+ }
+
+ Tooltip.prototype.getViewportAdjustedDelta = function (placement, pos, actualWidth, actualHeight) {
+ var delta = { top: 0, left: 0 }
+ if (!this.$viewport) return delta
+
+ var viewportPadding = this.options.viewport && this.options.viewport.padding || 0
+ var viewportDimensions = this.getPosition(this.$viewport)
+
+ if (/right|left/.test(placement)) {
+ var topEdgeOffset = pos.top - viewportPadding - viewportDimensions.scroll
+ var bottomEdgeOffset = pos.top + viewportPadding - viewportDimensions.scroll + actualHeight
+ if (topEdgeOffset < viewportDimensions.top) { // top overflow
+ delta.top = viewportDimensions.top - topEdgeOffset
+ } else if (bottomEdgeOffset > viewportDimensions.top + viewportDimensions.height) { // bottom overflow
+ delta.top = viewportDimensions.top + viewportDimensions.height - bottomEdgeOffset
+ }
+ } else {
+ var leftEdgeOffset = pos.left - viewportPadding
+ var rightEdgeOffset = pos.left + viewportPadding + actualWidth
+ if (leftEdgeOffset < viewportDimensions.left) { // left overflow
+ delta.left = viewportDimensions.left - leftEdgeOffset
+ } else if (rightEdgeOffset > viewportDimensions.width) { // right overflow
+ delta.left = viewportDimensions.left + viewportDimensions.width - rightEdgeOffset
+ }
+ }
+
+ return delta
}
Tooltip.prototype.getTitle = function () {
@@ -329,12 +372,18 @@
return title
}
+ Tooltip.prototype.getUID = function (prefix) {
+ do prefix += ~~(Math.random() * 1000000)
+ while (document.getElementById(prefix))
+ return prefix
+ }
+
Tooltip.prototype.tip = function () {
- return this.$tip = this.$tip || $(this.options.template)
+ return (this.$tip = this.$tip || $(this.options.template))
}
Tooltip.prototype.arrow = function () {
- return this.$arrow = this.$arrow || this.tip().find('.tooltip-arrow')
+ return (this.$arrow = this.$arrow || this.tip().find('.tooltip-arrow'))
}
Tooltip.prototype.validate = function () {
@@ -358,7 +407,15 @@
}
Tooltip.prototype.toggle = function (e) {
- var self = e ? $(e.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type) : this
+ var self = this
+ if (e) {
+ self = $(e.currentTarget).data('bs.' + this.type)
+ if (!self) {
+ self = new this.constructor(e.currentTarget, this.getDelegateOptions())
+ $(e.currentTarget).data('bs.' + this.type, self)
+ }
+ }
+
self.tip().hasClass('in') ? self.leave(self) : self.enter(self)
}
@@ -371,9 +428,7 @@
// TOOLTIP PLUGIN DEFINITION
// =========================
- var old = $.fn.tooltip
-
- $.fn.tooltip = function (option) {
+ function Plugin(option) {
return this.each(function () {
var $this = $(this)
var data = $this.data('bs.tooltip')
@@ -385,6 +440,9 @@
})
}
+ var old = $.fn.tooltip
+
+ $.fn.tooltip = Plugin
$.fn.tooltip.Constructor = Tooltip
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/js/transition.js
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/js/transition.js b/tapestry-webresources/src/test/webapp/bootstrap/js/transition.js
index efa8c17..83f85bf 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/js/transition.js
+++ b/tapestry-webresources/src/test/webapp/bootstrap/js/transition.js
@@ -1,5 +1,5 @@
/* ========================================================================
- * Bootstrap: transition.js v3.1.1
+ * Bootstrap: transition.js v3.2.0
* http://getbootstrap.com/javascript/#transitions
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@@ -17,10 +17,10 @@
var el = document.createElement('bootstrap')
var transEndEventNames = {
- 'WebkitTransition' : 'webkitTransitionEnd',
- 'MozTransition' : 'transitionend',
- 'OTransition' : 'oTransitionEnd otransitionend',
- 'transition' : 'transitionend'
+ WebkitTransition : 'webkitTransitionEnd',
+ MozTransition : 'transitionend',
+ OTransition : 'oTransitionEnd otransitionend',
+ transition : 'transitionend'
}
for (var name in transEndEventNames) {
@@ -34,8 +34,9 @@
// http://blog.alexmaccaw.com/css-transitions
$.fn.emulateTransitionEnd = function (duration) {
- var called = false, $el = this
- $(this).one($.support.transition.end, function () { called = true })
+ var called = false
+ var $el = this
+ $(this).one('bsTransitionEnd', function () { called = true })
var callback = function () { if (!called) $($el).trigger($.support.transition.end) }
setTimeout(callback, duration)
return this
@@ -43,6 +44,16 @@
$(function () {
$.support.transition = transitionEnd()
+
+ if (!$.support.transition) return
+
+ $.event.special.bsTransitionEnd = {
+ bindType: $.support.transition.end,
+ delegateType: $.support.transition.end,
+ handle: function (e) {
+ if ($(e.target).is(this)) return e.handleObj.handler.apply(this, arguments)
+ }
+ }
})
}(jQuery);
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/alerts.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/alerts.less b/tapestry-webresources/src/test/webapp/bootstrap/less/alerts.less
index 3eab066..df070b8 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/alerts.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/alerts.less
@@ -33,12 +33,13 @@
}
}
-// Dismissable alerts
+// Dismissible alerts
//
// Expand the right padding and account for the close button's positioning.
-.alert-dismissable {
- padding-right: (@alert-padding + 20);
+.alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0.
+.alert-dismissible {
+ padding-right: (@alert-padding + 20);
// Adjust close link position
.close {
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/badges.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/badges.less b/tapestry-webresources/src/test/webapp/bootstrap/less/badges.less
index 56828ca..20624f3 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/badges.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/badges.less
@@ -3,7 +3,7 @@
// --------------------------------------------------
-// Base classes
+// Base class
.badge {
display: inline-block;
min-width: 10px;
@@ -32,24 +32,24 @@
top: 0;
padding: 1px 5px;
}
-}
-// Hover state, but only for links
-a.badge {
- &:hover,
- &:focus {
- color: @badge-link-hover-color;
- text-decoration: none;
- cursor: pointer;
+ // Hover state, but only for links
+ a& {
+ &:hover,
+ &:focus {
+ color: @badge-link-hover-color;
+ text-decoration: none;
+ cursor: pointer;
+ }
}
-}
-// Account for counters in navs
-a.list-group-item.active > .badge,
-.nav-pills > .active > a > .badge {
- color: @badge-active-color;
- background-color: @badge-active-bg;
-}
-.nav-pills > li > a > .badge {
- margin-left: 3px;
+ // Account for badges in navs
+ a.list-group-item.active > &,
+ .nav-pills > .active > a > & {
+ color: @badge-active-color;
+ background-color: @badge-active-bg;
+ }
+ .nav-pills > li > a > & {
+ margin-left: 3px;
+ }
}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/bootstrap.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/bootstrap.less b/tapestry-webresources/src/test/webapp/bootstrap/less/bootstrap.less
index b368b87..61b7747 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/bootstrap.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/bootstrap.less
@@ -2,9 +2,10 @@
@import "variables.less";
@import "mixins.less";
-// Reset
+// Reset and dependencies
@import "normalize.less";
@import "print.less";
+@import "glyphicons.less";
// Core CSS
@import "scaffolding.less";
@@ -17,7 +18,6 @@
// Components
@import "component-animations.less";
-@import "glyphicons.less";
@import "dropdowns.less";
@import "button-groups.less";
@import "input-groups.less";
@@ -35,6 +35,7 @@
@import "media.less";
@import "list-group.less";
@import "panels.less";
+@import "responsive-embed.less";
@import "wells.less";
@import "close.less";
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/button-groups.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/button-groups.less b/tapestry-webresources/src/test/webapp/bootstrap/less/button-groups.less
index 27eb796..7021ecd 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/button-groups.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/button-groups.less
@@ -20,7 +20,7 @@
}
&:focus {
// Remove focus outline when dropdown JS adds it after closing the menu
- outline: none;
+ outline: 0;
}
}
}
@@ -216,11 +216,25 @@
> .btn-group .btn {
width: 100%;
}
+
+ > .btn-group .dropdown-menu {
+ left: auto;
+ }
}
// Checkbox and radio options
+//
+// In order to support the browser's form validation feedback, powered by the
+// `required` attribute, we have to "hide" the inputs via `opacity`. We cannot
+// use `display: none;` or `visibility: hidden;` as that also hides the popover.
+// This way, we ensure a DOM element is visible to position the popover from.
+//
+// See https://github.com/twbs/bootstrap/pull/12794 for more.
+
[data-toggle="buttons"] > .btn > input[type="radio"],
[data-toggle="buttons"] > .btn > input[type="checkbox"] {
- display: none;
+ position: absolute;
+ z-index: -1;
+ .opacity(0);
}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/buttons.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/buttons.less b/tapestry-webresources/src/test/webapp/bootstrap/less/buttons.less
index d4fc156..492bdc6 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/buttons.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/buttons.less
@@ -140,8 +140,6 @@
.btn-block {
display: block;
width: 100%;
- padding-left: 0;
- padding-right: 0;
}
// Vertically space out multiple block buttons
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/carousel.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/carousel.less b/tapestry-webresources/src/test/webapp/bootstrap/less/carousel.less
index e3fb8a2..1644ddf 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/carousel.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/carousel.less
@@ -28,7 +28,9 @@
> .active,
> .next,
- > .prev { display: block; }
+ > .prev {
+ display: block;
+ }
> .active {
left: 0;
@@ -91,7 +93,7 @@
// Hover/focus state
&:hover,
&:focus {
- outline: none;
+ outline: 0;
color: @carousel-control-color;
text-decoration: none;
.opacity(.9);
@@ -110,20 +112,22 @@
.icon-prev,
.glyphicon-chevron-left {
left: 50%;
+ margin-left: -10px;
}
.icon-next,
.glyphicon-chevron-right {
right: 50%;
+ margin-right: -10px;
}
.icon-prev,
.icon-next {
width: 20px;
height: 20px;
margin-top: -10px;
- margin-left: -10px;
font-family: serif;
}
+
.icon-prev {
&:before {
content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)
@@ -213,9 +217,16 @@
width: 30px;
height: 30px;
margin-top: -15px;
- margin-left: -15px;
font-size: 30px;
}
+ .glyphicon-chevron-left,
+ .icon-prev {
+ margin-left: -15px;
+ }
+ .glyphicon-chevron-right,
+ .icon-next {
+ margin-right: -15px;
+ }
}
// Show and left align the captions
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/code.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/code.less b/tapestry-webresources/src/test/webapp/bootstrap/less/code.less
index 3eed26c..baa13df 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/code.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/code.less
@@ -17,7 +17,6 @@ code {
font-size: 90%;
color: @code-color;
background-color: @code-bg;
- white-space: nowrap;
border-radius: @border-radius-base;
}
@@ -29,6 +28,12 @@ kbd {
background-color: @kbd-bg;
border-radius: @border-radius-small;
box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
+
+ kbd {
+ padding: 0;
+ font-size: 100%;
+ box-shadow: none;
+ }
}
// Blocks of code
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/component-animations.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/component-animations.less b/tapestry-webresources/src/test/webapp/bootstrap/less/component-animations.less
index 1efe45e..9400a0d 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/component-animations.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/component-animations.less
@@ -5,7 +5,7 @@
// Heads up!
//
// We don't use the `.opacity()` mixin here since it causes a bug with text
-// fields in IE7-8. Source: https://github.com/twitter/bootstrap/pull/3552.
+// fields in IE7-8. Source: https://github.com/twbs/bootstrap/pull/3552.
.fade {
opacity: 0;
@@ -17,10 +17,12 @@
.collapse {
display: none;
- &.in {
- display: block;
- }
+
+ &.in { display: block; }
+ tr&.in { display: table-row; }
+ tbody&.in { display: table-row-group; }
}
+
.collapsing {
position: relative;
height: 0;
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/dropdowns.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/dropdowns.less b/tapestry-webresources/src/test/webapp/bootstrap/less/dropdowns.less
index f165165..3eb7fc0 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/dropdowns.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/dropdowns.less
@@ -38,6 +38,7 @@
margin: 2px 0 0; // override default ul
list-style: none;
font-size: @font-size-base;
+ text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
background-color: @dropdown-bg;
border: 1px solid @dropdown-fallback-border; // IE8 fallback
border: 1px solid @dropdown-border;
@@ -154,6 +155,7 @@
font-size: @font-size-small;
line-height: @line-height-base;
color: @dropdown-header-color;
+ white-space: nowrap; // as with > li > a
}
// Backdrop to catch body clicks on mobile, etc.
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/forms.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/forms.less b/tapestry-webresources/src/test/webapp/bootstrap/less/forms.less
index f607b85..2c5e9bf 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/forms.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/forms.less
@@ -11,7 +11,7 @@ fieldset {
padding: 0;
margin: 0;
border: 0;
- // Chrome and Firefox set a `min-width: -webkit-min-content;` on fieldsets,
+ // Chrome and Firefox set a `min-width: min-content;` on fieldsets,
// so we reset that to ensure it behaves more like a standard block element.
// See https://github.com/twbs/bootstrap/issues/12359.
min-width: 0;
@@ -31,6 +31,7 @@ legend {
label {
display: inline-block;
+ max-width: 100%; // Force IE8 to wrap long content (see https://github.com/twbs/bootstrap/issues/13141)
margin-bottom: 5px;
font-weight: bold;
}
@@ -51,7 +52,7 @@ input[type="search"] {
input[type="radio"],
input[type="checkbox"] {
margin: 4px 0 0;
- margin-top: 1px \9; /* IE8-9 */
+ margin-top: 1px \9; // IE8-9
line-height: normal;
}
@@ -164,13 +165,28 @@ input[type="search"] {
}
-// Special styles for iOS date input
+// Special styles for iOS temporal inputs
//
-// In Mobile Safari, date inputs require a pixel line-height that matches the
-// given height of the input.
-
-input[type="date"] {
+// In Mobile Safari, setting `display: block` on temporal inputs causes the
+// text within the input to become vertically misaligned.
+// As a workaround, we set a pixel line-height that matches the
+// given height of the input. Since this fucks up everything else, we have to
+// appropriately reset it for Internet Explorer and the size variations.
+
+input[type="date"],
+input[type="time"],
+input[type="datetime-local"],
+input[type="month"] {
line-height: @input-height-base;
+ // IE8+ misaligns the text within date inputs, so we reset
+ line-height: @line-height-base ~"\0";
+
+ &.input-sm {
+ line-height: @input-height-small;
+ }
+ &.input-lg {
+ line-height: @input-height-large;
+ }
}
@@ -190,13 +206,15 @@ input[type="date"] {
.radio,
.checkbox {
+ position: relative;
display: block;
min-height: @line-height-computed; // clear the floating input if there is no label text
margin-top: 10px;
margin-bottom: 10px;
- padding-left: 20px;
+
label {
- display: inline;
+ padding-left: 20px;
+ margin-bottom: 0;
font-weight: normal;
cursor: pointer;
}
@@ -205,9 +223,11 @@ input[type="date"] {
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
- float: left;
+ position: absolute;
margin-left: -20px;
+ margin-top: 4px \9;
}
+
.radio + .radio,
.checkbox + .checkbox {
margin-top: -5px; // Move up sibling radios or checkboxes for tighter spacing
@@ -230,19 +250,55 @@ input[type="date"] {
}
// Apply same disabled cursor tweak as for inputs
+// Some special care is needed because <label>s don't inherit their parent's `cursor`.
//
// Note: Neither radios nor checkboxes can be readonly.
input[type="radio"],
-input[type="checkbox"],
-.radio,
+input[type="checkbox"] {
+ &[disabled],
+ &.disabled,
+ fieldset[disabled] & {
+ cursor: not-allowed;
+ }
+}
+// These classes are used directly on <label>s
.radio-inline,
-.checkbox,
.checkbox-inline {
- &[disabled],
+ &.disabled,
fieldset[disabled] & {
cursor: not-allowed;
}
}
+// These classes are used on elements with <label> descendants
+.radio,
+.checkbox {
+ &.disabled,
+ fieldset[disabled] & {
+ label {
+ cursor: not-allowed;
+ }
+ }
+}
+
+
+// Static form control text
+//
+// Apply class to a `p` element to make any string of text align with labels in
+// a horizontal form layout.
+
+.form-control-static {
+ // Size it appropriately next to real form controls
+ padding-top: (@padding-base-vertical + 1);
+ padding-bottom: (@padding-base-vertical + 1);
+ // Remove default margin from `p`
+ margin-bottom: 0;
+
+ &.input-lg,
+ &.input-sm {
+ padding-left: 0;
+ padding-right: 0;
+ }
+}
// Form control sizing
@@ -271,18 +327,28 @@ input[type="checkbox"],
.form-control {
padding-right: (@input-height-base * 1.25);
}
-
- // Feedback icon (requires .glyphicon classes)
- .form-control-feedback {
- position: absolute;
- top: (@line-height-computed + 5); // Height of the `label` and its margin
- right: 0;
- display: block;
- width: @input-height-base;
- height: @input-height-base;
- line-height: @input-height-base;
- text-align: center;
- }
+}
+// Feedback icon (requires .glyphicon classes)
+.form-control-feedback {
+ position: absolute;
+ top: (@line-height-computed + 5); // Height of the `label` and its margin
+ right: 0;
+ z-index: 2; // Ensure icon is above input groups
+ display: block;
+ width: @input-height-base;
+ height: @input-height-base;
+ line-height: @input-height-base;
+ text-align: center;
+}
+.input-lg + .form-control-feedback {
+ width: @input-height-large;
+ height: @input-height-large;
+ line-height: @input-height-large;
+}
+.input-sm + .form-control-feedback {
+ width: @input-height-small;
+ height: @input-height-small;
+ line-height: @input-height-small;
}
// Feedback states
@@ -297,13 +363,9 @@ input[type="checkbox"],
}
-// Static form control text
-//
-// Apply class to a `p` element to make any string of text align with labels in
-// a horizontal form layout.
-
-.form-control-static {
- margin-bottom: 0; // Remove default margin from `p`
+// Reposition feedback icon if label is hidden with "screenreader only" state
+.has-feedback label.sr-only ~ .form-control-feedback {
+ top: 0;
}
@@ -349,6 +411,18 @@ input[type="checkbox"],
width: auto; // Prevent labels from stacking above inputs in `.form-group`
vertical-align: middle;
}
+
+ .input-group {
+ display: inline-table;
+ vertical-align: middle;
+
+ .input-group-addon,
+ .input-group-btn,
+ .form-control {
+ width: auto;
+ }
+ }
+
// Input groups need that 100% width though
.input-group > .form-control {
width: 100%;
@@ -367,12 +441,15 @@ input[type="checkbox"],
display: inline-block;
margin-top: 0;
margin-bottom: 0;
- padding-left: 0;
vertical-align: middle;
+
+ label {
+ padding-left: 0;
+ }
}
.radio input[type="radio"],
.checkbox input[type="checkbox"] {
- float: none;
+ position: relative;
margin-left: 0;
}
@@ -394,8 +471,9 @@ input[type="checkbox"],
.form-horizontal {
- // Consistent vertical alignment of labels, radios, and checkboxes
- .control-label,
+ // Consistent vertical alignment of radios and checkboxes
+ //
+ // Labels also get some reset styles, but that is scoped to a media query below.
.radio,
.checkbox,
.radio-inline,
@@ -416,14 +494,13 @@ input[type="checkbox"],
.make-row();
}
- .form-control-static {
- padding-top: (@padding-base-vertical + 1);
- }
-
- // Only right align form labels here when the columns stop stacking
+ // Reset spacing and right align labels, but scope to media queries so that
+ // labels on narrow viewports stack the same as a default form example.
@media (min-width: @screen-sm-min) {
.control-label {
text-align: right;
+ margin-bottom: 0;
+ padding-top: (@padding-base-vertical + 1); // Default padding plus a border
}
}
@@ -435,4 +512,29 @@ input[type="checkbox"],
top: 0;
right: (@grid-gutter-width / 2);
}
+
+ // Form group sizes
+ //
+ // Quick utility class for applying `.input-lg` and `.input-sm` styles to the
+ // inputs and labels within a `.form-group`.
+ .form-group-lg {
+ @media (min-width: @screen-sm-min) {
+ .control-label {
+ padding-top: ((@padding-large-vertical * @line-height-large) + 1);
+ }
+ }
+ .form-control {
+ &:extend(.input-lg);
+ }
+ }
+ .form-group-sm {
+ @media (min-width: @screen-sm-min) {
+ .control-label {
+ padding-top: (@padding-small-vertical + 1);
+ }
+ }
+ .form-control {
+ &:extend(.input-sm);
+ }
+ }
}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/glyphicons.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/glyphicons.less b/tapestry-webresources/src/test/webapp/bootstrap/less/glyphicons.less
index 789c5e7..d3485dc 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/glyphicons.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/glyphicons.less
@@ -10,11 +10,11 @@
// Import the fonts
@font-face {
font-family: 'Glyphicons Halflings';
- src: ~"url('@{icon-font-path}@{icon-font-name}.eot')";
- src: ~"url('@{icon-font-path}@{icon-font-name}.eot?#iefix') format('embedded-opentype')",
- ~"url('@{icon-font-path}@{icon-font-name}.woff') format('woff')",
- ~"url('@{icon-font-path}@{icon-font-name}.ttf') format('truetype')",
- ~"url('@{icon-font-path}@{icon-font-name}.svg#@{icon-font-svg-id}') format('svg')";
+ src: url('@{icon-font-path}@{icon-font-name}.eot');
+ src: url('@{icon-font-path}@{icon-font-name}.eot?#iefix') format('embedded-opentype'),
+ url('@{icon-font-path}@{icon-font-name}.woff') format('woff'),
+ url('@{icon-font-path}@{icon-font-name}.ttf') format('truetype'),
+ url('@{icon-font-path}@{icon-font-name}.svg#@{icon-font-svg-id}') format('svg');
}
// Catchall baseclass
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/input-groups.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/input-groups.less b/tapestry-webresources/src/test/webapp/bootstrap/less/input-groups.less
index a111474..a8712f2 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/input-groups.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/input-groups.less
@@ -39,10 +39,14 @@
.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
-.input-group-lg > .input-group-btn > .btn { .input-lg(); }
+.input-group-lg > .input-group-btn > .btn {
+ .input-lg();
+}
.input-group-sm > .form-control,
.input-group-sm > .input-group-addon,
-.input-group-sm > .input-group-btn > .btn { .input-sm(); }
+.input-group-sm > .input-group-btn > .btn {
+ .input-sm();
+}
// Display as table-cell
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/jumbotron.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/jumbotron.less b/tapestry-webresources/src/test/webapp/bootstrap/less/jumbotron.less
index a15e169..27cd8b8 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/jumbotron.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/jumbotron.less
@@ -19,6 +19,10 @@
font-weight: 200;
}
+ > hr {
+ border-top-color: darken(@jumbotron-bg, 10%);
+ }
+
.container & {
border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container
}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/labels.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/labels.less b/tapestry-webresources/src/test/webapp/bootstrap/less/labels.less
index 5db1ed1..9a5a270 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/labels.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/labels.less
@@ -15,7 +15,7 @@
border-radius: .25em;
// Add hover effects, but only for links
- &[href] {
+ a& {
&:hover,
&:focus {
color: @label-link-hover-color;
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/list-group.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/list-group.less b/tapestry-webresources/src/test/webapp/bootstrap/less/list-group.less
index 3343f8e..1946bf5 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/list-group.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/list-group.less
@@ -62,8 +62,27 @@ a.list-group-item {
&:hover,
&:focus {
text-decoration: none;
+ color: @list-group-link-hover-color;
background-color: @list-group-hover-bg;
}
+}
+
+.list-group-item {
+ // Disabled state
+ &.disabled,
+ &.disabled:hover,
+ &.disabled:focus {
+ background-color: @list-group-disabled-bg;
+ color: @list-group-disabled-color;
+
+ // Force color to inherit for custom content
+ .list-group-item-heading {
+ color: inherit;
+ }
+ .list-group-item-text {
+ color: @list-group-disabled-text-color;
+ }
+ }
// Active class on item itself, not parent
&.active,
@@ -75,7 +94,9 @@ a.list-group-item {
border-color: @list-group-active-border;
// Force color to inherit for custom content
- .list-group-item-heading {
+ .list-group-item-heading,
+ .list-group-item-heading > small,
+ .list-group-item-heading > .small {
color: inherit;
}
.list-group-item-text {
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/mixins.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/mixins.less b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins.less
index 71723db..af4408f 100644
--- a/tapestry-webresources/src/test/webapp/bootstrap/less/mixins.less
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins.less
@@ -1,929 +1,39 @@
-//
// Mixins
// --------------------------------------------------
-
// Utilities
-// -------------------------
-
-// Clearfix
-// Source: http://nicolasgallagher.com/micro-clearfix-hack/
-//
-// For modern browsers
-// 1. The space content is one way to avoid an Opera bug when the
-// contenteditable attribute is included anywhere else in the document.
-// Otherwise it causes space to appear at the top and bottom of elements
-// that are clearfixed.
-// 2. The use of `table` rather than `block` is only necessary if using
-// `:before` to contain the top-margins of child elements.
-.clearfix() {
- &:before,
- &:after {
- content: " "; // 1
- display: table; // 2
- }
- &:after {
- clear: both;
- }
-}
-
-// WebKit-style focus
-.tab-focus() {
- // Default
- outline: thin dotted;
- // WebKit
- outline: 5px auto -webkit-focus-ring-color;
- outline-offset: -2px;
-}
-
-// Center-align a block level element
-.center-block() {
- display: block;
- margin-left: auto;
- margin-right: auto;
-}
-
-// Sizing shortcuts
-.size(@width; @height) {
- width: @width;
- height: @height;
-}
-.square(@size) {
- .size(@size; @size);
-}
-
-// Placeholder text
-.placeholder(@color: @input-color-placeholder) {
- &::-moz-placeholder { color: @color; // Firefox
- opacity: 1; } // See https://github.com/twbs/bootstrap/pull/11526
- &:-ms-input-placeholder { color: @color; } // Internet Explorer 10+
- &::-webkit-input-placeholder { color: @color; } // Safari and Chrome
-}
-
-// Text overflow
-// Requires inline-block or block for proper styling
-.text-overflow() {
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
-}
-
-// CSS image replacement
-//
-// Heads up! v3 launched with with only `.hide-text()`, but per our pattern for
-// mixins being reused as classes with the same name, this doesn't hold up. As
-// of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`. Note
-// that we cannot chain the mixins together in Less, so they are repeated.
-//
-// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
-
-// Deprecated as of v3.0.1 (will be removed in v4)
-.hide-text() {
- font: ~"0/0" a;
- color: transparent;
- text-shadow: none;
- background-color: transparent;
- border: 0;
-}
-// New mixin to use as of v3.0.1
-.text-hide() {
- .hide-text();
-}
-
-
-
-// CSS3 PROPERTIES
-// --------------------------------------------------
-
-// Single side border-radius
-.border-top-radius(@radius) {
- border-top-right-radius: @radius;
- border-top-left-radius: @radius;
-}
-.border-right-radius(@radius) {
- border-bottom-right-radius: @radius;
- border-top-right-radius: @radius;
-}
-.border-bottom-radius(@radius) {
- border-bottom-right-radius: @radius;
- border-bottom-left-radius: @radius;
-}
-.border-left-radius(@radius) {
- border-bottom-left-radius: @radius;
- border-top-left-radius: @radius;
-}
-
-// Drop shadows
-//
-// Note: Deprecated `.box-shadow()` as of v3.1.0 since all of Bootstrap's
-// supported browsers that have box shadow capabilities now support the
-// standard `box-shadow` property.
-.box-shadow(@shadow) {
- -webkit-box-shadow: @shadow; // iOS <4.3 & Android <4.1
- box-shadow: @shadow;
-}
-
-// Transitions
-.transition(@transition) {
- -webkit-transition: @transition;
- transition: @transition;
-}
-.transition-property(@transition-property) {
- -webkit-transition-property: @transition-property;
- transition-property: @transition-property;
-}
-.transition-delay(@transition-delay) {
- -webkit-transition-delay: @transition-delay;
- transition-delay: @transition-delay;
-}
-.transition-duration(@transition-duration) {
- -webkit-transition-duration: @transition-duration;
- transition-duration: @transition-duration;
-}
-.transition-transform(@transition) {
- -webkit-transition: -webkit-transform @transition;
- -moz-transition: -moz-transform @transition;
- -o-transition: -o-transform @transition;
- transition: transform @transition;
-}
-
-// Transformations
-.rotate(@degrees) {
- -webkit-transform: rotate(@degrees);
- -ms-transform: rotate(@degrees); // IE9 only
- transform: rotate(@degrees);
-}
-.scale(@ratio; @ratio-y...) {
- -webkit-transform: scale(@ratio, @ratio-y);
- -ms-transform: scale(@ratio, @ratio-y); // IE9 only
- transform: scale(@ratio, @ratio-y);
-}
-.translate(@x; @y) {
- -webkit-transform: translate(@x, @y);
- -ms-transform: translate(@x, @y); // IE9 only
- transform: translate(@x, @y);
-}
-.skew(@x; @y) {
- -webkit-transform: skew(@x, @y);
- -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+
- transform: skew(@x, @y);
-}
-.translate3d(@x; @y; @z) {
- -webkit-transform: translate3d(@x, @y, @z);
- transform: translate3d(@x, @y, @z);
-}
-
-.rotateX(@degrees) {
- -webkit-transform: rotateX(@degrees);
- -ms-transform: rotateX(@degrees); // IE9 only
- transform: rotateX(@degrees);
-}
-.rotateY(@degrees) {
- -webkit-transform: rotateY(@degrees);
- -ms-transform: rotateY(@degrees); // IE9 only
- transform: rotateY(@degrees);
-}
-.perspective(@perspective) {
- -webkit-perspective: @perspective;
- -moz-perspective: @perspective;
- perspective: @perspective;
-}
-.perspective-origin(@perspective) {
- -webkit-perspective-origin: @perspective;
- -moz-perspective-origin: @perspective;
- perspective-origin: @perspective;
-}
-.transform-origin(@origin) {
- -webkit-transform-origin: @origin;
- -moz-transform-origin: @origin;
- -ms-transform-origin: @origin; // IE9 only
- transform-origin: @origin;
-}
-
-// Animations
-.animation(@animation) {
- -webkit-animation: @animation;
- animation: @animation;
-}
-.animation-name(@name) {
- -webkit-animation-name: @name;
- animation-name: @name;
-}
-.animation-duration(@duration) {
- -webkit-animation-duration: @duration;
- animation-duration: @duration;
-}
-.animation-timing-function(@timing-function) {
- -webkit-animation-timing-function: @timing-function;
- animation-timing-function: @timing-function;
-}
-.animation-delay(@delay) {
- -webkit-animation-delay: @delay;
- animation-delay: @delay;
-}
-.animation-iteration-count(@iteration-count) {
- -webkit-animation-iteration-count: @iteration-count;
- animation-iteration-count: @iteration-count;
-}
-.animation-direction(@direction) {
- -webkit-animation-direction: @direction;
- animation-direction: @direction;
-}
-
-// Backface visibility
-// Prevent browsers from flickering when using CSS 3D transforms.
-// Default value is `visible`, but can be changed to `hidden`
-.backface-visibility(@visibility){
- -webkit-backface-visibility: @visibility;
- -moz-backface-visibility: @visibility;
- backface-visibility: @visibility;
-}
-
-// Box sizing
-.box-sizing(@boxmodel) {
- -webkit-box-sizing: @boxmodel;
- -moz-box-sizing: @boxmodel;
- box-sizing: @boxmodel;
-}
-
-// User select
-// For selecting text on the page
-.user-select(@select) {
- -webkit-user-select: @select;
- -moz-user-select: @select;
- -ms-user-select: @select; // IE10+
- user-select: @select;
-}
-
-// Resize anything
-.resizable(@direction) {
- resize: @direction; // Options: horizontal, vertical, both
- overflow: auto; // Safari fix
-}
-
-// CSS3 Content Columns
-.content-columns(@column-count; @column-gap: @grid-gutter-width) {
- -webkit-column-count: @column-count;
- -moz-column-count: @column-count;
- column-count: @column-count;
- -webkit-column-gap: @column-gap;
- -moz-column-gap: @column-gap;
- column-gap: @column-gap;
-}
-
-// Optional hyphenation
-.hyphens(@mode: auto) {
- word-wrap: break-word;
- -webkit-hyphens: @mode;
- -moz-hyphens: @mode;
- -ms-hyphens: @mode; // IE10+
- -o-hyphens: @mode;
- hyphens: @mode;
-}
-
-// Opacity
-.opacity(@opacity) {
- opacity: @opacity;
- // IE8 filter
- @opacity-ie: (@opacity * 100);
- filter: ~"alpha(opacity=@{opacity-ie})";
-}
-
-
-
-// GRADIENTS
-// --------------------------------------------------
-
-#gradient {
-
- // Horizontal gradient, from left to right
- //
- // Creates two color stops, start and end, by specifying a color and position for each color stop.
- // Color stops are not available in IE9 and below.
- .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
- background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent)); // Safari 5.1-6, Chrome 10+
- background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
- background-repeat: repeat-x;
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down
- }
-
- // Vertical gradient, from top to bottom
- //
- // Creates two color stops, start and end, by specifying a color and position for each color stop.
- // Color stops are not available in IE9 and below.
- .vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
- background-image: -webkit-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Safari 5.1-6, Chrome 10+
- background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
- background-repeat: repeat-x;
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down
- }
-
- .directional(@start-color: #555; @end-color: #333; @deg: 45deg) {
- background-repeat: repeat-x;
- background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1-6, Chrome 10+
- background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
- }
- .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
- background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
- background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color);
- background-repeat: no-repeat;
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
- }
- .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
- background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color);
- background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color);
- background-repeat: no-repeat;
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
- }
- .radial(@inner-color: #555; @outer-color: #333) {
- background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color);
- background-image: radial-gradient(circle, @inner-color, @outer-color);
- background-repeat: no-repeat;
- }
- .striped(@color: rgba(255,255,255,.15); @angle: 45deg) {
- background-image: -webkit-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);
- background-image: linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);
- }
-}
-
-// Reset filters for IE
-//
-// When you need to remove a gradient background, do not forget to use this to reset
-// the IE filter for IE9 and below.
-.reset-filter() {
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
-}
-
-
-
-// Retina images
-//
-// Short retina mixin for setting background-image and -size
-
-.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) {
- background-image: url("@{file-1x}");
-
- @media
- only screen and (-webkit-min-device-pixel-ratio: 2),
- only screen and ( min--moz-device-pixel-ratio: 2),
- only screen and ( -o-min-device-pixel-ratio: 2/1),
- only screen and ( min-device-pixel-ratio: 2),
- only screen and ( min-resolution: 192dpi),
- only screen and ( min-resolution: 2dppx) {
- background-image: url("@{file-2x}");
- background-size: @width-1x @height-1x;
- }
-}
-
-
-// Responsive image
-//
-// Keep images from scaling beyond the width of their parents.
-
-.img-responsive(@display: block) {
- display: @display;
- max-width: 100%; // Part 1: Set a maximum relative to the parent
- height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
-}
-
-
-// COMPONENT MIXINS
-// --------------------------------------------------
-
-// Horizontal dividers
-// -------------------------
-// Dividers (basically an hr) within dropdowns and nav lists
-.nav-divider(@color: #e5e5e5) {
- height: 1px;
- margin: ((@line-height-computed / 2) - 1) 0;
- overflow: hidden;
- background-color: @color;
-}
-
-// Panels
-// -------------------------
-.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) {
- border-color: @border;
-
- & > .panel-heading {
- color: @heading-text-color;
- background-color: @heading-bg-color;
- border-color: @heading-border;
-
- + .panel-collapse .panel-body {
- border-top-color: @border;
- }
- }
- & > .panel-footer {
- + .panel-collapse .panel-body {
- border-bottom-color: @border;
- }
- }
-}
-
-// Alerts
-// -------------------------
-.alert-variant(@background; @border; @text-color) {
- background-color: @background;
- border-color: @border;
- color: @text-color;
-
- hr {
- border-top-color: darken(@border, 5%);
- }
- .alert-link {
- color: darken(@text-color, 10%);
- }
-}
-
-// Tables
-// -------------------------
-.table-row-variant(@state; @background) {
- // Exact selectors below required to override `.table-striped` and prevent
- // inheritance to nested tables.
- .table > thead > tr,
- .table > tbody > tr,
- .table > tfoot > tr {
- > td.@{state},
- > th.@{state},
- &.@{state} > td,
- &.@{state} > th {
- background-color: @background;
- }
- }
-
- // Hover states for `.table-hover`
- // Note: this is not available for cells or rows within `thead` or `tfoot`.
- .table-hover > tbody > tr {
- > td.@{state}:hover,
- > th.@{state}:hover,
- &.@{state}:hover > td,
- &.@{state}:hover > th {
- background-color: darken(@background, 5%);
- }
- }
-}
-
-// List Groups
-// -------------------------
-.list-group-item-variant(@state; @background; @color) {
- .list-group-item-@{state} {
- color: @color;
- background-color: @background;
-
- a& {
- color: @color;
-
- .list-group-item-heading { color: inherit; }
-
- &:hover,
- &:focus {
- color: @color;
- background-color: darken(@background, 5%);
- }
- &.active,
- &.active:hover,
- &.active:focus {
- color: #fff;
- background-color: @color;
- border-color: @color;
- }
- }
- }
-}
-
-// Button variants
-// -------------------------
-// Easily pump out default styles, as well as :hover, :focus, :active,
-// and disabled options for all buttons
-.button-variant(@color; @background; @border) {
- color: @color;
- background-color: @background;
- border-color: @border;
-
- &:hover,
- &:focus,
- &:active,
- &.active,
- .open .dropdown-toggle& {
- color: @color;
- background-color: darken(@background, 8%);
- border-color: darken(@border, 12%);
- }
- &:active,
- &.active,
- .open .dropdown-toggle& {
- background-image: none;
- }
- &.disabled,
- &[disabled],
- fieldset[disabled] & {
- &,
- &:hover,
- &:focus,
- &:active,
- &.active {
- background-color: @background;
- border-color: @border;
- }
- }
-
- .badge {
- color: @background;
- background-color: @color;
- }
-}
-
-// Button sizes
-// -------------------------
-.button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
- padding: @padding-vertical @padding-horizontal;
- font-size: @font-size;
- line-height: @line-height;
- border-radius: @border-radius;
-}
-
-// Pagination
-// -------------------------
-.pagination-size(@padding-vertical; @padding-horizontal; @font-size; @border-radius) {
- > li {
- > a,
- > span {
- padding: @padding-vertical @padding-horizontal;
- font-size: @font-size;
- }
- &:first-child {
- > a,
- > span {
- .border-left-radius(@border-radius);
- }
- }
- &:last-child {
- > a,
- > span {
- .border-right-radius(@border-radius);
- }
- }
- }
-}
-
-// Labels
-// -------------------------
-.label-variant(@color) {
- background-color: @color;
- &[href] {
- &:hover,
- &:focus {
- background-color: darken(@color, 10%);
- }
- }
-}
-
-// Contextual backgrounds
-// -------------------------
-.bg-variant(@color) {
- background-color: @color;
- a&:hover {
- background-color: darken(@color, 10%);
- }
-}
-
-// Typography
-// -------------------------
-.text-emphasis-variant(@color) {
- color: @color;
- a&:hover {
- color: darken(@color, 10%);
- }
-}
-
-// Navbar vertical align
-// -------------------------
-// Vertically center elements in the navbar.
-// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.
-.navbar-vertical-align(@element-height) {
- margin-top: ((@navbar-height - @element-height) / 2);
- margin-bottom: ((@navbar-height - @element-height) / 2);
-}
-
-// Progress bars
-// -------------------------
-.progress-bar-variant(@color) {
- background-color: @color;
- .progress-striped & {
- #gradient > .striped();
- }
-}
-
-// Responsive utilities
-// -------------------------
-// More easily include all the states for responsive-utilities.less.
-.responsive-visibility() {
- display: block !important;
- table& { display: table; }
- tr& { display: table-row !important; }
- th&,
- td& { display: table-cell !important; }
-}
-
-.responsive-invisibility() {
- display: none !important;
-}
-
-
-// Grid System
-// -----------
-
-// Centered container element
-.container-fixed() {
- margin-right: auto;
- margin-left: auto;
- padding-left: (@grid-gutter-width / 2);
- padding-right: (@grid-gutter-width / 2);
- &:extend(.clearfix all);
-}
-
-// Creates a wrapper for a series of columns
-.make-row(@gutter: @grid-gutter-width) {
- margin-left: (@gutter / -2);
- margin-right: (@gutter / -2);
- &:extend(.clearfix all);
-}
-
-// Generate the extra small columns
-.make-xs-column(@columns; @gutter: @grid-gutter-width) {
- position: relative;
- float: left;
- width: percentage((@columns / @grid-columns));
- min-height: 1px;
- padding-left: (@gutter / 2);
- padding-right: (@gutter / 2);
-}
-.make-xs-column-offset(@columns) {
- @media (min-width: @screen-xs-min) {
- margin-left: percentage((@columns / @grid-columns));
- }
-}
-.make-xs-column-push(@columns) {
- @media (min-width: @screen-xs-min) {
- left: percentage((@columns / @grid-columns));
- }
-}
-.make-xs-column-pull(@columns) {
- @media (min-width: @screen-xs-min) {
- right: percentage((@columns / @grid-columns));
- }
-}
-
-
-// Generate the small columns
-.make-sm-column(@columns; @gutter: @grid-gutter-width) {
- position: relative;
- min-height: 1px;
- padding-left: (@gutter / 2);
- padding-right: (@gutter / 2);
-
- @media (min-width: @screen-sm-min) {
- float: left;
- width: percentage((@columns / @grid-columns));
- }
-}
-.make-sm-column-offset(@columns) {
- @media (min-width: @screen-sm-min) {
- margin-left: percentage((@columns / @grid-columns));
- }
-}
-.make-sm-column-push(@columns) {
- @media (min-width: @screen-sm-min) {
- left: percentage((@columns / @grid-columns));
- }
-}
-.make-sm-column-pull(@columns) {
- @media (min-width: @screen-sm-min) {
- right: percentage((@columns / @grid-columns));
- }
-}
-
-
-// Generate the medium columns
-.make-md-column(@columns; @gutter: @grid-gutter-width) {
- position: relative;
- min-height: 1px;
- padding-left: (@gutter / 2);
- padding-right: (@gutter / 2);
-
- @media (min-width: @screen-md-min) {
- float: left;
- width: percentage((@columns / @grid-columns));
- }
-}
-.make-md-column-offset(@columns) {
- @media (min-width: @screen-md-min) {
- margin-left: percentage((@columns / @grid-columns));
- }
-}
-.make-md-column-push(@columns) {
- @media (min-width: @screen-md-min) {
- left: percentage((@columns / @grid-columns));
- }
-}
-.make-md-column-pull(@columns) {
- @media (min-width: @screen-md-min) {
- right: percentage((@columns / @grid-columns));
- }
-}
-
-
-// Generate the large columns
-.make-lg-column(@columns; @gutter: @grid-gutter-width) {
- position: relative;
- min-height: 1px;
- padding-left: (@gutter / 2);
- padding-right: (@gutter / 2);
-
- @media (min-width: @screen-lg-min) {
- float: left;
- width: percentage((@columns / @grid-columns));
- }
-}
-.make-lg-column-offset(@columns) {
- @media (min-width: @screen-lg-min) {
- margin-left: percentage((@columns / @grid-columns));
- }
-}
-.make-lg-column-push(@columns) {
- @media (min-width: @screen-lg-min) {
- left: percentage((@columns / @grid-columns));
- }
-}
-.make-lg-column-pull(@columns) {
- @media (min-width: @screen-lg-min) {
- right: percentage((@columns / @grid-columns));
- }
-}
-
-
-// Framework grid generation
-//
-// Used only by Bootstrap to generate the correct number of grid classes given
-// any value of `@grid-columns`.
-
-.make-grid-columns() {
- // Common styles for all sizes of grid columns, widths 1-12
- .col(@index) when (@index = 1) { // initial
- @item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
- .col((@index + 1), @item);
- }
- .col(@index, @list) when (@index =< @grid-columns) { // general; "=<" isn't a typo
- @item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
- .col((@index + 1), ~"@{list}, @{item}");
- }
- .col(@index, @list) when (@index > @grid-columns) { // terminal
- @{list} {
- position: relative;
- // Prevent columns from collapsing when empty
- min-height: 1px;
- // Inner gutter via padding
- padding-left: (@grid-gutter-width / 2);
- padding-right: (@grid-gutter-width / 2);
- }
- }
- .col(1); // kickstart it
-}
-
-.float-grid-columns(@class) {
- .col(@index) when (@index = 1) { // initial
- @item: ~".col-@{class}-@{index}";
- .col((@index + 1), @item);
- }
- .col(@index, @list) when (@index =< @grid-columns) { // general
- @item: ~".col-@{class}-@{index}";
- .col((@index + 1), ~"@{list}, @{item}");
- }
- .col(@index, @list) when (@index > @grid-columns) { // terminal
- @{list} {
- float: left;
- }
- }
- .col(1); // kickstart it
-}
-
-.calc-grid-column(@index, @class, @type) when (@type = width) and (@index > 0) {
- .col-@{class}-@{index} {
- width: percentage((@index / @grid-columns));
- }
-}
-.calc-grid-column(@index, @class, @type) when (@type = push) {
- .col-@{class}-push-@{index} {
- left: percentage((@index / @grid-columns));
- }
-}
-.calc-grid-column(@index, @class, @type) when (@type = pull) {
- .col-@{class}-pull-@{index} {
- right: percentage((@index / @grid-columns));
- }
-}
-.calc-grid-column(@index, @class, @type) when (@type = offset) {
- .col-@{class}-offset-@{index} {
- margin-left: percentage((@index / @grid-columns));
- }
-}
-
-// Basic looping in LESS
-.loop-grid-columns(@index, @class, @type) when (@index >= 0) {
- .calc-grid-column(@index, @class, @type);
- // next iteration
- .loop-grid-columns((@index - 1), @class, @type);
-}
-
-// Create grid for specific class
-.make-grid(@class) {
- .float-grid-columns(@class);
- .loop-grid-columns(@grid-columns, @class, width);
- .loop-grid-columns(@grid-columns, @class, pull);
- .loop-grid-columns(@grid-columns, @class, push);
- .loop-grid-columns(@grid-columns, @class, offset);
-}
-
-// Form validation states
-//
-// Used in forms.less to generate the form validation CSS for warnings, errors,
-// and successes.
-
-.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) {
- // Color the label and help text
- .help-block,
- .control-label,
- .radio,
- .checkbox,
- .radio-inline,
- .checkbox-inline {
- color: @text-color;
- }
- // Set the border and box shadow on specific inputs to match
- .form-control {
- border-color: @border-color;
- .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
- &:focus {
- border-color: darken(@border-color, 10%);
- @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%);
- .box-shadow(@shadow);
- }
- }
- // Set validation states also for addons
- .input-group-addon {
- color: @text-color;
- border-color: @border-color;
- background-color: @background-color;
- }
- // Optional feedback icon
- .form-control-feedback {
- color: @text-color;
- }
-}
-
-// Form control focus state
-//
-// Generate a customized focus state and for any input with the specified color,
-// which defaults to the `@input-focus-border` variable.
-//
-// We highly encourage you to not customize the default value, but instead use
-// this to tweak colors on an as-needed basis. This aesthetic change is based on
-// WebKit's default styles, but applicable to a wider range of browsers. Its
-// usability and accessibility should be taken into account with any change.
-//
-// Example usage: change the default blue border and shadow to white for better
-// contrast against a dark gray background.
-
-.form-control-focus(@color: @input-border-focus) {
- @color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
- &:focus {
- border-color: @color;
- outline: 0;
- .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}");
- }
-}
-
-// Form control sizing
-//
-// Relative text size, padding, and border-radii changes for form controls. For
-// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
-// element gets special love because it's special, and that's a fact!
-
-.input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
- height: @input-height;
- padding: @padding-vertical @padding-horizontal;
- font-size: @font-size;
- line-height: @line-height;
- border-radius: @border-radius;
-
- select& {
- height: @input-height;
- line-height: @input-height;
- }
-
- textarea&,
- select[multiple]& {
- height: auto;
- }
-}
+@import "mixins/hide-text.less";
+@import "mixins/opacity.less";
+@import "mixins/image.less";
+@import "mixins/labels.less";
+@import "mixins/reset-filter.less";
+@import "mixins/resize.less";
+@import "mixins/responsive-visibility.less";
+@import "mixins/size.less";
+@import "mixins/tab-focus.less";
+@import "mixins/text-emphasis.less";
+@import "mixins/text-overflow.less";
+@import "mixins/vendor-prefixes.less";
+
+// Components
+@import "mixins/alerts.less";
+@import "mixins/buttons.less";
+@import "mixins/panels.less";
+@import "mixins/pagination.less";
+@import "mixins/list-group.less";
+@import "mixins/nav-divider.less";
+@import "mixins/forms.less";
+@import "mixins/progress-bar.less";
+@import "mixins/table-row.less";
+
+// Skins
+@import "mixins/background-variant.less";
+@import "mixins/border-radius.less";
+@import "mixins/gradients.less";
+
+// Layout
+@import "mixins/clearfix.less";
+@import "mixins/center-block.less";
+@import "mixins/nav-vertical-align.less";
+@import "mixins/grid-framework.less";
+@import "mixins/grid.less";
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/alerts.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/alerts.less b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/alerts.less
new file mode 100644
index 0000000..396196f
--- /dev/null
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/alerts.less
@@ -0,0 +1,14 @@
+// Alerts
+
+.alert-variant(@background; @border; @text-color) {
+ background-color: @background;
+ border-color: @border;
+ color: @text-color;
+
+ hr {
+ border-top-color: darken(@border, 5%);
+ }
+ .alert-link {
+ color: darken(@text-color, 10%);
+ }
+}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/background-variant.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/background-variant.less b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/background-variant.less
new file mode 100644
index 0000000..556e490
--- /dev/null
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/background-variant.less
@@ -0,0 +1,8 @@
+// Contextual backgrounds
+
+.bg-variant(@color) {
+ background-color: @color;
+ a&:hover {
+ background-color: darken(@color, 10%);
+ }
+}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/border-radius.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/border-radius.less b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/border-radius.less
new file mode 100644
index 0000000..ca05dbf
--- /dev/null
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/border-radius.less
@@ -0,0 +1,18 @@
+// Single side border-radius
+
+.border-top-radius(@radius) {
+ border-top-right-radius: @radius;
+ border-top-left-radius: @radius;
+}
+.border-right-radius(@radius) {
+ border-bottom-right-radius: @radius;
+ border-top-right-radius: @radius;
+}
+.border-bottom-radius(@radius) {
+ border-bottom-right-radius: @radius;
+ border-bottom-left-radius: @radius;
+}
+.border-left-radius(@radius) {
+ border-bottom-left-radius: @radius;
+ border-top-left-radius: @radius;
+}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/buttons.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/buttons.less b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/buttons.less
new file mode 100644
index 0000000..409f8f2
--- /dev/null
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/buttons.less
@@ -0,0 +1,50 @@
+// Button variants
+//
+// Easily pump out default styles, as well as :hover, :focus, :active,
+// and disabled options for all buttons
+
+.button-variant(@color; @background; @border) {
+ color: @color;
+ background-color: @background;
+ border-color: @border;
+
+ &:hover,
+ &:focus,
+ &:active,
+ &.active,
+ .open > .dropdown-toggle& {
+ color: @color;
+ background-color: darken(@background, 10%);
+ border-color: darken(@border, 12%);
+ }
+ &:active,
+ &.active,
+ .open > .dropdown-toggle& {
+ background-image: none;
+ }
+ &.disabled,
+ &[disabled],
+ fieldset[disabled] & {
+ &,
+ &:hover,
+ &:focus,
+ &:active,
+ &.active {
+ background-color: @background;
+ border-color: @border;
+ }
+ }
+
+ .badge {
+ color: @background;
+ background-color: @color;
+ }
+}
+
+// Button sizes
+.button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
+ padding: @padding-vertical @padding-horizontal;
+ font-size: @font-size;
+ line-height: @line-height;
+ border-radius: @border-radius;
+}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/center-block.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/center-block.less b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/center-block.less
new file mode 100644
index 0000000..d18d6de
--- /dev/null
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/center-block.less
@@ -0,0 +1,7 @@
+// Center-align a block level element
+
+.center-block() {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/clearfix.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/clearfix.less b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/clearfix.less
new file mode 100644
index 0000000..3f7a382
--- /dev/null
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/clearfix.less
@@ -0,0 +1,22 @@
+// Clearfix
+//
+// For modern browsers
+// 1. The space content is one way to avoid an Opera bug when the
+// contenteditable attribute is included anywhere else in the document.
+// Otherwise it causes space to appear at the top and bottom of elements
+// that are clearfixed.
+// 2. The use of `table` rather than `block` is only necessary if using
+// `:before` to contain the top-margins of child elements.
+//
+// Source: http://nicolasgallagher.com/micro-clearfix-hack/
+
+.clearfix() {
+ &:before,
+ &:after {
+ content: " "; // 1
+ display: table; // 2
+ }
+ &:after {
+ clear: both;
+ }
+}
http://git-wip-us.apache.org/repos/asf/tapestry-5/blob/ef7f9c43/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/forms.less
----------------------------------------------------------------------
diff --git a/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/forms.less b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/forms.less
new file mode 100644
index 0000000..e36c4a8
--- /dev/null
+++ b/tapestry-webresources/src/test/webapp/bootstrap/less/mixins/forms.less
@@ -0,0 +1,81 @@
+// Form validation states
+//
+// Used in forms.less to generate the form validation CSS for warnings, errors,
+// and successes.
+
+.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) {
+ // Color the label and help text
+ .help-block,
+ .control-label,
+ .radio,
+ .checkbox,
+ .radio-inline,
+ .checkbox-inline {
+ color: @text-color;
+ }
+ // Set the border and box shadow on specific inputs to match
+ .form-control {
+ border-color: @border-color;
+ .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
+ &:focus {
+ border-color: darken(@border-color, 10%);
+ @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%);
+ .box-shadow(@shadow);
+ }
+ }
+ // Set validation states also for addons
+ .input-group-addon {
+ color: @text-color;
+ border-color: @border-color;
+ background-color: @background-color;
+ }
+ // Optional feedback icon
+ .form-control-feedback {
+ color: @text-color;
+ }
+}
+
+
+// Form control focus state
+//
+// Generate a customized focus state and for any input with the specified color,
+// which defaults to the `@input-border-focus` variable.
+//
+// We highly encourage you to not customize the default value, but instead use
+// this to tweak colors on an as-needed basis. This aesthetic change is based on
+// WebKit's default styles, but applicable to a wider range of browsers. Its
+// usability and accessibility should be taken into account with any change.
+//
+// Example usage: change the default blue border and shadow to white for better
+// contrast against a dark gray background.
+.form-control-focus(@color: @input-border-focus) {
+ @color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
+ &:focus {
+ border-color: @color;
+ outline: 0;
+ .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}");
+ }
+}
+
+// Form control sizing
+//
+// Relative text size, padding, and border-radii changes for form controls. For
+// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
+// element gets special love because it's special, and that's a fact!
+.input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
+ height: @input-height;
+ padding: @padding-vertical @padding-horizontal;
+ font-size: @font-size;
+ line-height: @line-height;
+ border-radius: @border-radius;
+
+ select& {
+ height: @input-height;
+ line-height: @input-height;
+ }
+
+ textarea&,
+ select[multiple]& {
+ height: auto;
+ }
+}