Mailspring/internal_packages/tooltip/stylesheets/tooltip.less
Evan Morikawa 033008e036 feat(tooltip): add informational tooltip component
Summary: Add tooltip. To use just add a data-tooltip="plain string"

Test Plan: edgehill --test

Reviewers: bengotow

Reviewed By: bengotow

Differential Revision: https://review.inboxapp.com/D1288
2015-03-12 18:09:10 -04:00

36 lines
677 B
Plaintext

#tooltip-container {
position: absolute;
z-index: 999;
top: 0;
left: 0;
}
.tooltip-wrap {
position: absolute;
display: none;
// Position and display are set by React
background: @black;
border-radius: @border-radius-base;
color: @text-color-inverse;
font-weight: @font-weight-medium;
box-shadow: 0 0 8px rgba(0,0,0,0.4);
text-align: center;
text-transform: capitalize;
.tooltip-content {
padding: 0.5em;
}
.tooltip-pointer {
position: absolute;
width: 0;
height: 0;
top: -13px;
left: 50%;
margin-left: -6px;
border: 7px solid transparent;
border-bottom-color: @black;
border-bottom-width: 6px;
}
}