@atlassian/aui
Version:
Atlassian User Interface Framework
168 lines (165 loc) • 4.09 kB
CSS
/*!!
* @atlassian/aui - Atlassian User Interface Framework
* @version v8.0.0-alpha.1
* @link https://aui.atlassian.com
* @license SEE LICENSE IN LICENSE.md
* @author Atlassian Pty Ltd.
*/
.aui-popover {
box-shadow: 0 4px 8px -2px rgba(9, 30, 66, 0.25), 0 0 1px rgba(9, 30, 66, 0.31);
background: #FFFFFF;
border: 0 solid #DFE1E6;
border-radius: 3px;
color: #344563;
box-sizing: border-box;
max-width: 300px;
min-width: 160px;
padding: 3px 0;
position: absolute;
}
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
.aui-popover {
box-shadow: 0 4px 8px -2px rgba(9, 30, 66, 0.25), 0 0 1px rgba(9, 30, 66, 0.13), 1px 0 1px rgba(9, 30, 66, 0.13), -1px 0 1px rgba(9, 30, 66, 0.13), 0 -1px 1px rgba(9, 30, 66, 0.13);
}
}
.aui-popover [role="option"] {
color: inherit;
display: block;
padding: 3px 10px;
text-decoration: none;
}
.aui-popover [role="option"].aui-select-suggestion {
cursor: pointer;
}
.aui-popover img {
display: inline-block;
height: 16px;
position: relative;
padding-right: 6px;
top: 2px;
vertical-align: baseline;
width: 16px;
}
.aui-popover ul {
list-style: none;
margin: 0;
padding-left: 0;
}
.aui-popover ul [role="option"] {
box-sizing: content-box;
display: block;
line-height: 1.14285714;
padding: 7px 10px;
background-color: transparent;
color: #344563;
text-decoration: none;
cursor: pointer;
}
.aui-popover ul [role="option"]:not(.aui-select-no-suggestions):hover {
background-color: #EBECF0;
color: #344563;
}
.aui-popover ul [role="option"]:not(.aui-select-no-suggestions):active {
background-color: #DEEBFF;
color: #0052CC;
}
.aui-popover ul:not(:hover) [role="option"].aui-select-active {
background-color: #EBECF0;
color: #344563;
}
.aui-popover.aui-layer {
height: auto;
}
.aui-popover.aui-layer.aui-alignment-element-attached-top {
margin-top: 3px;
}
.aui-popover.aui-layer.aui-alignment-element-attached-bottom {
margin-bottom: 3px;
}
form.aui aui-select,
aui-select {
display: inline-block;
position: relative;
max-width: 250px;
width: 100%;
}
form.aui aui-select:not([resolved]),
aui-select:not([resolved]) {
display: inline-block;
height: 2.14285714em;
width: 100%;
max-width: 250px;
vertical-align: bottom;
}
form.aui aui-select aui-option:not([resolved]),
aui-select aui-option:not([resolved]) {
display: none;
}
form.aui aui-select input.aui-select-has-inline-image,
aui-select input.aui-select-has-inline-image {
background-position: 10px 6px;
background-repeat: no-repeat;
background-size: 16px;
padding-left: 31px;
}
form.aui aui-select select,
aui-select select,
form.aui aui-select datalist,
aui-select datalist {
display: none;
}
form.aui aui-select input.text,
aui-select input.text {
padding-right: 22px;
max-width: 100%;
}
form.aui aui-select button.aui-button,
aui-select button.aui-button {
background-clip: padding-box;
border-color: #C1C7D0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
bottom: 0;
box-sizing: border-box;
display: inline-block;
height: 2.14285714em;
right: 0;
margin: 0;
position: absolute;
top: 0;
vertical-align: top;
width: 22px;
}
form.aui aui-select button.aui-button:not(:hover),
aui-select button.aui-button:not(:hover) {
border-top-color: transparent;
border-right-color: transparent;
border-bottom-color: transparent;
}
form.aui aui-select button.aui-button:not([aria-busy])::before,
aui-select button.aui-button:not([aria-busy])::before {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0;
font-family: "Adgs Icons";
font-weight: normal;
font-style: normal;
speak: none;
content: "\F15B";
font-size: 16px;
height: 16px;
line-height: 1;
margin-top: -8px;
position: absolute;
right: 4px;
top: 50%;
text-indent: 0;
width: 16px;
right: 2px;
}
form.aui aui-select[data-aui-notification-error] .text {
border-color: #DE350B;
}
form.aui aui-select[data-aui-notification-success] .text {
border-color: #00875A;
}