UNPKG

zui

Version:

一个基于 Bootstrap 深度定制开源前端实践方案,帮助你快速构建现代跨屏应用。

453 lines (448 loc) 13 kB
/*! * Chosen, a Select Box Enhancer for jQuery and Prototype * by Patrick Filler for Harvest, http://getharvest.com * * Copyright (c) 2011-2016 Harvest http://getharvest.com * MIT License, https://github.com/harvesthq/chosen/blob/master/LICENSE.md */ .chosen-container { position: relative; display: inline-block; font-size: 13px; vertical-align: middle; zoom: 1; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; *display: inline; } .chosen-container .chosen-drop { position: absolute; top: 100%; z-index: 1010; display: none; width: 100%; background: #fff; border: 1px solid #cbcbcb; border: 1px solid rgba(0, 0, 0, .15); border-top: 0; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); box-shadow: 0 6px 12px rgba(0, 0, 0, .175); } .chosen-container .chosen-drop.chosen-drop-size-limited { border-top: 1px solid rgba(0, 0, 0, .15); } .chosen-container.chosen-with-drop .chosen-drop { display: block; } .chosen-container a { cursor: pointer; } .chosen-container.chosen-up .chosen-drop { top: inherit; bottom: 100%; margin-top: auto; margin-bottom: -1px; border-radius: 2px 2px 0 0; -webkit-box-shadow: 0 -3px 5px rgba(0, 0, 0, .175); box-shadow: 0 -3px 5px rgba(0, 0, 0, .175); } .chosen-container-single .chosen-single { display: block; width: 100%; height: 32px; padding: 5px 8px; overflow: hidden; line-height: 1.53846154; color: #222; text-decoration: none; white-space: nowrap; vertical-align: middle; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; } .chosen-container-single .chosen-default { color: #808080; } .chosen-container-single .chosen-single > span { display: block; margin-right: 26px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .chosen-container-single .chosen-single-with-deselect span { margin-right: 38px; } .chosen-container-single .chosen-single abbr { position: absolute; top: 7px; right: 24px; display: block; width: 20px; height: 20px; font-size: 19.5px; font-weight: bold; line-height: 14px; color: #000; text-align: center; text-shadow: 0 1px 0 #fff; filter: alpha(opacity=20); opacity: .2; } .chosen-container-single .chosen-single abbr:before { content: '×'; } .chosen-container-single .chosen-single abbr:hover, .chosen-container-single .chosen-single abbr:focus { color: #000; text-decoration: none; cursor: pointer; filter: alpha(opacity=50); opacity: .5; } .chosen-container-single .chosen-single div { position: absolute; top: 0; right: 0; display: block; height: 100%; padding: 5px 8px; } .chosen-container-single .chosen-single div b { display: inline-block; width: 0; height: 0; margin-bottom: 2px; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-top: 4px solid \9; border-right: 4px solid transparent; border-left: 4px solid transparent; } .chosen-container-single .chosen-search { position: relative; z-index: 1010; padding: 3px 4px; margin: 0; white-space: nowrap; } .chosen-container-single .chosen-search input[type="text"] { width: 100%; height: 27px; padding: 2px 26px 2px 8px; margin: 1px 0; font-size: 12px; line-height: 1.5; background-color: #fff; border: 1px solid #ccc; border-radius: 4px; outline: 0; } .chosen-container-single .chosen-search input[type="text"]:focus { border-color: #145ccd; } .chosen-container-single .chosen-search:before { position: absolute; top: 10px; right: 10px; display: block; font-family: ZenIcon; font-size: 14px; font-style: normal; font-weight: normal; font-variant: normal; line-height: 1; color: #808080; text-transform: none; content: '\e603'; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .chosen-container-single .chosen-drop { margin-top: -1px; -webkit-background-clip: padding-box; background-clip: padding-box; border-radius: 0 0 4px 4px; } .chosen-container-single.chosen-container-single-nosearch .chosen-search { position: absolute; left: -9999px; } .chosen-container .chosen-results { position: relative; max-height: 240px; padding: 0; margin: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; } .chosen-container .chosen-results li { display: none; padding: 5px 10px; margin: 0; line-height: 15px; list-style: none; -webkit-transition: background-color .2s cubic-bezier(.175, .885, .32, 1); -o-transition: background-color .2s cubic-bezier(.175, .885, .32, 1); transition: background-color .2s cubic-bezier(.175, .885, .32, 1); -webkit-touch-callout: none; } .chosen-container .chosen-results li.active-result { display: list-item; cursor: pointer; } .chosen-container .chosen-results li.disabled-result { display: list-item; color: #ccc; cursor: default; } .chosen-container .chosen-results li.highlighted { color: #fff; background-color: #3280fc; } .chosen-container .chosen-results li.no-results { display: list-item; background: #f4f4f4; } .chosen-container .chosen-results li.group-result { display: list-item; font-weight: bold; cursor: default; } .chosen-container .chosen-results li.group-option { padding-left: 15px; } .chosen-container .chosen-results li em { font-style: normal; text-decoration: underline; } .chosen-container-multi .chosen-choices { position: relative; width: 100%; min-height: 32px; min-height: 30px \0; padding: 0; margin: 0; overflow: hidden; cursor: text; background-color: #fff; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; } .chosen-container-multi .chosen-choices:before, .chosen-container-multi .chosen-choices:after { display: table; content: " "; } .chosen-container-multi .chosen-choices:after { clear: both; } .chosen-container-multi .chosen-choices li { display: block; float: left; padding: 0 6px; margin: 5px 0 0 6px; list-style: none; } .chosen-container-multi .chosen-choices li.search-field { padding: 0; margin-bottom: 4px; white-space: nowrap; } .chosen-container-multi .chosen-choices li.search-field input[type="text"] { height: 20px; font-size: 100%; color: #808080; background: transparent !important; border: 0 !important; border-radius: 0; outline: 0; -webkit-box-shadow: none; box-shadow: none; } .chosen-container-multi .chosen-choices li.search-field .default { color: #999; } .chosen-container-multi .chosen-choices li.search-field:before { position: absolute; right: 8px; bottom: 8px; display: block; font-family: ZenIcon; font-size: 14px; font-style: normal; font-weight: normal; font-variant: normal; line-height: 1; color: #808080; text-transform: none; content: '\e603'; opacity: 0; -webkit-transition: opacity .2s cubic-bezier(.175, .885, .32, 1); -o-transition: opacity .2s cubic-bezier(.175, .885, .32, 1); transition: opacity .2s cubic-bezier(.175, .885, .32, 1); speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .chosen-container-multi .chosen-choices li.search-choice { position: relative; padding: 3px 20px 3px 5px; line-height: 12px; cursor: default; background-color: #f1f1f1; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid #ddd; border-radius: 3px; -webkit-box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, .05); box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, .05); -webkit-transition: all .4s cubic-bezier(.175, .885, .32, 1); -o-transition: all .4s cubic-bezier(.175, .885, .32, 1); transition: all .4s cubic-bezier(.175, .885, .32, 1); } .chosen-container-multi .chosen-choices li.search-choice:hover { background-color: #fff; border-color: #c4c4c4; -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .1); box-shadow: 0 1px 0 rgba(0, 0, 0, .1); } .chosen-container-multi .chosen-choices li.search-choice .search-choice-close { position: absolute; top: 0; right: 0; display: block; width: 20px; height: 20px; font-size: 15.6px; font-weight: bold; line-height: 14px; color: #000; text-align: center; text-shadow: 0 1px 0 #fff; filter: alpha(opacity=20); opacity: .2; } .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:before { content: '×'; } .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover, .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:focus { color: #000; text-decoration: none; cursor: pointer; filter: alpha(opacity=50); opacity: .5; } .chosen-container-multi .chosen-choices li.search-choice-disabled { padding-right: 5px; color: #666; background-color: #e4e4e4; border: 1px solid #ccc; } .chosen-container-multi .chosen-choices li.search-choice-focus { background: #d4d4d4; } .chosen-container-multi .chosen-choices li.search-choice-focus .search-choice-close { background-position: -42px -10px; } .chosen-container-multi .chosen-results { padding: 5px 0; margin: 0; } .chosen-container-multi .chosen-drop .result-selected { display: list-item; color: #ccc; cursor: default; } .chosen-container-active .chosen-single { border-color: #145ccd; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(20, 92, 205, .6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(20, 92, 205, .6); } .chosen-container-active.chosen-with-drop .chosen-single { border: 1px solid #cbcbcb; border: 1px solid rgba(0, 0, 0, .15); border-bottom-right-radius: 0; border-bottom-left-radius: 0; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); box-shadow: 0 6px 12px rgba(0, 0, 0, .175); } .chosen-container-active.chosen-with-drop .chosen-single div { background: transparent; border-left: none; } .chosen-container-active.chosen-with-drop .chosen-single div b { content: ""; border-top: 0 dotted; border-bottom: 4px solid; } .chosen-container-active.chosen-with-drop.chosen-up .chosen-single { border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); box-shadow: 0 6px 12px rgba(0, 0, 0, .175); } .chosen-container-active .chosen-choices { border-color: #145ccd; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(20, 92, 205, .6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(20, 92, 205, .6); } .chosen-container-active .chosen-choices li.search-field input[type="text"] { color: #111 !important; } .chosen-container-active .chosen-choices li.search-field:before { opacity: 1; } .chosen-disabled { cursor: default; opacity: .5 !important; } .chosen-disabled .chosen-single { cursor: default; } .chosen-disabled .chosen-choices .search-choice .search-choice-close { cursor: default; } .chosen-compact.chosen-container-single .chosen-single > .chosen-search { left: 0; display: none; padding: 3px 4px; opacity: 0; } .chosen-compact.chosen-container-single .chosen-single > .chosen-search > input { height: 25px; padding: 2px 26px 2px 4px; font-size: inherit; } .chosen-compact.chosen-container-single .chosen-single > .chosen-search:before { top: 9px; } .chosen-compact.chosen-with-search.chosen-with-drop .chosen-single > .chosen-search { display: block; opacity: 1; }