From 3c1caca61d6a2f8a63b85712d49d309eac701b49 Mon Sep 17 00:00:00 2001 From: Arwin-j Date: Sun, 12 Oct 2025 21:40:15 -0400 Subject: [PATCH] Adding Feature Changes, Tooltip and Tool Information --- global.css | 30 +++++++++ index.html | 189 +++++++++++++++++++++++++++++++++++++++++++++++++---- 2 files changed, 207 insertions(+), 12 deletions(-) diff --git a/global.css b/global.css index a15dab0..9700dff 100644 --- a/global.css +++ b/global.css @@ -181,6 +181,10 @@ body { } #toolbar { + gap: 10px; + background: #222; + justify-content: center; + position: fixed; top: 50%; left: 0%; @@ -202,6 +206,32 @@ body { font-size: 24px; } +.item::after { + content: attr(data-tooltip); + position:relative; + bottom: 130%; + left: 50%; + transform: translateX(-50%); + background-color: #333; + color: #fff; + padding: 5px 10px; + border-radius: 5px; + white-space: nowrap; + opacity: 0; + pointer-events: none; + transition: opacity 0.3s; + font-size: 16px; + min-width: 90px; + text-align: center; +} + + + +.item:hover::after, +.item:hover::before { + opacity: 1; +} + #palette { position: fixed; top: 25%; diff --git a/index.html b/index.html index 9024dae..91dd219 100644 --- a/index.html +++ b/index.html @@ -32,6 +32,7 @@ + @@ -56,18 +57,150 @@

Select the Dimensions Of the grid

- - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

+

+
+ +