Template:Tt: Difference between revisions
hanging class names to avoid issues with identical, already-existing classes |
Tag: Undo |
||
| (10 intermediate revisions by 3 users not shown) | |||
| Line 21: | Line 21: | ||
justify-content: center; | justify-content: center; | ||
opacity: 0; | opacity: 0; | ||
z-index: 999; | |||
pointer-events: none; | pointer-events: none; | ||
user-select: none; | user-select: none; | ||
| Line 30: | Line 31: | ||
/* Container appear above target */ | /* Container appear above target */ | ||
.tt-container-above { | .tt-container-above { | ||
bottom: | bottom: calc(100% - 2px); | ||
transform: translate(-50%, 3px); | transform: translate(-50%, 3px); | ||
} | } | ||
| Line 36: | Line 37: | ||
/* Container appear below target */ | /* Container appear below target */ | ||
.tt-container-below { | .tt-container-below { | ||
top: | top: calc(100% - 2px); | ||
transform: translate(-50%, -3px); | transform: translate(-50%, -3px); | ||
} | } | ||
| Line 48: | Line 49: | ||
filter: drop-shadow(0 1px 4px rgba(0,0,0,0.6)); | filter: drop-shadow(0 1px 4px rgba(0,0,0,0.6)); | ||
padding: 6px 9px; | padding: 6px 9px; | ||
text-align: center; | text-align: center; | ||
overflow-wrap: anywhere; | |||
} | } | ||
| Line 70: | Line 68: | ||
/* When tooltip is above */ | /* When tooltip is above */ | ||
.tt-container-above .tt-chevron { | .tt-container-above .tt-chevron { | ||
top: | top: calc(100% - 3px); | ||
border-width: 9px 9px 0 9px; | border-width: 9px 9px 0 9px; | ||
border-color: #fff transparent transparent transparent; | border-color: #fff transparent transparent transparent; | ||
| Line 77: | Line 75: | ||
/* When tooltip is below */ | /* When tooltip is below */ | ||
.tt-container-below .tt-chevron { | .tt-container-below .tt-chevron { | ||
bottom: | bottom: calc(100% - 2px); | ||
border-width: 0 9px 9px 9px; | border-width: 0 9px 9px 9px; | ||
border-color: transparent transparent #fff transparent; | border-color: transparent transparent #fff transparent; | ||
