diff --git a/public/index.md b/public/index.md index e13e00d..6acfed0 100644 --- a/public/index.md +++ b/public/index.md @@ -1123,6 +1123,47 @@ opacity: 0.6; } + .copy-actions button[data-tooltip]::before { + content: attr(data-tooltip); + position: absolute; + bottom: calc(100% + 8px); + left: 50%; + transform: translateX(-50%); + background: rgba(0, 0, 0, 0.85); + color: #fff; + padding: 4px 8px; + border-radius: 6px; + font-size: 12px; + white-space: nowrap; + opacity: 0; + pointer-events: none; + transition: opacity 0.2s ease, transform 0.2s ease; + z-index: 20; + } + + .copy-actions button[data-tooltip]::after { + content: ''; + position: absolute; + bottom: calc(100% + 2px); + left: 50%; + transform: translateX(-50%); + border-width: 6px 6px 0 6px; + border-style: solid; + border-color: rgba(0, 0, 0, 0.85) transparent transparent transparent; + opacity: 0; + transition: opacity 0.2s ease, transform 0.2s ease; + pointer-events: none; + z-index: 20; + } + + .copy-actions button[data-tooltip]:hover::before, + .copy-actions button[data-tooltip]:focus-visible::before, + .copy-actions button[data-tooltip]:hover::after, + .copy-actions button[data-tooltip]:focus-visible::after { + opacity: 1; + transform: translate(-50%, -2px); + } + .copy-actions button:hover { background: var(--panel-bg); box-shadow: none; @@ -1369,19 +1410,33 @@
- - - + + `; const copyActionsHTML = `
- - - + +