User:Saag/common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary Tag: Manual revert |
No edit summary |
||
| Line 1: | Line 1: | ||
. | .popover-wrapper { | ||
position: relative; | position: relative; | ||
display: inline-block; | display: inline-block; | ||
} | } | ||
. | .popover-content { | ||
opacity: 0; | opacity: 0; | ||
visibility: hidden; | visibility: hidden; | ||
| Line 11: | Line 11: | ||
width: auto; | width: auto; | ||
} | } | ||
. | .popover-content:before { | ||
position: absolute; | position: absolute; | ||
z-index: -1; | z-index: -1; | ||
text-align:left; | text-align:left; | ||
right: calc(50% - 10px); | right: calc(50% - 10px); | ||
| Line 21: | Line 20: | ||
transition-property: transform; | transition-property: transform; | ||
} | } | ||
. | .popover-wrapper:hover + .popover-content { | ||
z-index: 10; | z-index: 10; | ||
opacity: 1; | opacity: 1; | ||
Revision as of 19:52, 6 September 2024
.popover-wrapper {
position: relative;
display: inline-block;
}
.popover-content {
opacity: 0;
visibility: hidden;
position: absolute;
left: 300px;
transform: translate(0, 10px);
width: auto;
}
.popover-content:before {
position: absolute;
z-index: -1;
text-align:left;
right: calc(50% - 10px);
top: -8px;
transition-duration: 0.3s;
transition-property: transform;
}
.popover-wrapper:hover + .popover-content {
z-index: 10;
opacity: 1;
visibility: visible;
transform: translate(0, -20px);
transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
}