diff --git a/package.json b/package.json index 3758843..962cecd 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@poap-xyz/poap-family", - "version": "1.1.2", + "version": "1.1.3", "author": { "name": "POAP", "url": "https://poap.xyz" diff --git a/src/app/Admin.js b/src/app/Admin.js index 752d5d1..5e60300 100644 --- a/src/app/Admin.js +++ b/src/app/Admin.js @@ -1,5 +1,6 @@ -import { useContext } from 'react' +import { useContext, useEffect } from 'react' import { Outlet } from 'react-router-dom' +import { HTMLContext } from '../stores/html' import { AdminContext } from '../stores/admin' import CenterPage from '../components/CenterPage' import Card from '../components/Card' @@ -9,8 +10,16 @@ import Loading from '../components/Loading' import ButtonLink from '../components/ButtonLink' function Admin() { + const { setTitle } = useContext(HTMLContext) const { authenticate, authenticated, passphrase, error, loading, reset } = useContext(AdminContext) + useEffect( + () => { + setTitle('Enter Admin Passphrase') + }, + [setTitle] + ) + if (!passphrase) { return ( diff --git a/src/components/MenuItem.js b/src/components/MenuItem.js index 2c6b9df..bdc4514 100644 --- a/src/components/MenuItem.js +++ b/src/components/MenuItem.js @@ -8,9 +8,10 @@ function MenuItem({ title, href, to, - children, opened = false, - onClick = () => {}, + onClick, + children, + ...props }) { const navigate = useNavigate() const [open, setOpen] = useState(opened) @@ -20,9 +21,8 @@ function MenuItem({ if (children) { setOpen((o) => !o) } - onClick() - if (href) { - window.location.href = href + if (onClick) { + onClick() } if (to) { navigate(to) @@ -31,11 +31,19 @@ function MenuItem({ return (
- + ? {icon} + : {label}} + + ) : ( + + )} {children && (
{children} diff --git a/src/styles/menu-item.css b/src/styles/menu-item.css index daee634..072f52d 100644 --- a/src/styles/menu-item.css +++ b/src/styles/menu-item.css @@ -4,7 +4,8 @@ margin-top: .2rem; } -.menu-button { +.menu-button, .menu-link { + display: inline-block; appearance: none; outline: none; background-color: #eee; @@ -15,19 +16,24 @@ width: 2.1rem; height: 2.1rem; overflow: hidden; + font-size: 80%; } -.menu-button:hover { +.menu-button, .menu-link { + color: black; +} + +.menu-button:hover, .menu-link:hover { background-color: white; border-color: #5e58a5; } -.menu-item.active .menu-button { +.menu-item.active .menu-button, .menu-item.active .menu-link { color: white; background: linear-gradient(85deg, #5e58a5 30%, #968cff 100%); } -.menu-button-label { +.menu-button-label, .menu-link-label { font-weight: 700; font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace; }