diff --git a/index.html b/index.html index 3ae9b60..0215b12 100644 --- a/index.html +++ b/index.html @@ -17,7 +17,7 @@ C - Keys: c, Esc + Keys: C, Esc CE diff --git a/script.js b/script.js index a42f391..9e5eb3e 100644 --- a/script.js +++ b/script.js @@ -202,7 +202,7 @@ function handleKeys(e) { button = document.querySelector("#dec"); } else if (e.key === "Backspace" || e.key === "Delete") { button = document.querySelector(".entry"); - } else if (e.key === "c" || e.key === "Escape") { + } else if (e.key === "c" || e.key === "C" || e.key === "Escape") { button = document.querySelector(".all"); } else if (operators.hasOwnProperty(e.key)) { e.preventDefault(); diff --git a/style.css b/style.css index bf3d9ee..3a16350 100644 --- a/style.css +++ b/style.css @@ -5,7 +5,7 @@ body { flex-direction: column; height: 100vh; margin: 0; - background-color: rgb(9, 73, 9); + background-color: #094909; color: #eee; } @@ -74,8 +74,32 @@ button:active, .active { .tooltip .tooltiptext { visibility: hidden; position: absolute; + bottom: 115%; + right: -15%; z-index: 1; + + width: 120px; + font-size: 20px; + background: #094909; + color: #eee; + opacity: 0; + transition: opacity 0.7s; + padding: 5px; + border-radius: 5px; } + +/* Tooltip arrow */ +.tooltip .tooltiptext::after { + content: ""; + position: absolute; + top: 100%; + left: 50%; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: #094909 transparent transparent transparent; + } + .tooltip:hover .tooltiptext, .tooltip:focus .tooltiptext { visibility: visible; opacity: 1;