111 lines
1.9 KiB
SCSS
111 lines
1.9 KiB
SCSS
.r6o-relation-editor {
|
|
position:absolute;
|
|
font-family:'Lato', sans-serif;
|
|
font-size:17px;
|
|
line-height:27px;
|
|
@include box-shadow(0, 1px, 14px, 0.4);
|
|
@include rounded-corners(3px);
|
|
transform:translate(-50%, -50%);
|
|
background-color:#fff;
|
|
|
|
svg {
|
|
vertical-align:middle;
|
|
shape-rendering: geometricPrecision;
|
|
}
|
|
|
|
* {
|
|
box-sizing:border-box;
|
|
}
|
|
|
|
.input-wrapper {
|
|
height:34px;
|
|
padding:0 6px;
|
|
margin-right:68px;
|
|
font-size:14px;
|
|
background-color:$blueish-white;
|
|
cursor:text;
|
|
@include rounded-corners-left(3px);
|
|
|
|
div[role=combobox] {
|
|
height:34px;
|
|
}
|
|
|
|
input {
|
|
outline:none;
|
|
border:none;
|
|
width:80px;
|
|
height:100%;
|
|
line-height:14px;
|
|
white-space:pre;
|
|
box-sizing:border-box;
|
|
background-color:transparent;
|
|
font-size:14px;
|
|
color:$standard-type;
|
|
}
|
|
|
|
ul {
|
|
position:relative;
|
|
left:-6px;
|
|
margin:0;
|
|
padding:0;
|
|
list-style-type:none;
|
|
background-color:#fff;
|
|
min-width:100%;
|
|
border-radius:3px;
|
|
border:1px solid #d6d7d9;
|
|
box-sizing:border-box;
|
|
box-shadow:0 0 20px rgba(0,0,0,0.25);
|
|
}
|
|
|
|
ul:empty {
|
|
display:none;
|
|
}
|
|
|
|
li {
|
|
box-sizing:border-box;
|
|
padding:2px 12px;
|
|
width:100%;
|
|
cursor:pointer;
|
|
}
|
|
|
|
}
|
|
|
|
.buttons {
|
|
position:absolute;
|
|
display:inline-flex;
|
|
top:0;
|
|
right:0;
|
|
|
|
span {
|
|
height:34px;
|
|
display:inline-block;
|
|
width:34px;
|
|
text-align:center;
|
|
font-size:14px;
|
|
cursor:pointer;
|
|
padding:1px 0;
|
|
}
|
|
|
|
.delete {
|
|
background-color:#fff;
|
|
color:$lightblue-type;
|
|
border-left:1px solid $lightgrey-border;
|
|
}
|
|
|
|
.delete:hover {
|
|
background-color:#f6f6f6;
|
|
}
|
|
|
|
.ok {
|
|
background-color:$ocean;
|
|
color:#fff;
|
|
@include rounded-corners-right(3px);
|
|
}
|
|
|
|
.ok:hover {
|
|
background-color:$ocean-hover;
|
|
}
|
|
|
|
}
|
|
|
|
} |