diff --git a/css/style.css b/css/style.css index c5dcb0d..f7614f8 100644 --- a/css/style.css +++ b/css/style.css @@ -377,6 +377,7 @@ button, .button-primary, .button-secondary, .menu-button, .logo { border-radius: var(--radius-xxl); text-decoration: none; transition: transform 0.2s ease; + cursor: pointer; } button, .button-primary, .logo { @@ -548,7 +549,6 @@ button:visited, .button-primary:visited, .logo:visited { color: var(--color-text-button-seconary-active); } - .menu-button:active, .desktop-nav a[aria-current="page"]:active, .mobile-menu a[aria-current="page"]:active { @@ -580,60 +580,25 @@ button:visited, .button-primary:visited, .logo:visited { .menu-toggle, .menu-close { - width: 44px; + /* width: 44px; height: 44px; border: 1px solid var(--border); border-radius: 0.75rem; background: #fff; color: inherit; - cursor: pointer; + cursor: pointer; */ } .menu-toggle { display: none; position: relative; -} - -.menu-toggle span { - position: absolute; - left: 50%; - width: 20px; - height: 2px; - background: currentColor; - border-radius: 999px; - transform-origin: center; transition: transform 0.25s ease, opacity 0.25s ease; } -.menu-toggle span:nth-child(1) { - top: 14px; - transform: translateX(-50%); -} - -.menu-toggle span:nth-child(2) { - top: 21px; - transform: translateX(-50%); -} - -.menu-toggle span:nth-child(3) { - top: 28px; - transform: translateX(-50%); -} - -.menu-toggle.is-open span:nth-child(1) { - top: 21px; - transform: translateX(-50%) rotate(45deg); -} - -.menu-toggle.is-open span:nth-child(2) { +.menu-toggle.is-open { opacity: 0; } -.menu-toggle.is-open span:nth-child(3) { - top: 21px; - transform: translateX(-50%) rotate(-45deg); -} - .menu-overlay { position: fixed; inset: 0; diff --git a/index.html b/index.html index 4743188..392eb25 100644 --- a/index.html +++ b/index.html @@ -71,9 +71,7 @@ aria-haspopup="true" aria-label="Open menu" > - - - + Menu