adjusted login form sizes and fixed routing issues after login
This commit is contained in:
parent
d5eb77e2d6
commit
7b788408b9
5 changed files with 58 additions and 8 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
4
cmd/telesrv-admin/web/dist/index.html
vendored
4
cmd/telesrv-admin/web/dist/index.html
vendored
|
|
@ -23,8 +23,8 @@
|
|||
})();
|
||||
</script>
|
||||
|
||||
<script type="module" crossorigin src="/assets/index-BykqjzaA.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-DTG2dvom.css">
|
||||
<script type="module" crossorigin src="/assets/index-hP2uBwK-.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-BQqynmV9.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
|
|
|
|||
|
|
@ -37,7 +37,22 @@ export function App() {
|
|||
}
|
||||
|
||||
if (session === null) {
|
||||
return <LoginPage onLogin={setSession} />;
|
||||
return (
|
||||
<LoginPage
|
||||
onLogin={(next) => {
|
||||
// A stale/expired session can be caught on any deep link (a
|
||||
// bookmark, a page refresh mid-review), landing whoever it belongs
|
||||
// to on the login form without them having navigated there --
|
||||
// replaceState rather than a plain navigate() so signing back in
|
||||
// doesn't leave a "login" entry in browser history to land back on
|
||||
// via Back. Every login opens on the dashboard, not wherever the
|
||||
// expired session happened to be.
|
||||
window.history.replaceState(null, "", "/");
|
||||
setRoute(currentRoute());
|
||||
setSession(next);
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -352,13 +352,19 @@
|
|||
|
||||
.login-panel {
|
||||
display: grid;
|
||||
width: min(420px, 100%);
|
||||
gap: 18px;
|
||||
padding: 22px;
|
||||
width: min(480px, 100%);
|
||||
gap: 22px;
|
||||
padding: 30px;
|
||||
background: var(--panel);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: var(--shadow);
|
||||
/* The rest of the panel (chrome excluded) is scoped up from the admin
|
||||
panel's normal 13px/dense sizing -- everywhere else on this site is a
|
||||
data-table console meant to be scanned, but this screen is one form,
|
||||
seen once per session, at whatever size someone's monitor happens to
|
||||
be. */
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.login-head {
|
||||
|
|
@ -376,6 +382,25 @@
|
|||
gap: 8px;
|
||||
}
|
||||
|
||||
.login-head-actions .icon-btn {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.login-panel .brand-mark {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
}
|
||||
|
||||
.login-panel .brand strong {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.login-panel .brand small {
|
||||
margin-top: 4px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.login-chip {
|
||||
display: inline-flex;
|
||||
min-height: 24px;
|
||||
|
|
@ -402,6 +427,16 @@
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.login-panel .form-stack input {
|
||||
height: 46px;
|
||||
padding: 0 14px;
|
||||
}
|
||||
|
||||
.login-panel .btn {
|
||||
min-height: 44px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
/* Login form: username and password are two panels of equal width, slid
|
||||
horizontally by translateX on the track rather than shown/hidden, so
|
||||
moving between them reads as one continuous field instead of a page
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue