select2.less
222 lines
| 9.0 KiB
| text/x-less
|
LessCssLexer
| r1 | // select2.less | |||
| // For use in RhodeCode application drop down select boxes; | ||||
| // see style guide documentation for guidelines. | ||||
| // SELECT2 DROPDOWN MENUS | ||||
| //Select2 Dropdown | ||||
| .select2-results{ | ||||
| .box-sizing(border-box); | ||||
| overflow-y: scroll; | ||||
| } | ||||
| .select2-container{margin: 0; position: relative; display: inline-block; zoom: 1;} | ||||
| .select2-container, | ||||
| .select2-drop, | ||||
| .select2-search, | ||||
| .select2-search input {.box-sizing(border-box);} | ||||
| .select2-container .select2-choice{display:block; line-height:1em; -webkit-touch-callout:none;-moz-user-select:none;-ms-user-select:none;user-select:none; } | ||||
| .main .select2-container .select2-choice { background-color: white; } | ||||
| .select2-container .select2-choice abbr { display: none; width: 12px; height: 12px; position: absolute; right: 24px; top: 8px; font-size: 1px; text-decoration: none; border: 0; background: url('../images/select2.png') right top no-repeat; cursor: pointer; outline: 0; } | ||||
| .select2-container.select2-allowclear .select2-choice abbr {display: inline-block;} | ||||
| .select2-container .select2-choice abbr:hover { background-position: right -11px; cursor: pointer; } | ||||
| .select2-drop-mask { border: 0; margin: 0; padding: 0; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 998; background-color: #fff; filter: alpha(opacity=0); } | ||||
| .select2-drop { width: 100%; margin-top: -1px; position: absolute; z-index: 999; top: 100%; background: #fff; color: #000; border: @border-thickness solid @rcblue; border-top: 0; border-radius: 0 0 @border-radius @border-radius; } | ||||
| .select2-drop.select2-drop-above { margin-top: 1px; border-top: @border-thickness solid @rclightblue; border-bottom: 0; border-radius: @border-radius @border-radius 0 0; } | ||||
| .select2-drop-active { border: @border-thickness solid #5897fb; border-top: none; } | ||||
| .select2-drop.select2-drop-above.select2-drop-active {border-top: @border-thickness solid #5897fb;} | ||||
| .select2-drop-auto-width { border-top: @border-thickness solid #aaa; width: auto; } | ||||
| .select2-drop-auto-width .select2-search {padding-top: 4px;} | ||||
| html[dir="rtl"] .select2-container .select2-choice .select2-arrow { left: 0; right: auto; border-left: none; border-right: @border-thickness solid @grey5; border-radius: @border-radius 0 0 @border-radius; } | ||||
| html[dir="rtl"] .select2-container .select2-choice .select2-arrow b {background-position: 2px 1px;} | ||||
| .select2-search { display: inline-block; width: 100%; min-height: 26px; margin: 0; padding-left: 4px; padding-right: 4px; position: relative; z-index: 1000; white-space: nowrap; } | ||||
| .select2-search input { width: 100%; height: auto !important; min-height: 26px; padding: 4px 20px 4px 5px; margin: 0; outline: 0; } | ||||
| html[dir="rtl"] .select2-search input { padding: 4px 5px 4px 20px; background: #fff url('../images/select2.png') no-repeat -37px -22px; } | ||||
| .select2-drop.select2-drop-above .select2-search input {margin-top: 4px;} | ||||
| .select2-dropdown-open .select2-choice .select2-arrow { background: transparent; border-left: none; filter: none; } | ||||
| html[dir="rtl"] .select2-dropdown-open .select2-choice .select2-arrow {border-right: none;} | ||||
| .select2-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } | ||||
| /* results */ | ||||
| .select2-results { max-height: 200px; padding: 0 0 0 4px; margin: 4px 4px 4px 0; position: relative; overflow-x: hidden; overflow-y: auto; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } | ||||
| html[dir="rtl"] .select2-results { padding: 0 4px 0 0; margin: 4px 0 4px 4px; } | ||||
| .select2-results .select2-disabled{background:@grey6;display:list-item;cursor:default} | ||||
| .select2-results .select2-selected{display:none} | ||||
| .select2-more-results.select2-active{background:#f4f4f4 url('../images/select2-spinner.gif') no-repeat 100%} | ||||
| .select2-container.select2-container-disabled .select2-choice abbr{display:none} | ||||
| .select2-container.select2-container-disabled {background:@grey6;cursor:default} | ||||
| .select2-container.select2-container-disabled .select2-choice {background:@grey6;cursor:default} | ||||
| .select2-container-multi .select2-choices li{float:left;list-style:none} | ||||
| .select2-container-multi .select2-choices .select2-search-field{margin:0;padding:0;white-space:nowrap} | ||||
| .select2-container-multi .select2-choices .select2-search-choice .select2-chosen{cursor:default} | ||||
| .select2-search-choice-close{display:block;width:12px;height:13px;position:absolute;right:3px;top:4px;font-size:1px;outline:none;background:url('../images/select2.png') right top no-repeat} | ||||
| .select2-container-multi .select2-search-choice-close{left:3px} | ||||
| .select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover{background-position:right -11px} | ||||
| .select2-container-multi .select2-choices .select2-search-choice-focus .select2-search-choice-close{background-position:right -11px} | ||||
| .select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice .select2-search-choice-close{display:none;background:none} | ||||
| .select2-offscreen,.select2-offscreen:focus{clip:rect(0 0 0 0) !important;width:1px !important;height:1px !important; | ||||
| border:0 !important;margin:0 !important;padding:0 !important;overflow:hidden !important; | ||||
| position: absolute !important;outline:0 !important;left:0 !important;top:0 !important} | ||||
| .select2-display-none, | ||||
| .select2-search-hidden {display:none} | ||||
| .select2-search input { border-color: @rclightblue; } | ||||
| .select2-measure-scrollbar{position:absolute;top:-10000px;left:-10000px;width:100px;height:100px;overflow:scroll} | ||||
| @media only screen and (-webkit-min-device-pixel-ratio:1.5), | ||||
| only screen and (min-resolution:144dpi){ | ||||
| .select2-search input, | ||||
| .select2-search-choice-close, | ||||
| .select2-container .select2-choice abbr, | ||||
| .select2-container .select2-choice .select2-arrow b{background-image:url('../images/select2x2.png');background-repeat:no-repeat;background-size:60px 40px;} | ||||
| .select2-search input{background-position:100% -21px} | ||||
| } | ||||
| [class^="input-"] [class^="select2-choice"]>div{display:none} | ||||
| [class^="input-"] .select2-offscreen{position:absolute} | ||||
| select.select2{height:28px;visibility:hidden} | ||||
| .autocomplete-suggestions{overflow:auto} | ||||
| .autocomplete-suggestion{white-space:nowrap;overflow:hidden} | ||||
| /* Retina-ize icons */ | ||||
| @media only screen and (-webkit-min-device-pixel-ratio:1.5), | ||||
| only screen and (min-resolution:144dpi){ | ||||
| .select2-search input, | ||||
| .select2-search-choice-close, | ||||
| .select2-container .select2-choice abbr, | ||||
| .select2-container .select2-choice .select2-arrow b{background-image:url('../images/select2x2.png');background-repeat:no-repeat;background-size:60px 40px;} | ||||
| .select2-search input{background-position:100% -21px} | ||||
| } | ||||
| //Internal Select2 Dropdown Menus | ||||
| .drop-menu-core { | ||||
| min-width: 160px; | ||||
| margin: 0 @padding 0 0; | ||||
| padding: 0; | ||||
| border: @border-thickness solid @rcblue; | ||||
| border-radius: @border-radius; | ||||
| color: @rcblue; | ||||
| background-color: white; | ||||
| } | ||||
| .drop-menu-dropdown { | ||||
| .drop-menu-core; | ||||
| .flag_status { | ||||
| margin-top: 0; | ||||
| } | ||||
| } | ||||
| .drop-menu-base { | ||||
| .drop-menu-core; | ||||
| position: relative; | ||||
| display: inline-block; | ||||
| line-height: 1em; | ||||
| z-index: 2; | ||||
| cursor: pointer; | ||||
| .flag_status { | ||||
| margin-top: 0; | ||||
| } | ||||
| a { | ||||
| display:block; | ||||
| padding: .9em; | ||||
| padding-right: 2em; | ||||
| position: relative; | ||||
| &:after { | ||||
| position: absolute; | ||||
| content: "\00A0\25BE"; | ||||
| right: .6em; | ||||
| line-height: 1em; | ||||
| top: 0.9em; | ||||
| width: 1em; | ||||
| font-size: 1em; | ||||
| } | ||||
| } | ||||
| } | ||||
| .drop-menu { | ||||
| .drop-menu-base; | ||||
| width: auto !important; | ||||
| } | ||||
| .drop-menu-no-width { | ||||
| .drop-menu-base; | ||||
| width: auto; | ||||
| } | ||||
| .field-sm .drop-menu { | ||||
| padding: 1px 0 0 0; | ||||
| a { | ||||
| padding: 6px; | ||||
| }; | ||||
| } | ||||
| .select2-search input { | ||||
| width: auto !important; | ||||
| margin: .5em; | ||||
| padding: .5em; | ||||
| } | ||||
| .select2-no-results { | ||||
| padding: .5em; | ||||
| } | ||||
| .drop-menu-dropdown ul { | ||||
| width: auto; | ||||
| margin: 0; | ||||
| padding: 0; | ||||
| z-index: 50; | ||||
| li { | ||||
| margin: 0; | ||||
| line-height: 1em; | ||||
| list-style-type: none; | ||||
| &:before { content: none; } | ||||
| &:hover, | ||||
| &.select2-highlighted { | ||||
| background-color: @rclightblue; | ||||
| } | ||||
| &.select2-result-with-children { | ||||
| &:hover { | ||||
| background-color: white; | ||||
| } | ||||
| } | ||||
| .select2-result-label { | ||||
| display:block; | ||||
| padding: 8px; | ||||
| font-family: @text-regular; | ||||
| border-bottom: @border-thickness solid @rclightblue; | ||||
| color: @rcblue; | ||||
| cursor: pointer; | ||||
| } | ||||
| &.select2-result-with-children { | ||||
| .select2-result-label { | ||||
| font-family: @text-semibold; | ||||
| color: @rcdarkblue; | ||||
| cursor: default; | ||||
| } | ||||
| ul.select2-result-sub li .select2-result-label { | ||||
| padding-left: 16px; | ||||
| font-family: @text-regular; | ||||
| color: @rcblue; | ||||
| cursor: pointer; | ||||
| } | ||||
| } | ||||
| } | ||||
| } | ||||
| .side-by-side-selector { | ||||
| .left-group, | ||||
| .middle-group, | ||||
| .right-group { | ||||
| margin-bottom: @padding; | ||||
| } | ||||
| } | ||||
