Template:Tooltip/styles.css: Difference between revisions

Content deleted Content added

Inline

Revision as of 14:50, 1 October 2025

/* {{pp-template}} */
.tooltip-dotted {
	border-bottom: 1px dotted;
	cursor: help;
}

@@ Line 1: / Line 1: @@
-/* Base target */
+/* {{pp-template}} */
-.tooltip {
-  position: relative;
-  cursor: help;
-}
-/* Dotted underline option (sanitizer-safe fallback) */
 .tooltip-dotted {
+	border-bottom: 1px dotted;
-  text-decoration: underline;
+	cursor: help;
-}
-/* Popup body */
-.tooltip .tooltip-body {
-  position: absolute;
-  left: 0;
-  top: 100%;
-  margin-top: 6px;
-  padding: 6px 8px;
-  background: #222;
-  color: #fff;
-  border-radius: 6px;
-  font-size: 0.875em;
-  line-height: 1.35;
-  max-width: 90vw; /* avoid off-screen on mobile */
-  box-shadow: 0 8px 24px rgba(0,0,0,.25);
-  z-index: 1000;
-  opacity: 0;
-  visibility: hidden;
-  transition: opacity .15s ease-in-out;
-  white-space: normal;
-}
-/* Arrow */
-.tooltip .tooltip-body::after {
-  content: "";
-  position: absolute;
-  top: -6px;
-  left: 12px;
-  border: 6px solid transparent;
-  border-bottom-color: #222;
-}
-/* Show states (split to avoid invalid selector list) */
-.tooltip:hover > .tooltip-body {
-  opacity: 1;
-  visibility: visible;
-}
-.tooltip:focus > .tooltip-body {
-  opacity: 1;
-  visibility: visible;
-}
-.tooltip.tooltip--open > .tooltip-body {
-  opacity: 1;
-  visibility: visible;
-}
-/* Optional flips (set via JS) */
-.tooltip.tooltip--align-right > .tooltip-body {
-  left: auto;
-  right: 0;
-}
-.tooltip.tooltip--align-right > .tooltip-body::after {
-  left: auto;
-  right: 12px;
-}
-.tooltip.tooltip--above > .tooltip-body {
-  top: auto;
-  bottom: 100%;
-  margin-top: 0;
-  margin-bottom: 6px;
-}
-.tooltip.tooltip--above > .tooltip-body::after {
-  top: auto;
-  bottom: -6px;
-  border-bottom-color: transparent;
-  border-top-color: #222;
 }