1
0
mirror of https://github.com/hrfee/jfa-go.git synced 2024-11-09 20:00:12 +00:00
jfa-go/css/tooltip.css
Harvey Tindall 1b41621569
implement invites as a class, use tooltip for email send status
the DOMInvite class represents an invite on the dom, and modifying its
attributes applies the changes on the web page. Email send status
message is now on the right of the invite and represented by an icon.
Hovering reveals the "Sent to"/"Failed to send to" message.
2020-12-30 15:32:44 +00:00

37 lines
563 B
CSS

.tooltip {
position: relative;
display: inline-block;
}
.tooltip .content {
visibility: hidden;
max-width: 10rem;
min-width: 6rem;
background-color: rgba(0, 0, 0, 0.6);
color: #fff;
padding: 0.5rem;
border-radius: 6px;
overflow-wrap: break-word;
text-align: center;
position: absolute;
z-index: 1;
top: -1rem;
}
.tooltip.right .content {
left: 120%;
}
.tooltip.left .content {
right: 120%;
}
.tooltip .content.sm {
font-size: 0.8rem;
}
.tooltip:hover .content {
visibility: visible;
}