site

personal website, served at mordaunt.dev/site
Log | Files | Refs

commit 820f526627a94e74011ab97ac48ff841fe15f804
parent 277715a8ae9ba7b2fb485ef3c73aed125eac3e15
Author: Jack Mordaunt <jackmordaunt.dev@gmail.com>
Date:   Wed, 16 Jul 2025 15:52:24 -0300

assets/css/custom.css: add a basic tooltip style

Not perfect, but it'll do.

Diffstat:
Massets/css/custom.css | 32++++++++++++++++++++++++++++++++
1 file changed, 32 insertions(+), 0 deletions(-)

diff --git a/assets/css/custom.css b/assets/css/custom.css @@ -200,4 +200,36 @@ background-color: #333; color: #fff; } + +.tooltip { + position: relative; + display: inline-block; + border-bottom: 1px dotted black; +} + +.tooltip .tooltiptext { + visibility: hidden; + opacity: 0; + position: absolute; + z-index: 1000; + bottom: 125%; + left: 50%; + transform: translateX(-50%); + background-color: #333; + color: #fff; + padding: 6px 10px; + border-radius: 4px; + text-align: center; + white-space: normal; + width: max-content; + max-width: 90vw; + box-shadow: 0 2px 8px rgba(0,0,0,0.3); + transition: opacity 0.2s ease-in-out; + word-wrap: break-word; + overflow-wrap: break-word; +} + +.tooltip:hover .tooltiptext { + visibility: visible; + opacity: 1; }