icingadb-web/public/css/widget/comment-popup.less
2022-02-10 11:15:52 +01:00

74 lines
1.2 KiB
Text

.comment-popup {
font-size: 1em / .857em; // // default font size / footer font size = 12px
height: 6em;
border-radius: 0.25em;
border: 1px solid;
border-color: @gray-light;
background-color: @body-bg-color;
}
.comment-wrapper {
position: relative;
.comment-popup {
position: absolute;
top: 2.5em;
left: -1.6em;
z-index: 1;
display: none;
width: 50em;
}
.comment-popup:before {
content: '';
position: absolute;
display: inline-block;
width: 1.5em;
height: 1.5em;
left: 1.5em;
top: ~"calc(-0.75em - 1px)";
border-left: 1px solid @gray-light;
border-top: 1px solid @gray-light;
background-color: @body-bg-color;
z-index: -1;
transform: rotate(45deg);
}
}
ul.item-list li:last-child .comment-wrapper {
.comment-popup {
top: -7em;
}
.comment-popup:before {
bottom: ~"calc(-0.75em - 1px)";
top: unset;
transform: rotate(225deg);
}
}
.comment-wrapper:hover .comment-popup {
display: block
}
#layout {
&.twocols {
.comment-popup {
width: 35em;
}
&.poor-layout,
&.compact-layout {
.comment-popup {
width: 25em;
}
}
}
&.poor-layout,
&.minimal-layout {
.comment-popup {
width: 25em;
}
}
}