diff --git a/src/JobsMedical.Web/wwwroot/css/site.css b/src/JobsMedical.Web/wwwroot/css/site.css index 98a02f0..72a8630 100644 --- a/src/JobsMedical.Web/wwwroot/css/site.css +++ b/src/JobsMedical.Web/wwwroot/css/site.css @@ -82,7 +82,7 @@ a { color: inherit; text-decoration: none; } width: 42px; height: 42px; padding: 9px; border-radius: 10px; cursor: pointer; border: 1px solid var(--line); background: var(--surface); } -.nav-burger span { display: block; height: 2px; border-radius: 2px; background: var(--text); transition: transform .2s, opacity .2s; } +.nav-burger span { display: block; height: 2px; border-radius: 2px; background: var(--ink); transition: transform .2s, opacity .2s; } .nav-toggle:checked ~ .nav-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); } .nav-toggle:checked ~ .nav-burger span:nth-child(2) { opacity: 0; } .nav-toggle:checked ~ .nav-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } @@ -96,7 +96,7 @@ a { color: inherit; text-decoration: none; } .toast { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; background: var(--surface); border: 1px solid var(--line); border-inline-start: 4px solid var(--primary); - border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.16); color: var(--text); + border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.16); color: var(--ink); opacity: 0; transform: translateY(12px); transition: opacity .25s, transform .25s; } .toast.show { opacity: 1; transform: translateY(0); } @@ -243,7 +243,7 @@ label { font-size: 13px; } outline: 2px solid var(--accent); transition: all .2s ease; } .tour-bubble { - position: fixed; z-index: 1001; background: var(--surface); color: var(--text); + position: fixed; z-index: 1001; background: var(--surface); color: var(--ink); border-radius: 14px; box-shadow: 0 14px 40px rgba(0,0,0,.28); padding: 16px; max-width: 320px; } diff --git a/src/JobsMedical.Web/wwwroot/js/tour.js b/src/JobsMedical.Web/wwwroot/js/tour.js index 793a921..0b2fee2 100644 --- a/src/JobsMedical.Web/wwwroot/js/tour.js +++ b/src/JobsMedical.Web/wwwroot/js/tour.js @@ -23,8 +23,19 @@ function visible(el) { if (!el) return false; + // checkVisibility() correctly accounts for visibility:hidden / display:none on ANY + // ancestor — crucial here because the mobile nav is collapsed with visibility:hidden + // but its links still report a non-zero bounding box (they'd falsely pass otherwise). + if (typeof el.checkVisibility === 'function') { + if (!el.checkVisibility({ checkVisibilityCSS: true, opacityProperty: true })) return false; + } else { + for (var n = el; n && n.nodeType === 1; n = n.parentElement) { + var cs = getComputedStyle(n); + if (cs.display === 'none' || cs.visibility === 'hidden' || cs.visibility === 'collapse') return false; + } + } var r = el.getBoundingClientRect(); - return el.offsetParent !== null && r.width > 0 && r.height > 0; + return r.width > 1 && r.height > 1; } function build() {