chosen-rails-adding 1.0.2.1

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.
@@ -0,0 +1,282 @@
1
+ class AbstractChosen
2
+
3
+ constructor: (@form_field, @options={}) ->
4
+ return unless AbstractChosen.browser_is_supported()
5
+ @is_multiple = @form_field.multiple
6
+ this.set_default_text()
7
+ this.set_default_values()
8
+
9
+ this.setup()
10
+
11
+ this.set_up_html()
12
+ this.register_observers()
13
+
14
+ set_default_values: ->
15
+ @click_test_action = (evt) => this.test_active_click(evt)
16
+ @activate_action = (evt) => this.activate_field(evt)
17
+ @active_field = false
18
+ @mouse_on_container = false
19
+ @results_showing = false
20
+ @result_highlighted = null
21
+ @allow_single_deselect = if @options.allow_single_deselect? and @form_field.options[0]? and @form_field.options[0].text is "" then @options.allow_single_deselect else false
22
+ @disable_search_threshold = @options.disable_search_threshold || 0
23
+ @disable_search = @options.disable_search || false
24
+ @enable_split_word_search = if @options.enable_split_word_search? then @options.enable_split_word_search else true
25
+ @group_search = if @options.group_search? then @options.group_search else true
26
+ @search_contains = @options.search_contains || false
27
+ @single_backstroke_delete = if @options.single_backstroke_delete? then @options.single_backstroke_delete else true
28
+ @max_selected_options = @options.max_selected_options || Infinity
29
+ @inherit_select_classes = @options.inherit_select_classes || false
30
+ @display_selected_options = if @options.display_selected_options? then @options.display_selected_options else true
31
+ @display_disabled_options = if @options.display_disabled_options? then @options.display_disabled_options else true
32
+ @create_option = @options.create_option || false
33
+ @persistent_create_option = @options.persistent_create_option || false
34
+ @skip_no_results = @options.skip_no_results || false
35
+
36
+ set_default_text: ->
37
+ if @form_field.getAttribute("data-placeholder")
38
+ @default_text = @form_field.getAttribute("data-placeholder")
39
+ else if @is_multiple
40
+ @default_text = @options.placeholder_text_multiple || @options.placeholder_text || AbstractChosen.default_multiple_text
41
+ else
42
+ @default_text = @options.placeholder_text_single || @options.placeholder_text || AbstractChosen.default_single_text
43
+
44
+ @results_none_found = @form_field.getAttribute("data-no_results_text") || @options.no_results_text || AbstractChosen.default_no_result_text
45
+ @create_option_text = @form_field.getAttribute("data-create_option_text") || @options.create_option_text || AbstractChosen.default_create_option_text
46
+
47
+ mouse_enter: -> @mouse_on_container = true
48
+ mouse_leave: -> @mouse_on_container = false
49
+
50
+ input_focus: (evt) ->
51
+ if @is_multiple
52
+ setTimeout (=> this.container_mousedown()), 50 unless @active_field
53
+ else
54
+ @activate_field() unless @active_field
55
+
56
+ input_blur: (evt) ->
57
+ if not @mouse_on_container
58
+ @active_field = false
59
+ setTimeout (=> this.blur_test()), 100
60
+
61
+ results_option_build: (options) ->
62
+ content = ''
63
+ for data in @results_data
64
+ if data.group
65
+ content += this.result_add_group data
66
+ else
67
+ content += this.result_add_option data
68
+
69
+ # this select logic pins on an awkward flag
70
+ # we can make it better
71
+ if options?.first
72
+ if data.selected and @is_multiple
73
+ this.choice_build data
74
+ else if data.selected and not @is_multiple
75
+ this.single_set_selected_text(data.text)
76
+
77
+ content
78
+
79
+ result_add_option: (option) ->
80
+ return '' unless option.search_match
81
+ return '' unless this.include_option_in_results(option)
82
+
83
+ classes = []
84
+ classes.push "active-result" if !option.disabled and !(option.selected and @is_multiple)
85
+ classes.push "disabled-result" if option.disabled and !(option.selected and @is_multiple)
86
+ classes.push "result-selected" if option.selected
87
+ classes.push "group-option" if option.group_array_index?
88
+ classes.push option.classes if option.classes != ""
89
+
90
+ option_el = document.createElement("li")
91
+ option_el.className = classes.join(" ")
92
+ option_el.style.cssText = option.style
93
+ option_el.setAttribute("data-option-array-index", option.array_index)
94
+ option_el.innerHTML = option.search_text
95
+
96
+ this.outerHTML(option_el)
97
+
98
+ result_add_group: (group) ->
99
+ return '' unless group.search_match || group.group_match
100
+ return '' unless group.active_options > 0
101
+
102
+ group_el = document.createElement("li")
103
+ group_el.className = "group-result"
104
+ group_el.innerHTML = group.search_text
105
+
106
+ this.outerHTML(group_el)
107
+
108
+ append_option: (option) ->
109
+ this.select_append_option(option)
110
+
111
+ results_update_field: ->
112
+ this.set_default_text()
113
+ this.results_reset_cleanup() if not @is_multiple
114
+ this.result_clear_highlight()
115
+ this.results_build()
116
+ this.winnow_results() if @results_showing
117
+
118
+ reset_single_select_options: () ->
119
+ for result in @results_data
120
+ result.selected = false if result.selected
121
+
122
+ results_toggle: ->
123
+ if @results_showing
124
+ this.results_hide()
125
+ else
126
+ this.results_show()
127
+
128
+ results_search: (evt) ->
129
+ if @results_showing
130
+ this.winnow_results()
131
+ else
132
+ this.results_show()
133
+
134
+ winnow_results: ->
135
+ this.no_results_clear()
136
+
137
+ results = 0
138
+ exact_result = false
139
+
140
+ searchText = this.get_search_text()
141
+ escapedSearchText = searchText.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&")
142
+ regexAnchor = if @search_contains then "" else "^"
143
+ regex = new RegExp(regexAnchor + escapedSearchText, 'i')
144
+ zregex = new RegExp(escapedSearchText, 'i')
145
+ eregex = new RegExp('^' + escapedSearchText + '$', 'i')
146
+
147
+ for option in @results_data
148
+
149
+ option.search_match = false
150
+ results_group = null
151
+
152
+ if this.include_option_in_results(option)
153
+
154
+ if option.group
155
+ option.group_match = false
156
+ option.active_options = 0
157
+
158
+ if option.group_array_index? and @results_data[option.group_array_index]
159
+ results_group = @results_data[option.group_array_index]
160
+ results += 1 if results_group.active_options is 0 and results_group.search_match
161
+ results_group.active_options += 1
162
+
163
+ unless option.group and not @group_search
164
+
165
+ option.search_text = if option.group then option.label else option.html
166
+ option.search_match = this.search_string_match(option.search_text, regex)
167
+ results += 1 if option.search_match and not option.group
168
+
169
+ exact_result = eregex.test option.html
170
+
171
+ if option.search_match
172
+ if searchText.length
173
+ startpos = option.search_text.search zregex
174
+ text = option.search_text.substr(0, startpos + searchText.length) + '</em>' + option.search_text.substr(startpos + searchText.length)
175
+ option.search_text = text.substr(0, startpos) + '<em>' + text.substr(startpos)
176
+
177
+ results_group.group_match = true if results_group?
178
+
179
+ else if option.group_array_index? and @results_data[option.group_array_index].search_match
180
+ option.search_match = true
181
+
182
+ this.result_clear_highlight()
183
+
184
+ if results < 1 and searchText.length
185
+ this.update_results_content ""
186
+ this.no_results searchText unless @create_option and @skip_no_results
187
+ else
188
+ this.update_results_content this.results_option_build()
189
+ this.winnow_results_set_highlight()
190
+
191
+ if @create_option and (results < 1 or (!exact_result and @persistent_create_option)) and searchText.length
192
+ this.show_create_option( searchText )
193
+
194
+ search_string_match: (search_string, regex) ->
195
+ if regex.test search_string
196
+ return true
197
+ else if @enable_split_word_search and (search_string.indexOf(" ") >= 0 or search_string.indexOf("[") == 0)
198
+ #TODO: replace this substitution of /\[\]/ with a list of characters to skip.
199
+ parts = search_string.replace(/\[|\]/g, "").split(" ")
200
+ if parts.length
201
+ for part in parts
202
+ if regex.test part
203
+ return true
204
+
205
+ choices_count: ->
206
+ return @selected_option_count if @selected_option_count?
207
+
208
+ @selected_option_count = 0
209
+ for option in @form_field.options
210
+ @selected_option_count += 1 if option.selected
211
+
212
+ return @selected_option_count
213
+
214
+ choices_click: (evt) ->
215
+ evt.preventDefault()
216
+ this.results_show() unless @results_showing or @is_disabled
217
+
218
+ keyup_checker: (evt) ->
219
+ stroke = evt.which ? evt.keyCode
220
+ this.search_field_scale()
221
+
222
+ switch stroke
223
+ when 8
224
+ if @is_multiple and @backstroke_length < 1 and this.choices_count() > 0
225
+ this.keydown_backstroke()
226
+ else if not @pending_backstroke
227
+ this.result_clear_highlight()
228
+ this.results_search()
229
+ when 13
230
+ evt.preventDefault()
231
+ this.result_select(evt) if this.results_showing
232
+ when 27
233
+ this.results_hide() if @results_showing
234
+ return true
235
+ when 9, 38, 40, 16, 91, 17
236
+ # don't do anything on these keys
237
+ else this.results_search()
238
+
239
+ container_width: ->
240
+ return if @options.width? then @options.width else "#{@form_field.offsetWidth}px"
241
+
242
+ include_option_in_results: (option) ->
243
+ return false if @is_multiple and (not @display_selected_options and option.selected)
244
+ return false if not @display_disabled_options and option.disabled
245
+ return false if option.empty
246
+
247
+ return true
248
+
249
+ search_results_touchstart: (evt) ->
250
+ @touch_started = true
251
+ this.search_results_mouseover(evt)
252
+
253
+ search_results_touchmove: (evt) ->
254
+ @touch_started = false
255
+ this.search_results_mouseout(evt)
256
+
257
+ search_results_touchend: (evt) ->
258
+ this.search_results_mouseup(evt) if @touch_started
259
+
260
+ outerHTML: (element) ->
261
+ return element.outerHTML if element.outerHTML
262
+ tmp = document.createElement("div")
263
+ tmp.appendChild(element)
264
+ tmp.innerHTML
265
+
266
+ # class methods and variables ============================================================
267
+
268
+ @browser_is_supported: ->
269
+ if window.navigator.appName == "Microsoft Internet Explorer"
270
+ return document.documentMode >= 8
271
+ if /iP(od|hone)/i.test(window.navigator.userAgent)
272
+ return false
273
+ if /Android/i.test(window.navigator.userAgent)
274
+ return false if /Mobile/i.test(window.navigator.userAgent)
275
+ return true
276
+
277
+ @default_multiple_text: "Select Some Options"
278
+ @default_single_text: "Select an Option"
279
+ @default_no_result_text: "No results match"
280
+ @default_create_option_text: "Add Option"
281
+
282
+ window.AbstractChosen = AbstractChosen
@@ -0,0 +1,66 @@
1
+ class SelectParser
2
+
3
+ constructor: ->
4
+ @options_index = 0
5
+ @parsed = []
6
+
7
+ add_node: (child) ->
8
+ if child.nodeName.toUpperCase() is "OPTGROUP"
9
+ this.add_group child
10
+ else
11
+ this.add_option child
12
+
13
+ add_group: (group) ->
14
+ group_position = @parsed.length
15
+ @parsed.push
16
+ array_index: group_position
17
+ group: true
18
+ label: this.escapeExpression(group.label)
19
+ children: 0
20
+ disabled: group.disabled
21
+ this.add_option( option, group_position, group.disabled ) for option in group.childNodes
22
+
23
+ add_option: (option, group_position, group_disabled) ->
24
+ if option.nodeName.toUpperCase() is "OPTION"
25
+ if option.text != ""
26
+ if group_position?
27
+ @parsed[group_position].children += 1
28
+ @parsed.push
29
+ array_index: @parsed.length
30
+ options_index: @options_index
31
+ value: option.value
32
+ text: option.text
33
+ html: option.innerHTML
34
+ selected: option.selected
35
+ disabled: if group_disabled is true then group_disabled else option.disabled
36
+ group_array_index: group_position
37
+ classes: option.className
38
+ style: option.style.cssText
39
+ else
40
+ @parsed.push
41
+ array_index: @parsed.length
42
+ options_index: @options_index
43
+ empty: true
44
+ @options_index += 1
45
+
46
+ escapeExpression: (text) ->
47
+ if not text? or text is false
48
+ return ""
49
+ unless /[\&\<\>\"\'\`]/.test(text)
50
+ return text
51
+ map =
52
+ "<": "&lt;"
53
+ ">": "&gt;"
54
+ '"': "&quot;"
55
+ "'": "&#x27;"
56
+ "`": "&#x60;"
57
+ unsafe_chars = /&(?!\w+;)|[\<\>\"\'\`]/g
58
+ text.replace unsafe_chars, (chr) ->
59
+ map[chr] || "&amp;"
60
+
61
+ SelectParser.select_to_array = (select) ->
62
+ parser = new SelectParser()
63
+ parser.add_node( child ) for child in select.childNodes
64
+ parser.parsed
65
+
66
+ window.SelectParser = SelectParser
@@ -0,0 +1,411 @@
1
+ @import "compass/css3/box-sizing";
2
+ @import "compass/css3/images";
3
+ @import "compass/css3/user-interface";
4
+
5
+ $chosen-sprite: image-url('chosen-sprite.png');
6
+ $chosen-sprite-retina: image-url('chosen-sprite@2x.png');
7
+
8
+ /* @group Base */
9
+ .chosen-container {
10
+ position: relative;
11
+ display: inline-block;
12
+ vertical-align: middle;
13
+ font-size: 13px;
14
+ zoom: 1;
15
+ *display: inline;
16
+ @include user-select(none);
17
+ .chosen-drop {
18
+ position: absolute;
19
+ top: 100%;
20
+ left: -9999px;
21
+ z-index: 1010;
22
+ @include box-sizing(border-box);
23
+ width: 100%;
24
+ border: 1px solid #aaa;
25
+ border-top: 0;
26
+ background: #fff;
27
+ box-shadow: 0 4px 5px rgba(#000,.15);
28
+ }
29
+ &.chosen-with-drop .chosen-drop {
30
+ left: 0;
31
+ }
32
+ a{
33
+ cursor: pointer;
34
+ }
35
+ }
36
+ /* @end */
37
+
38
+ /* @group Single Chosen */
39
+ .chosen-container-single{
40
+ .chosen-single {
41
+ position: relative;
42
+ display: block;
43
+ overflow: hidden;
44
+ padding: 0 0 0 8px;
45
+ height: 23px;
46
+ border: 1px solid #aaa;
47
+ border-radius: 5px;
48
+ background-color: #fff;
49
+ @include background(linear-gradient(top, #fff 20%, #f6f6f6 50%, #eee 52%, #f4f4f4 100%));
50
+ background-clip: padding-box;
51
+ box-shadow: 0 0 3px #fff inset, 0 1px 1px rgba(#000,.1);
52
+ color: #444;
53
+ text-decoration: none;
54
+ white-space: nowrap;
55
+ line-height: 24px;
56
+ }
57
+ .chosen-default {
58
+ color: #999;
59
+ }
60
+ .chosen-single span {
61
+ display: block;
62
+ overflow: hidden;
63
+ margin-right: 26px;
64
+ text-overflow: ellipsis;
65
+ white-space: nowrap;
66
+ }
67
+ .chosen-single-with-deselect span {
68
+ margin-right: 38px;
69
+ }
70
+ .chosen-single abbr {
71
+ position: absolute;
72
+ top: 6px;
73
+ right: 26px;
74
+ display: block;
75
+ width: 12px;
76
+ height: 12px;
77
+ background: $chosen-sprite -42px 1px no-repeat;
78
+ font-size: 1px;
79
+ &:hover {
80
+ background-position: -42px -10px;
81
+ }
82
+ }
83
+ &.chosen-disabled .chosen-single abbr:hover {
84
+ background-position: -42px -10px;
85
+ }
86
+ .chosen-single div {
87
+ position: absolute;
88
+ top: 0;
89
+ right: 0;
90
+ display: block;
91
+ width: 18px;
92
+ height: 100%;
93
+ b {
94
+ display: block;
95
+ width: 100%;
96
+ height: 100%;
97
+ background: $chosen-sprite no-repeat 0px 2px;
98
+ }
99
+ }
100
+ .chosen-search {
101
+ position: relative;
102
+ z-index: 1010;
103
+ margin: 0;
104
+ padding: 3px 4px;
105
+ white-space: nowrap;
106
+ input[type="text"] {
107
+ @include box-sizing(border-box);
108
+ margin: 1px 0;
109
+ padding: 4px 20px 4px 5px;
110
+ width: 100%;
111
+ height: auto;
112
+ outline: 0;
113
+ border: 1px solid #aaa;
114
+ background: #fff $chosen-sprite no-repeat 100% -20px;
115
+ @include background($chosen-sprite no-repeat 100% -20px, linear-gradient(#eee 1%, #fff 15%));
116
+ font-size: 1em;
117
+ font-family: sans-serif;
118
+ line-height: normal;
119
+ border-radius: 0;
120
+ }
121
+ }
122
+ .chosen-drop {
123
+ margin-top: -1px;
124
+ border-radius: 0 0 4px 4px;
125
+ background-clip: padding-box;
126
+ }
127
+ &.chosen-container-single-nosearch .chosen-search {
128
+ position: absolute;
129
+ left: -9999px;
130
+ }
131
+ }
132
+ /* @end */
133
+
134
+ /* @group Results */
135
+ .chosen-container .chosen-results {
136
+ position: relative;
137
+ overflow-x: hidden;
138
+ overflow-y: auto;
139
+ margin: 0 4px 4px 0;
140
+ padding: 0 0 0 4px;
141
+ max-height: 240px;
142
+ -webkit-overflow-scrolling: touch;
143
+ li {
144
+ display: none;
145
+ margin: 0;
146
+ padding: 5px 6px;
147
+ list-style: none;
148
+ line-height: 15px;
149
+ -webkit-touch-callout: none;
150
+ &.active-result {
151
+ display: list-item;
152
+ cursor: pointer;
153
+ }
154
+ &.disabled-result {
155
+ display: list-item;
156
+ color: #ccc;
157
+ cursor: default;
158
+ }
159
+ &.highlighted {
160
+ background-color: #3875d7;
161
+ @include background-image(linear-gradient(#3875d7 20%, #2a62bc 90%));
162
+ color: #fff;
163
+ }
164
+ &.no-results {
165
+ display: list-item;
166
+ background: #f4f4f4;
167
+ }
168
+ &.group-result {
169
+ display: list-item;
170
+ font-weight: bold;
171
+ cursor: default;
172
+ }
173
+ &.group-option {
174
+ padding-left: 15px;
175
+ }
176
+ em {
177
+ font-style: normal;
178
+ text-decoration: underline;
179
+ }
180
+ }
181
+ }
182
+ /* @end */
183
+
184
+ /* @group Multi Chosen */
185
+ .chosen-container-multi{
186
+ .chosen-choices {
187
+ position: relative;
188
+ overflow: hidden;
189
+ @include box-sizing(border-box);
190
+ margin: 0;
191
+ padding: 0;
192
+ width: 100%;
193
+ height: auto !important;
194
+ height: 1%;
195
+ border: 1px solid #aaa;
196
+ background-color: #fff;
197
+ @include background-image(linear-gradient(#eee 1%, #fff 15%));
198
+ cursor: text;
199
+ }
200
+ .chosen-choices li {
201
+ float: left;
202
+ list-style: none;
203
+ &.search-field {
204
+ margin: 0;
205
+ padding: 0;
206
+ white-space: nowrap;
207
+ input[type="text"] {
208
+ margin: 1px 0;
209
+ padding: 5px;
210
+ height: 15px;
211
+ outline: 0;
212
+ border: 0 !important;
213
+ background: transparent !important;
214
+ box-shadow: none;
215
+ color: #666;
216
+ font-size: 100%;
217
+ font-family: sans-serif;
218
+ line-height: normal;
219
+ border-radius: 0;
220
+ }
221
+ .default {
222
+ color: #999;
223
+ }
224
+ }
225
+ &.search-choice {
226
+ position: relative;
227
+ margin: 3px 0 3px 5px;
228
+ padding: 3px 20px 3px 5px;
229
+ border: 1px solid #aaa;
230
+ border-radius: 3px;
231
+ background-color: #e4e4e4;
232
+ @include background-image(linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%));
233
+ background-clip: padding-box;
234
+ box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(#000,.05);
235
+ color: #333;
236
+ line-height: 13px;
237
+ cursor: default;
238
+ .search-choice-close {
239
+ position: absolute;
240
+ top: 4px;
241
+ right: 3px;
242
+ display: block;
243
+ width: 12px;
244
+ height: 12px;
245
+ background: $chosen-sprite -42px 1px no-repeat;
246
+ font-size: 1px;
247
+ &:hover {
248
+ background-position: -42px -10px;
249
+ }
250
+ }
251
+ }
252
+ &.search-choice-disabled {
253
+ padding-right: 5px;
254
+ border: 1px solid #ccc;
255
+ background-color: #e4e4e4;
256
+ @include background-image(linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%));
257
+ color: #666;
258
+ }
259
+ &.search-choice-focus {
260
+ background: #d4d4d4;
261
+ .search-choice-close {
262
+ background-position: -42px -10px;
263
+ }
264
+ }
265
+ }
266
+ .chosen-results {
267
+ margin: 0;
268
+ padding: 0;
269
+ }
270
+ .chosen-drop .result-selected {
271
+ display: list-item;
272
+ color: #ccc;
273
+ cursor: default;
274
+ }
275
+ }
276
+ /* @end */
277
+
278
+ /* @group Active */
279
+ .chosen-container-active{
280
+ .chosen-single {
281
+ border: 1px solid #5897fb;
282
+ box-shadow: 0 0 5px rgba(#000,.3);
283
+ }
284
+ &.chosen-with-drop{
285
+ .chosen-single {
286
+ border: 1px solid #aaa;
287
+ -moz-border-radius-bottomright: 0;
288
+ border-bottom-right-radius: 0;
289
+ -moz-border-radius-bottomleft: 0;
290
+ border-bottom-left-radius: 0;
291
+ @include background-image(linear-gradient(#eee 20%, #fff 80%));
292
+ box-shadow: 0 1px 0 #fff inset;
293
+ }
294
+ .chosen-single div {
295
+ border-left: none;
296
+ background: transparent;
297
+ b {
298
+ background-position: -18px 2px;
299
+ }
300
+ }
301
+ }
302
+ .chosen-choices {
303
+ border: 1px solid #5897fb;
304
+ box-shadow: 0 0 5px rgba(#000,.3);
305
+ li.search-field input[type="text"] {
306
+ color: #111 !important;
307
+ }
308
+ }
309
+ }
310
+ /* @end */
311
+
312
+ /* @group Disabled Support */
313
+ .chosen-disabled {
314
+ opacity: 0.5 !important;
315
+ cursor: default;
316
+ .chosen-single {
317
+ cursor: default;
318
+ }
319
+ .chosen-choices .search-choice .search-choice-close {
320
+ cursor: default;
321
+ }
322
+ }
323
+ /* @end */
324
+
325
+ /* @group Right to Left */
326
+ .chosen-rtl {
327
+ text-align: right;
328
+ .chosen-single {
329
+ overflow: visible;
330
+ padding: 0 8px 0 0;
331
+ }
332
+ .chosen-single span {
333
+ margin-right: 0;
334
+ margin-left: 26px;
335
+ direction: rtl;
336
+ }
337
+ .chosen-single-with-deselect span {
338
+ margin-left: 38px;
339
+ }
340
+ .chosen-single div {
341
+ right: auto;
342
+ left: 3px;
343
+ }
344
+ .chosen-single abbr {
345
+ right: auto;
346
+ left: 26px;
347
+ }
348
+ .chosen-choices li {
349
+ float: right;
350
+ &.search-field input[type="text"] {
351
+ direction: rtl;
352
+ }
353
+ &.search-choice {
354
+ margin: 3px 5px 3px 0;
355
+ padding: 3px 5px 3px 19px;
356
+ .search-choice-close {
357
+ right: auto;
358
+ left: 4px;
359
+ }
360
+ }
361
+ }
362
+ &.chosen-container-single-nosearch .chosen-search,
363
+ .chosen-drop {
364
+ left: 9999px;
365
+ }
366
+ &.chosen-container-single .chosen-results {
367
+ margin: 0 0 4px 4px;
368
+ padding: 0 4px 0 0;
369
+ }
370
+ .chosen-results li.group-option {
371
+ padding-right: 15px;
372
+ padding-left: 0;
373
+ }
374
+ &.chosen-container-active.chosen-with-drop .chosen-single div {
375
+ border-right: none;
376
+ }
377
+ .chosen-search input[type="text"] {
378
+ padding: 4px 5px 4px 20px;
379
+ background: #fff $chosen-sprite no-repeat -30px -20px;
380
+ @include background($chosen-sprite no-repeat -30px -20px, linear-gradient(#eee 1%, #fff 15%));
381
+ direction: rtl;
382
+ }
383
+ &.chosen-container-single{
384
+ .chosen-single div b {
385
+ background-position: 6px 2px;
386
+ }
387
+ &.chosen-with-drop{
388
+ .chosen-single div b {
389
+ background-position: -12px 2px;
390
+ }
391
+ }
392
+ }
393
+ }
394
+
395
+ /* @end */
396
+
397
+ /* @group Retina compatibility */
398
+ @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 144dpi) {
399
+ .chosen-rtl .chosen-search input[type="text"],
400
+ .chosen-container-single .chosen-single abbr,
401
+ .chosen-container-single .chosen-single div b,
402
+ .chosen-container-single .chosen-search input[type="text"],
403
+ .chosen-container-multi .chosen-choices .search-choice .search-choice-close,
404
+ .chosen-container .chosen-results-scroll-down span,
405
+ .chosen-container .chosen-results-scroll-up span {
406
+ background-image: $chosen-sprite-retina !important;
407
+ background-size: 52px 37px !important;
408
+ background-repeat: no-repeat !important;
409
+ }
410
+ }
411
+ /* @end */