fix tooltips at the potential cost of breaking portlet scrolling

This commit is contained in:
Dennis Eichhorn 2020-06-17 19:51:22 +02:00
parent 00e5267e5a
commit 03c212f45e
3 changed files with 159 additions and 261 deletions

View File

@ -3,7 +3,7 @@
border-radius: 4px;
box-sizing: border-box;
margin-top: 1rem;
overflow-x: auto;
//overflow-x: auto; removed in order to prevent scroll bars for tooltips which are longer than the portlet (test in general settings view)
border-top: 3px solid var(--box-highlight);
.portlet-head {

File diff suppressed because it is too large Load Diff

View File

@ -1,35 +1,26 @@
.tooltip > i {
font-size: 0.85rem;
position: relative;
z-index: 2;
.tooltip {
cursor: pointer;
color: var(--box-highlight);
font-size: .9rem;
&:before,
&:after {
visibility: hidden;
opacity: 0;
pointer-events: none;
&:hover {
position: relative;
&:after, &:before {
font-size: .9rem;
display: block;
position: absolute;
white-space: nowrap;
bottom: 100%;
margin-bottom: 5px;
padding: 7px;
border-radius: 3px;
background-color: rgb(71, 71, 71);
color: #fff;
content: attr(data-tooltip);
text-align: center;
transform: translate(-50%, 0);
}
}
&:before {
white-space: nowrap;
position: absolute;
bottom: 150%;
margin-bottom: 5px;
padding: 7px;
border-radius: 3px;
background-color: #000;
background-color: hsla(0, 0%, 20%, 0.9);
color: #fff;
content: attr(data-tooltip);
text-align: center;
}
}
.tooltip:hover > i:before,
.tooltip:hover > i:after {
visibility: visible;
opacity: 1;
}