From 07282a5d7f355351337ea984662793c55ed5dfee Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Wed, 15 May 2024 00:35:49 +0200 Subject: card tooltips --- play.css | 31 +++++++++++++++++++++++++++++++ play.html | 2 ++ play.js | 21 ++++++++++++++++++++- 3 files changed, 53 insertions(+), 1 deletion(-) diff --git a/play.css b/play.css index 925a777..64c66b0 100644 --- a/play.css +++ b/play.css @@ -59,6 +59,29 @@ aside { gap: 15px; } +#tooltip { + display: none; + pointer-events: none; + position: fixed; + z-index: 600; + right: 240px; + top: 60px; +} + +#tooltip.show { + display: block; +} + +@media (max-width: 800px) { + #tooltip { + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + } +} + /* CARD ACTION POPUP MENU */ #popup { max-width: 250px; } @@ -258,6 +281,14 @@ aside { display: block; } +#tooltip.card { + background-position: center; + background-size: 377px 528px; + width: 372px; + height: 524px; + border-radius: 20px; +} + .shift .hand .card:hover, .shift .hand .card.selected { transform: scale(1.5) translate(0,-30px); z-index: 10; diff --git a/play.html b/play.html index 4767218..2e8a385 100644 --- a/play.html +++ b/play.html @@ -17,6 +17,8 @@ + +