mice 0.2.5 → 0.2.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/Gemfile.lock +1 -1
- data/lib/mice/version.rb +1 -1
- data/vendor/assets/javascripts/mice/modal.js +280 -0
- data/vendor/assets/javascripts/mice/tooltip.coffee +339 -0
- data/vendor/assets/javascripts/mice/transition.coffee +36 -0
- data/vendor/assets/javascripts/mice.js +4 -1
- data/vendor/assets/stylesheets/mice/_component-animations.scss +11 -0
- data/vendor/assets/stylesheets/mice/_mixins.scss +17 -0
- data/vendor/assets/stylesheets/mice/_modals.scss +160 -0
- data/vendor/assets/stylesheets/mice/_tipsy.scss +36 -0
- data/vendor/assets/stylesheets/mice/_tooltips.scss +124 -0
- data/vendor/assets/stylesheets/mice/_utilities.scss +1 -1
- data/vendor/assets/stylesheets/mice/_variables.scss +93 -0
- data/vendor/assets/stylesheets/mice/_wells.scss +29 -0
- data/vendor/assets/stylesheets/mice.scss +6 -2
- metadata +10 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 3bcd6f9973735608132f90dfa76843c6d654b997
|
4
|
+
data.tar.gz: 5e7ea1129685321a09ccc7496ac59196928aaa61
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: d77212ed41480632c2bd7e9b946d948f1bc69c5cea730435dec58dc612655e69fa2cdd877eafef3f2906e373328b356f2fc7e4d1f59e7d580dfe5b8fb8fe6790
|
7
|
+
data.tar.gz: 8acc15eb6ac2480ba02e2988352225b3a4109cd3a0870527bb47e7d9ccfb3dc4274df032928ad2927add8317bb30d84856f140fe055fe623b04c277da3328b62
|
data/Gemfile.lock
CHANGED
data/lib/mice/version.rb
CHANGED
@@ -0,0 +1,280 @@
|
|
1
|
+
/* ========================================================================
|
2
|
+
* Bootstrap: modal.js v3.2.0
|
3
|
+
* http://getbootstrap.com/javascript/#modals
|
4
|
+
* ========================================================================
|
5
|
+
* Copyright 2011-2014 Twitter, Inc.
|
6
|
+
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
7
|
+
* ======================================================================== */
|
8
|
+
|
9
|
+
|
10
|
+
+function ($) {
|
11
|
+
'use strict';
|
12
|
+
|
13
|
+
// MODAL CLASS DEFINITION
|
14
|
+
// ======================
|
15
|
+
|
16
|
+
var Modal = function (element, options) {
|
17
|
+
this.options = options
|
18
|
+
this.$body = $(document.body)
|
19
|
+
this.$element = $(element)
|
20
|
+
this.$backdrop =
|
21
|
+
this.isShown = null
|
22
|
+
this.scrollbarWidth = 0
|
23
|
+
|
24
|
+
if (this.options.remote) {
|
25
|
+
this.$element
|
26
|
+
.find('.modal-content')
|
27
|
+
.load(this.options.remote, $.proxy(function () {
|
28
|
+
this.$element.trigger('loaded.bs.modal')
|
29
|
+
}, this))
|
30
|
+
}
|
31
|
+
}
|
32
|
+
|
33
|
+
Modal.VERSION = '3.2.0'
|
34
|
+
|
35
|
+
Modal.DEFAULTS = {
|
36
|
+
backdrop: true,
|
37
|
+
keyboard: true,
|
38
|
+
show: true
|
39
|
+
}
|
40
|
+
|
41
|
+
Modal.prototype.toggle = function (_relatedTarget) {
|
42
|
+
return this.isShown ? this.hide() : this.show(_relatedTarget)
|
43
|
+
}
|
44
|
+
|
45
|
+
Modal.prototype.show = function (_relatedTarget) {
|
46
|
+
var that = this
|
47
|
+
var e = $.Event('show.bs.modal', { relatedTarget: _relatedTarget })
|
48
|
+
|
49
|
+
this.$element.trigger(e)
|
50
|
+
|
51
|
+
if (this.isShown || e.isDefaultPrevented()) return
|
52
|
+
|
53
|
+
this.isShown = true
|
54
|
+
|
55
|
+
this.checkScrollbar()
|
56
|
+
this.$body.addClass('modal-open')
|
57
|
+
|
58
|
+
this.setScrollbar()
|
59
|
+
this.escape()
|
60
|
+
|
61
|
+
this.$element.on('click.dismiss.bs.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this))
|
62
|
+
|
63
|
+
this.backdrop(function () {
|
64
|
+
var transition = $.support.transition && that.$element.hasClass('fade')
|
65
|
+
|
66
|
+
if (!that.$element.parent().length) {
|
67
|
+
that.$element.appendTo(that.$body) // don't move modals dom position
|
68
|
+
}
|
69
|
+
|
70
|
+
that.$element
|
71
|
+
.show()
|
72
|
+
.scrollTop(0)
|
73
|
+
|
74
|
+
if (transition) {
|
75
|
+
that.$element[0].offsetWidth // force reflow
|
76
|
+
}
|
77
|
+
|
78
|
+
that.$element
|
79
|
+
.addClass('in')
|
80
|
+
.attr('aria-hidden', false)
|
81
|
+
|
82
|
+
that.enforceFocus()
|
83
|
+
|
84
|
+
var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
|
85
|
+
|
86
|
+
transition ?
|
87
|
+
that.$element.find('.modal-dialog') // wait for modal to slide in
|
88
|
+
.one('miceTransitionEnd', function () {
|
89
|
+
that.$element.trigger('focus').trigger(e)
|
90
|
+
})
|
91
|
+
.emulateTransitionEnd(300) :
|
92
|
+
that.$element.trigger('focus').trigger(e)
|
93
|
+
})
|
94
|
+
}
|
95
|
+
|
96
|
+
Modal.prototype.hide = function (e) {
|
97
|
+
if (e) e.preventDefault()
|
98
|
+
|
99
|
+
e = $.Event('hide.bs.modal')
|
100
|
+
|
101
|
+
this.$element.trigger(e)
|
102
|
+
|
103
|
+
if (!this.isShown || e.isDefaultPrevented()) return
|
104
|
+
|
105
|
+
this.isShown = false
|
106
|
+
|
107
|
+
this.$body.removeClass('modal-open')
|
108
|
+
|
109
|
+
this.resetScrollbar()
|
110
|
+
this.escape()
|
111
|
+
|
112
|
+
$(document).off('focusin.bs.modal')
|
113
|
+
|
114
|
+
this.$element
|
115
|
+
.removeClass('in')
|
116
|
+
.attr('aria-hidden', true)
|
117
|
+
.off('click.dismiss.bs.modal')
|
118
|
+
|
119
|
+
$.support.transition && this.$element.hasClass('fade') ?
|
120
|
+
this.$element
|
121
|
+
.one('miceTransitionEnd', $.proxy(this.hideModal, this))
|
122
|
+
.emulateTransitionEnd(300) :
|
123
|
+
this.hideModal()
|
124
|
+
}
|
125
|
+
|
126
|
+
Modal.prototype.enforceFocus = function () {
|
127
|
+
$(document)
|
128
|
+
.off('focusin.bs.modal') // guard against infinite focus loop
|
129
|
+
.on('focusin.bs.modal', $.proxy(function (e) {
|
130
|
+
if (this.$element[0] !== e.target && !this.$element.has(e.target).length) {
|
131
|
+
this.$element.trigger('focus')
|
132
|
+
}
|
133
|
+
}, this))
|
134
|
+
}
|
135
|
+
|
136
|
+
Modal.prototype.escape = function () {
|
137
|
+
if (this.isShown && this.options.keyboard) {
|
138
|
+
this.$element.on('keyup.dismiss.bs.modal', $.proxy(function (e) {
|
139
|
+
e.which == 27 && this.hide()
|
140
|
+
}, this))
|
141
|
+
} else if (!this.isShown) {
|
142
|
+
this.$element.off('keyup.dismiss.bs.modal')
|
143
|
+
}
|
144
|
+
}
|
145
|
+
|
146
|
+
Modal.prototype.hideModal = function () {
|
147
|
+
var that = this
|
148
|
+
this.$element.hide()
|
149
|
+
this.backdrop(function () {
|
150
|
+
that.$element.trigger('hidden.bs.modal')
|
151
|
+
})
|
152
|
+
}
|
153
|
+
|
154
|
+
Modal.prototype.removeBackdrop = function () {
|
155
|
+
this.$backdrop && this.$backdrop.remove()
|
156
|
+
this.$backdrop = null
|
157
|
+
}
|
158
|
+
|
159
|
+
Modal.prototype.backdrop = function (callback) {
|
160
|
+
var that = this
|
161
|
+
var animate = this.$element.hasClass('fade') ? 'fade' : ''
|
162
|
+
|
163
|
+
if (this.isShown && this.options.backdrop) {
|
164
|
+
var doAnimate = $.support.transition && animate
|
165
|
+
|
166
|
+
this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
|
167
|
+
.appendTo(this.$body)
|
168
|
+
|
169
|
+
this.$element.on('click.dismiss.bs.modal', $.proxy(function (e) {
|
170
|
+
if (e.target !== e.currentTarget) return
|
171
|
+
this.options.backdrop == 'static'
|
172
|
+
? this.$element[0].focus.call(this.$element[0])
|
173
|
+
: this.hide.call(this)
|
174
|
+
}, this))
|
175
|
+
|
176
|
+
if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
|
177
|
+
|
178
|
+
this.$backdrop.addClass('in')
|
179
|
+
|
180
|
+
if (!callback) return
|
181
|
+
|
182
|
+
doAnimate ?
|
183
|
+
this.$backdrop
|
184
|
+
.one('miceTransitionEnd', callback)
|
185
|
+
.emulateTransitionEnd(150) :
|
186
|
+
callback()
|
187
|
+
|
188
|
+
} else if (!this.isShown && this.$backdrop) {
|
189
|
+
this.$backdrop.removeClass('in')
|
190
|
+
|
191
|
+
var callbackRemove = function () {
|
192
|
+
that.removeBackdrop()
|
193
|
+
callback && callback()
|
194
|
+
}
|
195
|
+
$.support.transition && this.$element.hasClass('fade') ?
|
196
|
+
this.$backdrop
|
197
|
+
.one('miceTransitionEnd', callbackRemove)
|
198
|
+
.emulateTransitionEnd(150) :
|
199
|
+
callbackRemove()
|
200
|
+
|
201
|
+
} else if (callback) {
|
202
|
+
callback()
|
203
|
+
}
|
204
|
+
}
|
205
|
+
|
206
|
+
Modal.prototype.checkScrollbar = function () {
|
207
|
+
if (document.body.clientWidth >= window.innerWidth) return
|
208
|
+
this.scrollbarWidth = this.scrollbarWidth || this.measureScrollbar()
|
209
|
+
}
|
210
|
+
|
211
|
+
Modal.prototype.setScrollbar = function () {
|
212
|
+
var bodyPad = parseInt((this.$body.css('padding-right') || 0), 10)
|
213
|
+
if (this.scrollbarWidth) this.$body.css('padding-right', bodyPad + this.scrollbarWidth)
|
214
|
+
}
|
215
|
+
|
216
|
+
Modal.prototype.resetScrollbar = function () {
|
217
|
+
this.$body.css('padding-right', '')
|
218
|
+
}
|
219
|
+
|
220
|
+
Modal.prototype.measureScrollbar = function () { // thx walsh
|
221
|
+
var scrollDiv = document.createElement('div')
|
222
|
+
scrollDiv.className = 'modal-scrollbar-measure'
|
223
|
+
this.$body.append(scrollDiv)
|
224
|
+
var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth
|
225
|
+
this.$body[0].removeChild(scrollDiv)
|
226
|
+
return scrollbarWidth
|
227
|
+
}
|
228
|
+
|
229
|
+
|
230
|
+
// MODAL PLUGIN DEFINITION
|
231
|
+
// =======================
|
232
|
+
|
233
|
+
function Plugin(option, _relatedTarget) {
|
234
|
+
return this.each(function () {
|
235
|
+
var $this = $(this)
|
236
|
+
var data = $this.data('bs.modal')
|
237
|
+
var options = $.extend({}, Modal.DEFAULTS, $this.data(), typeof option == 'object' && option)
|
238
|
+
|
239
|
+
if (!data) $this.data('bs.modal', (data = new Modal(this, options)))
|
240
|
+
if (typeof option == 'string') data[option](_relatedTarget)
|
241
|
+
else if (options.show) data.show(_relatedTarget)
|
242
|
+
})
|
243
|
+
}
|
244
|
+
|
245
|
+
var old = $.fn.modal
|
246
|
+
|
247
|
+
$.fn.modal = Plugin
|
248
|
+
$.fn.modal.Constructor = Modal
|
249
|
+
|
250
|
+
|
251
|
+
// MODAL NO CONFLICT
|
252
|
+
// =================
|
253
|
+
|
254
|
+
$.fn.modal.noConflict = function () {
|
255
|
+
$.fn.modal = old
|
256
|
+
return this
|
257
|
+
}
|
258
|
+
|
259
|
+
|
260
|
+
// MODAL DATA-API
|
261
|
+
// ==============
|
262
|
+
|
263
|
+
$(document).on('click.bs.modal.data-api', '[data-toggle="modal"]', function (e) {
|
264
|
+
var $this = $(this)
|
265
|
+
var href = $this.attr('href')
|
266
|
+
var $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) // strip for ie7
|
267
|
+
var option = $target.data('bs.modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
|
268
|
+
|
269
|
+
if ($this.is('a')) e.preventDefault()
|
270
|
+
|
271
|
+
$target.one('show.bs.modal', function (showEvent) {
|
272
|
+
if (showEvent.isDefaultPrevented()) return // only register focus restorer if modal will actually get shown
|
273
|
+
$target.one('hidden.bs.modal', function () {
|
274
|
+
$this.is(':visible') && $this.trigger('focus')
|
275
|
+
})
|
276
|
+
})
|
277
|
+
Plugin.call($target, option, this)
|
278
|
+
})
|
279
|
+
|
280
|
+
}(jQuery);
|
@@ -0,0 +1,339 @@
|
|
1
|
+
# Mice: tooltip
|
2
|
+
|
3
|
+
# Inspired by the original jQuery.tipsy by Jason Frame
|
4
|
+
# https://github.com/jaz303/tipsy
|
5
|
+
|
6
|
+
# Copyright (c) 2014 Miclle
|
7
|
+
# Licensed under MIT (https://github.com/miclle/mice/blob/master/LICENSE)
|
8
|
+
|
9
|
+
|
10
|
+
# Generated markup by the plugin
|
11
|
+
# <div class="tooltip top" role="tooltip">
|
12
|
+
# <div class="arrow"></div>
|
13
|
+
# <div class="inner">Some tooltip text!</div>
|
14
|
+
# </div>
|
15
|
+
|
16
|
+
'use strict';
|
17
|
+
|
18
|
+
(($) ->
|
19
|
+
|
20
|
+
# TOOLTIP PUBLIC CLASS DEFINITION
|
21
|
+
# ===============================
|
22
|
+
class Tooltip
|
23
|
+
constructor: (element, options) ->
|
24
|
+
@type
|
25
|
+
@options
|
26
|
+
@enabled
|
27
|
+
@timeout
|
28
|
+
@hoverState
|
29
|
+
@$element = null
|
30
|
+
|
31
|
+
@init('tooltip', element, options)
|
32
|
+
|
33
|
+
|
34
|
+
init: (type, element, options) ->
|
35
|
+
@enabled = true
|
36
|
+
@type = type
|
37
|
+
@$element = $(element)
|
38
|
+
@options = @getOptions(options)
|
39
|
+
@$viewport = @options.viewport and $(@options.viewport.selector or @options.viewport)
|
40
|
+
|
41
|
+
for trigger in @options.trigger.split(' ')
|
42
|
+
if trigger == 'click'
|
43
|
+
@$element.on('click.' + @type, @options.selector, $.proxy(@toggle, @))
|
44
|
+
else if trigger != 'manual'
|
45
|
+
eventIn = if trigger == 'hover' then 'mouseenter' else 'focusin'
|
46
|
+
eventOut = if trigger == 'hover' then 'mouseleave' else 'focusout'
|
47
|
+
|
48
|
+
@$element.on((eventIn) + '.' + @type, @options.selector, $.proxy(@enter, @))
|
49
|
+
@$element.on((eventOut) + '.' + @type, @options.selector, $.proxy(@leave, @))
|
50
|
+
|
51
|
+
if @options.selector
|
52
|
+
@_options = $.extend({}, @options, { trigger: 'manual', selector: '' })
|
53
|
+
else
|
54
|
+
@fixTitle()
|
55
|
+
|
56
|
+
return
|
57
|
+
|
58
|
+
getDefault: ->
|
59
|
+
$.fn.tooltip.defaults
|
60
|
+
|
61
|
+
getOptions: (options) ->
|
62
|
+
options = $.extend({}, @getDefault(), @$element.data(), options)
|
63
|
+
options.delay = show: options.delay, hide: options.delay if options.delay and typeof options.delay == 'number'
|
64
|
+
options
|
65
|
+
|
66
|
+
getDelegateOptions: ->
|
67
|
+
options = {}
|
68
|
+
defaults = @getDefaults()
|
69
|
+
|
70
|
+
@_options and $.each @_options, (key, value) ->
|
71
|
+
options[key] = value if defaults[key] != value
|
72
|
+
|
73
|
+
options
|
74
|
+
|
75
|
+
enter: (obj) ->
|
76
|
+
self = if obj instanceof @constructor then obj else $(obj.currentTarget).data('mice.' + @type)
|
77
|
+
|
78
|
+
if !self
|
79
|
+
self = new @constructor(obj.currentTarget, @getDelegateOptions())
|
80
|
+
$(obj.currentTarget).data('mice.' + @type, self)
|
81
|
+
|
82
|
+
clearTimeout(@timeout)
|
83
|
+
|
84
|
+
self.hoverState = 'in'
|
85
|
+
|
86
|
+
return self.show() if !self.options.delay or !self.options.delay.show
|
87
|
+
|
88
|
+
self.timeout = setTimeout (-> self.show() if self.hoverState == 'in') , self.options.delay.show
|
89
|
+
|
90
|
+
leave: (obj) ->
|
91
|
+
self = if obj instanceof @constructor then obj else $(obj.currentTarget).data('mice.' + @type)
|
92
|
+
|
93
|
+
if !self
|
94
|
+
self = new @constructor(obj.currentTarget, @getDelegateOptions())
|
95
|
+
$(obj.currentTarget).data('mice.' + @type, self)
|
96
|
+
|
97
|
+
clearTimeout(self.timeout)
|
98
|
+
|
99
|
+
self.hoverState = 'out'
|
100
|
+
|
101
|
+
return self.hide() if !self.options.delay or !self.options.delay.hide
|
102
|
+
|
103
|
+
self.timeout = setTimeout (-> self.hide() if self.hoverState == 'out') , self.options.delay.hide
|
104
|
+
|
105
|
+
show: ->
|
106
|
+
e = $.Event('show.mice.'+@type)
|
107
|
+
if @getTitle() and @enabled
|
108
|
+
@$element.trigger e
|
109
|
+
|
110
|
+
inDom = $.contains(document.documentElement, @$element[0])
|
111
|
+
return if e.isDefaultPrevented() or !inDom
|
112
|
+
|
113
|
+
that = @
|
114
|
+
|
115
|
+
$tip = @tip()
|
116
|
+
@setContent()
|
117
|
+
|
118
|
+
$tip.addClass 'fade' if @options.animation
|
119
|
+
|
120
|
+
placement = if typeof @options.placement == 'function' then @options.placement.call(@, $tip[0], @$element[0]) else @options.placement
|
121
|
+
|
122
|
+
autoToken = /\s?auto?\s?/i
|
123
|
+
autoPlace = autoToken.test(placement)
|
124
|
+
placement = placement.replace(autoToken, '') or 'top' if autoPlace
|
125
|
+
|
126
|
+
$tip.detach().css({ top: 0, left: 0, display: 'block' }).addClass(placement).data('mice.' + @type, @)
|
127
|
+
|
128
|
+
if @options.container then $tip.appendTo(@options.container) else $tip.insertAfter(@$element)
|
129
|
+
|
130
|
+
pos = @getPosition()
|
131
|
+
actualWidth = $tip[0].offsetWidth
|
132
|
+
actualHeight = $tip[0].offsetHeight
|
133
|
+
|
134
|
+
if autoPlace
|
135
|
+
orgPlacement = placement
|
136
|
+
$parent = @$element.parent()
|
137
|
+
parentDim = @getPosition($parent)
|
138
|
+
|
139
|
+
placement = if placement == 'bottom' and pos.top + pos.height + actualHeight - parentDim.scroll > parentDim.height then 'top' else
|
140
|
+
if placement == 'top' and pos.top - parentDim.scroll - actualHeight < 0 then 'bottom' else
|
141
|
+
if placement == 'right' and pos.right + actualWidth > parentDim.width then 'left' else
|
142
|
+
if placement == 'left' and pos.left - actualWidth < parentDim.left then 'right' else placement
|
143
|
+
|
144
|
+
$tip.removeClass(orgPlacement).addClass(placement)
|
145
|
+
|
146
|
+
calculatedOffset = @getCalculatedOffset placement, pos, actualWidth, actualHeight
|
147
|
+
|
148
|
+
@applyPlacement calculatedOffset, placement
|
149
|
+
|
150
|
+
complete = ->
|
151
|
+
that.$element.trigger('shown.mice.' + that.type)
|
152
|
+
that.hoverState = null
|
153
|
+
|
154
|
+
if $.support.transition and @$tip.hasClass('fade') then $tip.one('miceTransitionEnd', complete).emulateTransitionEnd(150) else complete()
|
155
|
+
|
156
|
+
applyPlacement: (offset, placement) ->
|
157
|
+
$tip = @tip()
|
158
|
+
width = $tip[0].offsetWidth
|
159
|
+
height = $tip[0].offsetHeight
|
160
|
+
|
161
|
+
# manually read margins because getBoundingClientRect includes difference
|
162
|
+
marginTop = parseInt($tip.css('margin-top'), 10)
|
163
|
+
marginLeft = parseInt($tip.css('margin-left'), 10)
|
164
|
+
|
165
|
+
# we must check for NaN for ie 8/9
|
166
|
+
offset.top = offset.top + if isNaN(marginTop) then 0 else marginTop
|
167
|
+
offset.left = offset.left + if isNaN(marginLeft) then 0 else marginLeft
|
168
|
+
|
169
|
+
# $.fn.offset doesn't round pixel values
|
170
|
+
# so we use setOffset directly with our own function B-0
|
171
|
+
$.offset.setOffset($tip[0], $.extend({ using: (props) -> $tip.css({ top: Math.round(props.top), left: Math.round(props.left) }) }, offset), 0)
|
172
|
+
|
173
|
+
$tip.addClass 'in'
|
174
|
+
|
175
|
+
# check to see if placing tip in new offset caused the tip to resize itself
|
176
|
+
actualWidth = $tip[0].offsetWidth
|
177
|
+
actualHeight = $tip[0].offsetHeight
|
178
|
+
|
179
|
+
offset.top = offset.top + height - actualHeight if placement == 'top' and actualHeight != height
|
180
|
+
|
181
|
+
delta = @getViewportAdjustedDelta placement, offset, actualWidth, actualHeight
|
182
|
+
|
183
|
+
if delta.left then offset.left += delta.left else offset.top += delta.top
|
184
|
+
|
185
|
+
arrowDelta = if delta.left then delta.left * 2 - width + actualWidth else delta.top * 2 - height + actualHeight
|
186
|
+
arrowPosition = if delta.left then 'left' else 'top'
|
187
|
+
arrowOffsetPosition = if delta.left then 'offsetWidth' else 'offsetHeight'
|
188
|
+
|
189
|
+
$tip.offset(offset)
|
190
|
+
@replaceArrow arrowDelta, $tip[0][arrowOffsetPosition], arrowPosition
|
191
|
+
|
192
|
+
replaceArrow: (delta, dimension, position) ->
|
193
|
+
@arrow().css(position, if delta then (50 * (1 - delta / dimension) + '%') else '')
|
194
|
+
|
195
|
+
setContent: ->
|
196
|
+
@tip().find('.inner')[if @options.html then 'html' else 'text'](@getTitle()).removeClass('fade in top bottom left right')
|
197
|
+
|
198
|
+
hide: ->
|
199
|
+
that = @
|
200
|
+
$tip = @tip()
|
201
|
+
e = $.Event('hide.mice.' + @type)
|
202
|
+
|
203
|
+
complete = ->
|
204
|
+
$tip.detach() if that.hoverState != 'in'
|
205
|
+
that.$element.trigger('hidden.mice.' + that.type)
|
206
|
+
|
207
|
+
@$element.trigger(e)
|
208
|
+
|
209
|
+
return if e.isDefaultPrevented()
|
210
|
+
|
211
|
+
$tip.removeClass('in')
|
212
|
+
|
213
|
+
if $.support.transition and @$tip.hasClass('fade') then $tip.one('miceTransitionEnd', complete).emulateTransitionEnd(150) else complete()
|
214
|
+
|
215
|
+
@hoverState = null
|
216
|
+
|
217
|
+
@
|
218
|
+
|
219
|
+
fixTitle: ->
|
220
|
+
@$element.attr('data-original-title', @$element.attr('title') or '').removeAttr('title') if @$element.attr('title') or typeof (@$element.attr('data-original-title')) != 'string'
|
221
|
+
|
222
|
+
getPosition: ($element) ->
|
223
|
+
$element = $element or @$element
|
224
|
+
el = $element[0]
|
225
|
+
isBody = el.tagName == 'BODY'
|
226
|
+
|
227
|
+
return $.extend({}, (if (typeof el.getBoundingClientRect == 'function') then el.getBoundingClientRect() else null), {
|
228
|
+
scroll: if isBody then document.documentElement.scrollTop or document.body.scrollTop else $element.scrollTop()
|
229
|
+
width: if isBody then $(window).width() else $element.outerWidth()
|
230
|
+
height: if isBody then $(window).height() else $element.outerHeight()
|
231
|
+
}, if isBody then { top: 0, left: 0 } else $element.offset())
|
232
|
+
|
233
|
+
getCalculatedOffset: (placement, pos, actualWidth, actualHeight) ->
|
234
|
+
switch placement
|
235
|
+
when 'bottom' then { top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2 }
|
236
|
+
when 'top' then { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2 }
|
237
|
+
when 'left' then { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth }
|
238
|
+
when 'right' then { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width }
|
239
|
+
|
240
|
+
getViewportAdjustedDelta: (placement, pos, actualWidth, actualHeight) ->
|
241
|
+
delta = { top: 0, left: 0 }
|
242
|
+
return delta if !@$viewport
|
243
|
+
|
244
|
+
viewportPadding = @options.viewport and @options.viewport.padding or 0
|
245
|
+
viewportDimensions = @getPosition @$viewport
|
246
|
+
|
247
|
+
if /right|left/.test placement
|
248
|
+
topEdgeOffset = pos.top - viewportPadding - viewportDimensions.scroll
|
249
|
+
bottomEdgeOffset = pos.top + viewportPadding - viewportDimensions.scroll + actualHeight
|
250
|
+
if topEdgeOffset < viewportDimensions.top #top overflow
|
251
|
+
delta.top = viewportDimensions.top - topEdgeOffset
|
252
|
+
else if bottomEdgeOffset > viewportDimensions.top + viewportDimensions.height #bottom overflow
|
253
|
+
delta.top = viewportDimensions.top + viewportDimensions.height - bottomEdgeOffset
|
254
|
+
else
|
255
|
+
leftEdgeOffset = pos.left - viewportPadding
|
256
|
+
rightEdgeOffset = pos.left + viewportPadding + actualWidth
|
257
|
+
if leftEdgeOffset < viewportDimensions.left #left overflow
|
258
|
+
delta.left = viewportDimensions.left - leftEdgeOffset
|
259
|
+
else if rightEdgeOffset > viewportDimensions.width #right overflow
|
260
|
+
delta.left = viewportDimensions.left + viewportDimensions.width - rightEdgeOffset
|
261
|
+
|
262
|
+
delta
|
263
|
+
|
264
|
+
getTitle: ->
|
265
|
+
@$element.attr('data-original-title') or (if typeof @options.title == 'function' then @options.title.call(@$element[0]) else @options.title)
|
266
|
+
|
267
|
+
tip: ->
|
268
|
+
@$tip = @$tip or $(@options.template).addClass @options.contextual
|
269
|
+
|
270
|
+
arrow: ->
|
271
|
+
@$arrow = @$arrow or @tip().find('.arrow')
|
272
|
+
|
273
|
+
validate: ->
|
274
|
+
if !@$element[0].parentNode
|
275
|
+
@hide()
|
276
|
+
@$element = null
|
277
|
+
@options = null
|
278
|
+
|
279
|
+
enable: ->
|
280
|
+
@enabled = true
|
281
|
+
|
282
|
+
disable: ->
|
283
|
+
@enabled = false
|
284
|
+
|
285
|
+
toggleEnabled: ->
|
286
|
+
@enabled = !@enabled
|
287
|
+
|
288
|
+
toggle: (e) ->
|
289
|
+
self = @
|
290
|
+
if e
|
291
|
+
self = $(e.currentTarget).data('mice.' + @type)
|
292
|
+
if !self
|
293
|
+
self = new @constructor(e.currentTarget, @getDelegateOptions())
|
294
|
+
$(e.currentTarget).data('mice.' + @type, self)
|
295
|
+
|
296
|
+
if self.tip().hasClass('in') then self.leave(self) else self.enter(self)
|
297
|
+
|
298
|
+
destroy: ->
|
299
|
+
clearTimeout(@timeout)
|
300
|
+
@hide().$element.off('.' + @type).removeData('mice.' + @type)
|
301
|
+
|
302
|
+
|
303
|
+
# TOOLTIP PLUGIN DEFINITION
|
304
|
+
# =========================
|
305
|
+
$.fn.tooltip = (option) ->
|
306
|
+
@each ->
|
307
|
+
$element = $(@)
|
308
|
+
data = $element.data('mice.tooltip')
|
309
|
+
options = typeof option == 'object' and option
|
310
|
+
|
311
|
+
return if !data and option == 'destroy'
|
312
|
+
|
313
|
+
$element.data('mice.tooltip', (data = new Tooltip(@, options))) if !data
|
314
|
+
|
315
|
+
data[option]() if typeof option == 'string'
|
316
|
+
|
317
|
+
|
318
|
+
$.fn.tooltip.Constructor = Tooltip
|
319
|
+
|
320
|
+
# TOOLTIP PLUGIN DEFAULT OPTIONS
|
321
|
+
# =========================
|
322
|
+
$.fn.tooltip.defaults =
|
323
|
+
animation: true
|
324
|
+
placement: 'top'
|
325
|
+
contextual: ''
|
326
|
+
selector: false
|
327
|
+
template: '<div class="tooltip" role="tooltip"><div class="arrow"></div><div class="inner"></div></div>'
|
328
|
+
trigger: 'hover focus'
|
329
|
+
title: ''
|
330
|
+
delay: 0
|
331
|
+
html: false
|
332
|
+
container: false
|
333
|
+
viewport:
|
334
|
+
selector: 'body'
|
335
|
+
padding: 0
|
336
|
+
|
337
|
+
return
|
338
|
+
|
339
|
+
) jQuery
|
@@ -0,0 +1,36 @@
|
|
1
|
+
# Mice: transition.coffee
|
2
|
+
|
3
|
+
# Copyright (c) 2014 Miclle
|
4
|
+
# Licensed under MIT (https://github.com/miclle/mice/blob/master/LICENSE)
|
5
|
+
|
6
|
+
"use strict"
|
7
|
+
(($) ->
|
8
|
+
|
9
|
+
# CSS TRANSITION SUPPORT (Shoutout: http://www.modernizr.com/)
|
10
|
+
transitionEnd = ->
|
11
|
+
element = document.createElement("mice")
|
12
|
+
transEndEventNames =
|
13
|
+
WebkitTransition : "webkitTransitionEnd"
|
14
|
+
MozTransition : "transitionend"
|
15
|
+
OTransition : "oTransitionEnd otransitionend"
|
16
|
+
transition : "transitionend"
|
17
|
+
|
18
|
+
return end: transEndEventNames[name] for name of transEndEventNames when element.style[name] isnt `undefined`
|
19
|
+
false # explicit for ie8 ( ._.)
|
20
|
+
|
21
|
+
# http://blog.alexmaccaw.com/css-transitions
|
22
|
+
$.fn.emulateTransitionEnd = (duration) =>
|
23
|
+
called = false
|
24
|
+
$(this).one "miceTransitionEnd", -> called = true
|
25
|
+
setTimeout (-> $(_this).trigger $.support.transition.end unless called), duration
|
26
|
+
@
|
27
|
+
|
28
|
+
$ ->
|
29
|
+
$.support.transition = transitionEnd()
|
30
|
+
return unless $.support.transition
|
31
|
+
$.event.special.miceTransitionEnd =
|
32
|
+
bindType : $.support.transition.end
|
33
|
+
delegateType : $.support.transition.end
|
34
|
+
handle : (e) -> e.handleObj.handler.apply @, arguments if $(e.target).is(@)
|
35
|
+
|
36
|
+
) jQuery
|
@@ -97,6 +97,23 @@
|
|
97
97
|
transition-timing-function: $function;
|
98
98
|
}
|
99
99
|
|
100
|
+
@mixin transition-transform($transition...) {
|
101
|
+
-webkit-transition: -webkit-transform $transition;
|
102
|
+
-moz-transition: -moz-transform $transition;
|
103
|
+
-o-transition: -o-transform $transition;
|
104
|
+
transition: transform $transition;
|
105
|
+
}
|
106
|
+
|
107
|
+
@mixin translate($x, $y) {
|
108
|
+
-webkit-transform: translate($x, $y);
|
109
|
+
-ms-transform: translate($x, $y); // IE9 only
|
110
|
+
-o-transform: translate($x, $y);
|
111
|
+
transform: translate($x, $y);
|
112
|
+
}
|
113
|
+
@mixin translate3d($x, $y, $z) {
|
114
|
+
-webkit-transform: translate3d($x, $y, $z);
|
115
|
+
transform: translate3d($x, $y, $z);
|
116
|
+
}
|
100
117
|
|
101
118
|
// Animations
|
102
119
|
// --------------------------------------------------
|
@@ -0,0 +1,160 @@
|
|
1
|
+
//
|
2
|
+
// Modals
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
// .modal-open - body class for killing the scroll
|
6
|
+
// .modal - container to scroll within
|
7
|
+
// .dialog - positioning shell for the actual modal
|
8
|
+
// .content - actual modal w/ bg and corners and shit
|
9
|
+
|
10
|
+
// Kill the scroll on the body
|
11
|
+
.modal-open {
|
12
|
+
overflow: hidden;
|
13
|
+
|
14
|
+
.modal {
|
15
|
+
overflow-x: hidden;
|
16
|
+
overflow-y: auto;
|
17
|
+
}
|
18
|
+
}
|
19
|
+
|
20
|
+
|
21
|
+
// Container that the modal scrolls within
|
22
|
+
.modal {
|
23
|
+
display: none;
|
24
|
+
overflow: hidden;
|
25
|
+
position: fixed;
|
26
|
+
top: 0;
|
27
|
+
right: 0;
|
28
|
+
bottom: 0;
|
29
|
+
left: 0;
|
30
|
+
z-index: $zindex-modal;
|
31
|
+
-webkit-overflow-scrolling: touch;
|
32
|
+
outline: 0;
|
33
|
+
|
34
|
+
// When fading in the modal, animate it to slide down
|
35
|
+
&.fade .dialog {
|
36
|
+
@include translate3d(0, -25%, 0);
|
37
|
+
@include transition-transform(0.3s ease-out);
|
38
|
+
}
|
39
|
+
&.in .dialog { @include translate3d(0, 0, 0); }
|
40
|
+
|
41
|
+
}
|
42
|
+
|
43
|
+
// Modal background
|
44
|
+
.modal-backdrop {
|
45
|
+
position: fixed;
|
46
|
+
top: 0;
|
47
|
+
right: 0;
|
48
|
+
bottom: 0;
|
49
|
+
left: 0;
|
50
|
+
z-index: $zindex-modal-background;
|
51
|
+
background-color: $modal-backdrop-background;
|
52
|
+
|
53
|
+
// Fade for backdrop
|
54
|
+
&.fade {
|
55
|
+
@include opacity(0);
|
56
|
+
&.in { @include opacity($modal-backdrop-opacity); }
|
57
|
+
}
|
58
|
+
}
|
59
|
+
|
60
|
+
|
61
|
+
.modal {
|
62
|
+
// Shell div to position the modal with bottom padding
|
63
|
+
.dialog {
|
64
|
+
position: relative;
|
65
|
+
width: auto;
|
66
|
+
margin: 10px;
|
67
|
+
}
|
68
|
+
|
69
|
+
// Actual modal
|
70
|
+
.content {
|
71
|
+
position: relative;
|
72
|
+
background-color: $modal-content-background;
|
73
|
+
border: 1px solid $modal-content-fallback-border-color; //old browsers fallback (ie8 etc)
|
74
|
+
border: 1px solid $modal-content-border-color;
|
75
|
+
border-radius: $border-radius;
|
76
|
+
@include box-shadow(0 3px 9px rgba(0,0,0,.5));
|
77
|
+
background-clip: padding-box;
|
78
|
+
// Remove focus outline from opened modal
|
79
|
+
outline: 0;
|
80
|
+
}
|
81
|
+
|
82
|
+
// Modal header
|
83
|
+
// Top section of the modal w/ title and dismiss
|
84
|
+
.header {
|
85
|
+
padding: $modal-title-padding;
|
86
|
+
border-bottom: 1px solid $modal-header-border-color;
|
87
|
+
min-height: ($modal-title-padding + $modal-title-line-height);
|
88
|
+
|
89
|
+
// Close icon
|
90
|
+
.close { margin-top: -2px; }
|
91
|
+
|
92
|
+
// Title text within header
|
93
|
+
h1, h2, h3, h4, h5, h6 {
|
94
|
+
margin: 0;
|
95
|
+
line-height: $modal-title-line-height;
|
96
|
+
}
|
97
|
+
}
|
98
|
+
|
99
|
+
// Modal body
|
100
|
+
// Where all modal content resides (sibling of .header and .footer)
|
101
|
+
.body {
|
102
|
+
position: relative;
|
103
|
+
padding: $modal-inner-padding;
|
104
|
+
}
|
105
|
+
|
106
|
+
// Footer (for actions)
|
107
|
+
.footer {
|
108
|
+
padding: $modal-inner-padding;
|
109
|
+
text-align: right; // right align buttons
|
110
|
+
border-top: 1px solid $modal-footer-border-color;
|
111
|
+
@include clearfix(); // clear it in case folks use .pull-* classes on buttons
|
112
|
+
|
113
|
+
// Properly space out buttons
|
114
|
+
.button + .button {
|
115
|
+
margin-left: 5px;
|
116
|
+
margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs
|
117
|
+
}
|
118
|
+
// but override that for button groups
|
119
|
+
.buttons .button + .button {
|
120
|
+
margin-left: -1px;
|
121
|
+
}
|
122
|
+
// and override it for block buttons as well
|
123
|
+
.button.block + .button.block {
|
124
|
+
margin-left: 0;
|
125
|
+
}
|
126
|
+
}
|
127
|
+
|
128
|
+
}
|
129
|
+
|
130
|
+
|
131
|
+
// Measure scrollbar width for padding body during modal show/hide
|
132
|
+
.modal-scrollbar-measure {
|
133
|
+
position: absolute;
|
134
|
+
top: -9999px;
|
135
|
+
width: 50px;
|
136
|
+
height: 50px;
|
137
|
+
overflow: scroll;
|
138
|
+
}
|
139
|
+
|
140
|
+
|
141
|
+
// Scale up the modal
|
142
|
+
@media (min-width: $screen-sm-min) {
|
143
|
+
// Automatically set modal's width for larger viewports
|
144
|
+
.modal{
|
145
|
+
.dialog {
|
146
|
+
width: $modal-medium;
|
147
|
+
margin: 30px auto;
|
148
|
+
}
|
149
|
+
.content {
|
150
|
+
@include box-shadow(0 5px 15px rgba(0,0,0,.5));
|
151
|
+
}
|
152
|
+
}
|
153
|
+
|
154
|
+
// Modal sizes
|
155
|
+
.modal .small { width: $modal-small; }
|
156
|
+
}
|
157
|
+
|
158
|
+
@media (min-width: $screen-md-min) {
|
159
|
+
.modal .large { width: $modal-large; }
|
160
|
+
}
|
@@ -0,0 +1,36 @@
|
|
1
|
+
//
|
2
|
+
// Tooltips
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
|
6
|
+
.tooltip {
|
7
|
+
font-size: 10px; position: absolute; padding: 5px; z-index: 100000;
|
8
|
+
}
|
9
|
+
.tooltip-inner { background-color: #000; color: #FFF; max-width: 200px; padding: 5px 8px 4px 8px; text-align: center; }
|
10
|
+
|
11
|
+
/* Rounded corners */
|
12
|
+
.tooltip-inner {
|
13
|
+
border-radius: $border-radius;
|
14
|
+
}
|
15
|
+
|
16
|
+
/* Uncomment for shadow */
|
17
|
+
/*.tooltip-inner { box-shadow: 0 0 5px #000000; -webkit-box-shadow: 0 0 5px #000000; -moz-box-shadow: 0 0 5px #000000; }*/
|
18
|
+
|
19
|
+
.tooltip-arrow { position: absolute; width: 0; height: 0; line-height: 0; border: 5px dashed #000; }
|
20
|
+
|
21
|
+
/* Rules to colour arrows */
|
22
|
+
.tooltip-arrow-bottom { border-bottom-color: #000; }
|
23
|
+
.tooltip-arrow-top { border-top-color: #000; }
|
24
|
+
.tooltip-arrow-left { border-left-color: #000; }
|
25
|
+
.tooltip-arrow-right { border-right-color: #000; }
|
26
|
+
|
27
|
+
.tooltip-bottom .tooltip-arrow { top: 0px; left: 50%; margin-left: -5px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; }
|
28
|
+
.tooltip-nw .tooltip-arrow { top: 0; left: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent;}
|
29
|
+
.tooltip-ne .tooltip-arrow { top: 0; right: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent;}
|
30
|
+
|
31
|
+
.tooltip-top .tooltip-arrow { bottom: 0; left: 50%; margin-left: -5px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; }
|
32
|
+
.tooltip-sw .tooltip-arrow { bottom: 0; left: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; }
|
33
|
+
.tooltip-se .tooltip-arrow { bottom: 0; right: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; }
|
34
|
+
|
35
|
+
.tooltip-left .tooltip-arrow { right: 0; top: 50%; margin-top: -5px; border-left-style: solid; border-right: none; border-top-color: transparent; border-bottom-color: transparent; }
|
36
|
+
.tooltip-right .tooltip-arrow { left: 0; top: 50%; margin-top: -5px; border-right-style: solid; border-left: none; border-top-color: transparent; border-bottom-color: transparent; }
|
@@ -0,0 +1,124 @@
|
|
1
|
+
//
|
2
|
+
// Tooltips
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
|
6
|
+
// Tooltip variants
|
7
|
+
@mixin tooltip-variant($tooltip-color, $tooltip-background, $tooltip-arrow-color) {
|
8
|
+
.inner{
|
9
|
+
color: $tooltip-color;
|
10
|
+
background-color: $tooltip-background;
|
11
|
+
}
|
12
|
+
|
13
|
+
&.top .arrow,
|
14
|
+
&.top-left .arrow,
|
15
|
+
&.top-right .arrow {
|
16
|
+
border-top-color: $tooltip-arrow-color;
|
17
|
+
}
|
18
|
+
|
19
|
+
&.right .arrow {
|
20
|
+
border-right-color: $tooltip-arrow-color;
|
21
|
+
}
|
22
|
+
&.left .arrow {
|
23
|
+
border-left-color: $tooltip-arrow-color;
|
24
|
+
}
|
25
|
+
&.bottom .arrow,
|
26
|
+
&.bottom-left .arrow,
|
27
|
+
&.bottom-right .arrow {
|
28
|
+
border-bottom-color: $tooltip-arrow-color;
|
29
|
+
}
|
30
|
+
}
|
31
|
+
|
32
|
+
|
33
|
+
// Base class
|
34
|
+
.tooltip {
|
35
|
+
position: absolute;
|
36
|
+
z-index: $zindex-tooltip;
|
37
|
+
display: block;
|
38
|
+
visibility: visible;
|
39
|
+
font-size: $font-size-small;
|
40
|
+
line-height: 1.4;
|
41
|
+
@include opacity(0);
|
42
|
+
|
43
|
+
&.in { @include opacity($tooltip-opacity); }
|
44
|
+
&.top { margin-top: -3px; padding: $tooltip-arrow-width 0; }
|
45
|
+
&.right { margin-left: 3px; padding: 0 $tooltip-arrow-width; }
|
46
|
+
&.bottom { margin-top: 3px; padding: $tooltip-arrow-width 0; }
|
47
|
+
&.left { margin-left: -3px; padding: 0 $tooltip-arrow-width; }
|
48
|
+
|
49
|
+
// Wrapper for the tooltip content
|
50
|
+
.inner {
|
51
|
+
max-width: $tooltip-max-width;
|
52
|
+
padding: 3px 8px;
|
53
|
+
color: $tooltip-color;
|
54
|
+
text-align: center;
|
55
|
+
text-decoration: none;
|
56
|
+
background-color: $tooltip-background;
|
57
|
+
border-radius: $border-radius;
|
58
|
+
}
|
59
|
+
|
60
|
+
// Arrows
|
61
|
+
.arrow {
|
62
|
+
position: absolute;
|
63
|
+
width: 0;
|
64
|
+
height: 0;
|
65
|
+
border-color: transparent;
|
66
|
+
border-style: solid;
|
67
|
+
}
|
68
|
+
|
69
|
+
&.top .arrow {
|
70
|
+
bottom: 0;
|
71
|
+
left: 50%;
|
72
|
+
margin-left: -$tooltip-arrow-width;
|
73
|
+
border-width: $tooltip-arrow-width $tooltip-arrow-width 0;
|
74
|
+
}
|
75
|
+
&.top-left .arrow {
|
76
|
+
bottom: 0;
|
77
|
+
left: $tooltip-arrow-width;
|
78
|
+
border-width: $tooltip-arrow-width $tooltip-arrow-width 0;
|
79
|
+
}
|
80
|
+
&.top-right .arrow {
|
81
|
+
bottom: 0;
|
82
|
+
right: $tooltip-arrow-width;
|
83
|
+
border-width: $tooltip-arrow-width $tooltip-arrow-width 0;
|
84
|
+
}
|
85
|
+
&.right .arrow {
|
86
|
+
top: 50%;
|
87
|
+
left: 0;
|
88
|
+
margin-top: -$tooltip-arrow-width;
|
89
|
+
border-width: $tooltip-arrow-width $tooltip-arrow-width $tooltip-arrow-width 0;
|
90
|
+
}
|
91
|
+
&.left .arrow {
|
92
|
+
top: 50%;
|
93
|
+
right: 0;
|
94
|
+
margin-top: -$tooltip-arrow-width;
|
95
|
+
border-width: $tooltip-arrow-width 0 $tooltip-arrow-width $tooltip-arrow-width;
|
96
|
+
}
|
97
|
+
&.bottom .arrow {
|
98
|
+
top: 0;
|
99
|
+
left: 50%;
|
100
|
+
margin-left: -$tooltip-arrow-width;
|
101
|
+
border-width: 0 $tooltip-arrow-width $tooltip-arrow-width;
|
102
|
+
}
|
103
|
+
&.bottom-left .arrow {
|
104
|
+
top: 0;
|
105
|
+
left: $tooltip-arrow-width;
|
106
|
+
border-width: 0 $tooltip-arrow-width $tooltip-arrow-width;
|
107
|
+
}
|
108
|
+
&.bottom-right .arrow {
|
109
|
+
top: 0;
|
110
|
+
right: $tooltip-arrow-width;
|
111
|
+
border-width: 0 $tooltip-arrow-width $tooltip-arrow-width;
|
112
|
+
}
|
113
|
+
|
114
|
+
|
115
|
+
// Colors
|
116
|
+
// Contextual variations
|
117
|
+
& { @include tooltip-variant($tooltip-color, $tooltip-background, $tooltip-arrow-color); }
|
118
|
+
&.primary { @include tooltip-variant($tooltip-primary-color, $tooltip-primary-background, $tooltip-primary-arrow-color); }
|
119
|
+
&.success { @include tooltip-variant($tooltip-success-color, $tooltip-success-background, $tooltip-success-arrow-color); }
|
120
|
+
&.info { @include tooltip-variant($tooltip-info-color, $tooltip-info-background, $tooltip-info-arrow-color); }
|
121
|
+
&.warning { @include tooltip-variant($tooltip-warning-color, $tooltip-warning-background, $tooltip-warning-arrow-color); }
|
122
|
+
&.danger { @include tooltip-variant($tooltip-danger-color, $tooltip-danger-background, $tooltip-danger-arrow-color); }
|
123
|
+
|
124
|
+
}
|
@@ -267,6 +267,11 @@ $breadcrumb-active-color: $gray-light !default;
|
|
267
267
|
$breadcrumb-separator: "/" !default;
|
268
268
|
|
269
269
|
|
270
|
+
// Wells
|
271
|
+
// --------------------------------------------------
|
272
|
+
$well-background: #f5f5f5 !default;
|
273
|
+
$well-border: darken($well-background, 7%) !default;
|
274
|
+
|
270
275
|
|
271
276
|
// Pagination
|
272
277
|
// --------------------------------------------------
|
@@ -409,6 +414,38 @@ $progress-bar-danger-background: $brand-danger !default;
|
|
409
414
|
$progress-bar-info-background: $brand-info !default;
|
410
415
|
|
411
416
|
|
417
|
+
// Modals
|
418
|
+
// --------------------------------------------------
|
419
|
+
|
420
|
+
// Padding applied to the modal body
|
421
|
+
$modal-inner-padding: 15px !default;
|
422
|
+
|
423
|
+
// Padding applied to the modal title
|
424
|
+
$modal-title-padding: 15px !default;
|
425
|
+
// Modal title line-height
|
426
|
+
$modal-title-line-height: $line-height-base !default;
|
427
|
+
|
428
|
+
// Background color of modal content area
|
429
|
+
$modal-content-background: #fff !default;
|
430
|
+
// Modal content border color
|
431
|
+
$modal-content-border-color: rgba(0,0,0,.2) !default;
|
432
|
+
// Modal content border color **for IE8**
|
433
|
+
$modal-content-fallback-border-color: #999 !default;
|
434
|
+
|
435
|
+
// Modal backdrop background color
|
436
|
+
$modal-backdrop-background: #000 !default;
|
437
|
+
// Modal backdrop opacity
|
438
|
+
$modal-backdrop-opacity: .5 !default;
|
439
|
+
// Modal header border color
|
440
|
+
$modal-header-border-color: #e5e5e5 !default;
|
441
|
+
// Modal footer border color
|
442
|
+
$modal-footer-border-color: $modal-header-border-color !default;
|
443
|
+
|
444
|
+
$modal-large: 900px !default;
|
445
|
+
$modal-medium: 600px !default;
|
446
|
+
$modal-small: 300px !default;
|
447
|
+
|
448
|
+
|
412
449
|
// Alerts
|
413
450
|
// --------------------------------------------------
|
414
451
|
$alert-padding: 15px !default;
|
@@ -442,3 +479,59 @@ $close-text-shadow: 0 1px 0 #fff !default;
|
|
442
479
|
// Z-index master list
|
443
480
|
// --------------------------------------------------
|
444
481
|
$zindex-navbar-fixed: 1030 !default;
|
482
|
+
$zindex-modal-background: 1040 !default;
|
483
|
+
$zindex-modal: 1050 !default;
|
484
|
+
$zindex-tooltip: 1070 !default;
|
485
|
+
|
486
|
+
|
487
|
+
// Media queries breakpoints
|
488
|
+
// --------------------------------------------------
|
489
|
+
// Define the breakpoints at which your layout will change, adapting to different screen sizes.
|
490
|
+
|
491
|
+
// Deprecated `$screen-xs-min` as of v3.2.0
|
492
|
+
$screen-xs-min: 480px !default;
|
493
|
+
|
494
|
+
// Small screen / tablet
|
495
|
+
$screen-sm-min: 768px !default;
|
496
|
+
|
497
|
+
// Medium screen / desktop
|
498
|
+
$screen-md-min: 992px !default;
|
499
|
+
|
500
|
+
// Large screen / wide desktop
|
501
|
+
$screen-lg-min: 1200px !default;
|
502
|
+
|
503
|
+
// So media queries don't overlap when required, provide a maximum
|
504
|
+
$screen-xs-max: ($screen-sm-min - 1) !default;
|
505
|
+
$screen-sm-max: ($screen-md-min - 1) !default;
|
506
|
+
$screen-md-max: ($screen-lg-min - 1) !default;
|
507
|
+
|
508
|
+
|
509
|
+
// Tooltips
|
510
|
+
// --------------------------------------------------
|
511
|
+
$tooltip-max-width: 200px !default;
|
512
|
+
$tooltip-color: #fff !default;
|
513
|
+
$tooltip-background: #000 !default;
|
514
|
+
$tooltip-opacity: .9 !default;
|
515
|
+
$tooltip-arrow-width: 5px !default;
|
516
|
+
$tooltip-arrow-color: $tooltip-background !default;
|
517
|
+
|
518
|
+
$tooltip-primary-color: #fff !default;
|
519
|
+
$tooltip-primary-background: $brand-primary !default;
|
520
|
+
$tooltip-primary-arrow-color: $tooltip-primary-background !default;
|
521
|
+
|
522
|
+
$tooltip-success-color: #fff !default;
|
523
|
+
$tooltip-success-background: $brand-success !default;
|
524
|
+
$tooltip-success-arrow-color: $tooltip-success-background !default;
|
525
|
+
|
526
|
+
$tooltip-info-color: #fff !default;
|
527
|
+
$tooltip-info-background: $brand-info !default;
|
528
|
+
$tooltip-info-arrow-color: $tooltip-info-background !default;
|
529
|
+
|
530
|
+
$tooltip-warning-color: #fff !default;
|
531
|
+
$tooltip-warning-background: $brand-warning !default;
|
532
|
+
$tooltip-warning-arrow-color: $tooltip-warning-background !default;
|
533
|
+
|
534
|
+
$tooltip-danger-color: #fff !default;
|
535
|
+
$tooltip-danger-background: $brand-danger !default;
|
536
|
+
$tooltip-danger-arrow-color: $tooltip-danger-background !default;
|
537
|
+
|
@@ -0,0 +1,29 @@
|
|
1
|
+
//
|
2
|
+
// Wells
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
// Base class
|
6
|
+
.well {
|
7
|
+
min-height: 20px;
|
8
|
+
padding: 19px;
|
9
|
+
margin-bottom: 20px;
|
10
|
+
background-color: $well-background;
|
11
|
+
border: 1px solid $well-border;
|
12
|
+
border-radius: $border-radius;
|
13
|
+
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
|
14
|
+
blockquote {
|
15
|
+
border-color: #ddd;
|
16
|
+
border-color: rgba(0,0,0,.15);
|
17
|
+
}
|
18
|
+
|
19
|
+
// Sizes
|
20
|
+
&.large {
|
21
|
+
padding: 24px;
|
22
|
+
border-radius: $border-radius-large;
|
23
|
+
}
|
24
|
+
&.small {
|
25
|
+
padding: 9px;
|
26
|
+
border-radius: $border-radius-small;
|
27
|
+
}
|
28
|
+
}
|
29
|
+
|
@@ -16,14 +16,15 @@
|
|
16
16
|
@import "mice/images";
|
17
17
|
@import "mice/icons";
|
18
18
|
|
19
|
+
// Components
|
20
|
+
@import "mice/component-animations";
|
21
|
+
|
19
22
|
@import "mice/menu";
|
20
23
|
@import "mice/tabs";
|
21
24
|
@import "mice/navbar";
|
22
25
|
@import "mice/sidebar";
|
23
26
|
@import "mice/lists";
|
24
27
|
@import "mice/tables";
|
25
|
-
|
26
|
-
// Components
|
27
28
|
@import "mice/breadcrumbs";
|
28
29
|
@import "mice/pagination";
|
29
30
|
@import "mice/panels";
|
@@ -33,6 +34,9 @@
|
|
33
34
|
@import "mice/progress";
|
34
35
|
@import "mice/alerts";
|
35
36
|
@import "mice/close";
|
37
|
+
@import "mice/wells";
|
38
|
+
@import "mice/modals";
|
39
|
+
@import "mice/tooltips";
|
36
40
|
|
37
41
|
// Form
|
38
42
|
@import "mice/forms";
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: mice
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.2.
|
4
|
+
version: 0.2.7
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- miclle
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2014-07-
|
11
|
+
date: 2014-07-18 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: sass
|
@@ -68,6 +68,9 @@ files:
|
|
68
68
|
- vendor/assets/javascripts/mice/jquery.js
|
69
69
|
- vendor/assets/javascripts/mice/jquery.min.js
|
70
70
|
- vendor/assets/javascripts/mice/jquery.min.map
|
71
|
+
- vendor/assets/javascripts/mice/modal.js
|
72
|
+
- vendor/assets/javascripts/mice/tooltip.coffee
|
73
|
+
- vendor/assets/javascripts/mice/transition.coffee
|
71
74
|
- vendor/assets/stylesheets/mice-mobile.scss
|
72
75
|
- vendor/assets/stylesheets/mice.scss
|
73
76
|
- vendor/assets/stylesheets/mice/_alerts.scss
|
@@ -76,6 +79,7 @@ files:
|
|
76
79
|
- vendor/assets/stylesheets/mice/_callouts.scss
|
77
80
|
- vendor/assets/stylesheets/mice/_close.scss
|
78
81
|
- vendor/assets/stylesheets/mice/_code.scss
|
82
|
+
- vendor/assets/stylesheets/mice/_component-animations.scss
|
79
83
|
- vendor/assets/stylesheets/mice/_forms.scss
|
80
84
|
- vendor/assets/stylesheets/mice/_grid.scss
|
81
85
|
- vendor/assets/stylesheets/mice/_icons.scss
|
@@ -85,6 +89,7 @@ files:
|
|
85
89
|
- vendor/assets/stylesheets/mice/_media.scss
|
86
90
|
- vendor/assets/stylesheets/mice/_menu.scss
|
87
91
|
- vendor/assets/stylesheets/mice/_mixins.scss
|
92
|
+
- vendor/assets/stylesheets/mice/_modals.scss
|
88
93
|
- vendor/assets/stylesheets/mice/_navbar.scss
|
89
94
|
- vendor/assets/stylesheets/mice/_normalize.scss
|
90
95
|
- vendor/assets/stylesheets/mice/_pagination.scss
|
@@ -95,9 +100,12 @@ files:
|
|
95
100
|
- vendor/assets/stylesheets/mice/_tables.scss
|
96
101
|
- vendor/assets/stylesheets/mice/_tabs.scss
|
97
102
|
- vendor/assets/stylesheets/mice/_timeline.scss
|
103
|
+
- vendor/assets/stylesheets/mice/_tipsy.scss
|
104
|
+
- vendor/assets/stylesheets/mice/_tooltips.scss
|
98
105
|
- vendor/assets/stylesheets/mice/_typography.scss
|
99
106
|
- vendor/assets/stylesheets/mice/_utilities.scss
|
100
107
|
- vendor/assets/stylesheets/mice/_variables.scss
|
108
|
+
- vendor/assets/stylesheets/mice/_wells.scss
|
101
109
|
- vendor/assets/stylesheets/mobile/bars.scss
|
102
110
|
- vendor/assets/stylesheets/mobile/base.scss
|
103
111
|
- vendor/assets/stylesheets/mobile/cards.scss
|