Jingga/cssOMS
1
0
Fork 0
mirror of https://github.com/Karaka-Management/cssOMS.git synced 2026-02-08 14:28:40 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix tooltips at the potential cost of breaking portlet scrolling

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
portlet.scss
View File

@ -3,7 +3,7 @@
border-radius: 4px; border-radius: 4px;
box-sizing: border-box; box-sizing: border-box;
margin-top: 1rem; 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); border-top: 3px solid var(--box-highlight);
.portlet-head { .portlet-head {

365
styles.css
View File

File diff suppressed because it is too large Load Diff

53
tooltip.scss
View File

@ -1,35 +1,26 @@
.tooltip {
.tooltip > i {
font-size: 0.85rem;
position: relative;
z-index: 2;
cursor: pointer; cursor: pointer;
color: var(--box-highlight);
font-size: .9rem;
&:before, &:hover {
&:after { position: relative;
visibility: hidden;
opacity: 0; &:after, &:before {
pointer-events: none; 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;
} }