Minor changed to UI

This commit is contained in:
Patrick Alvin Alcala 2025-09-30 09:51:19 +08:00
parent c6a1d33bad
commit c563c04d5c
2 changed files with 69 additions and 68 deletions

View file

@ -57,72 +57,73 @@ export default () => {
return (
<>
<Page alignment="column">
<Row content="split">
<Link to="/">
<Row content="left" gap={2}>
<Logo size={200} />
<h1>OCBO e-Sign</h1>
</Row>
</Link>
<Link to="/">
<Row content="right">
<IoChevronBack size={45} />
<span class="back-button-text">Back</span>
</Row>
</Link>
</Row>
<Padding top={2} left={0} right={0} bottom={0}>
<Row>
<Box curved thickness={2} padding={2} color="#2f465cd7" background="#04040642">
<Row>
<span
class="box-title"
onClick={() => {
console.log(name())
}}
>
Login
</span>
<Padding left={4.75} right={4.75} top={0} bottom={0}>
<Row content="split">
<Link to="/">
<Row content="left" gap={2}>
<Logo size={200} />
<h1>OCBO e-Sign</h1>
</Row>
</Link>
<Padding top={2} left={2} right={2} bottom={0}>
<Row>
<Radio data={roles} value={role()} onChange={setRole} gap={10} />
</Row>
</Padding>
<h4>Name</h4>
<Show when={role() !== 'Approver'}>
<Combobox options={assessors} placeholder="Select your name" value={name()} onChange={setName} />
</Show>
<Show when={role() === 'Approver'}>
<span class="approver-name">{APPROVERNAME}</span>
</Show>
<h4>Password</h4>
<Input value={password()} onChange={setPassword}></Input>
<Padding top={2} left={0} right={0} bottom={0}>
<Show when={password() && name()}>
<Row>
<Button edges="curved" design="bo-primary" label="Login" wide onClick={login}></Button>
</Row>
</Show>
<Show when={!password() && name()}>
<Row>
<span class="required">Required password</span>
</Row>
</Show>
<Show when={!password() && !name()}>
<Row>
<span class="required">Required name and password</span>
</Row>
</Show>
</Padding>
</Box>
<Link to="/">
<Row content="right">
<IoChevronBack size={45} />
<span class="back-button-text">Back</span>
</Row>
</Link>
</Row>
<Padding top={2} left={0} right={0} bottom={0}>
<Row>
<Box curved thickness={2} padding={2} color="#2f465cd7" background="#04040654">
<Row>
<span class="box-title">Login</span>
</Row>
<Padding top={2} left={2} right={2} bottom={0}>
<Row>
<Radio data={roles} value={role()} onChange={setRole} gap={10} />
</Row>
</Padding>
<h4>Name</h4>
<Show when={role() !== 'Approver'}>
<Combobox options={assessors} placeholder="Select your name" value={name()} onChange={setName} />
</Show>
<Show when={role() === 'Approver'}>
<span class="approver-name">{APPROVERNAME}</span>
</Show>
<h4>Password</h4>
<Input value={password()} onChange={setPassword}></Input>
<Padding top={2} left={0} right={0} bottom={0}>
<Show when={password() && name()}>
<Row>
<Button edges="curved" design="bo-primary" label="Login" wide onClick={login}></Button>
</Row>
</Show>
<Show when={!password() && name()}>
<Row>
<span class="required">Required password</span>
</Row>
</Show>
<Show when={!password() && !name()}>
<Row>
<span class="required">Required name and password</span>
</Row>
</Show>
<Show when={password() && !name()}>
<Row>
<span class="required">Required name</span>
</Row>
</Show>
</Padding>
</Box>
</Row>
</Padding>
</Padding>
</Page>

View file

@ -161,7 +161,7 @@ export default () => {
<Padding top={2} left={0} right={0} bottom={0}>
<Row>
<Box curved thickness={2} padding={2} color="#2f465cd7" background="#04040642">
<Box curved thickness={2} padding={2} color="#2f465cd7" background="#04040654">
<Row>
<span class="box-title">Registration</span>
</Row>
@ -202,19 +202,19 @@ export default () => {
<Show when={!file() && !password()}>
<Row>
<span class="already-registered">Need password and signature</span>
<span class="already-registered">Required password and signature</span>
</Row>
</Show>
<Show when={file() && !password()}>
<Row>
<span class="already-registered">Need password</span>
<span class="already-registered">Required password</span>
</Row>
</Show>
<Show when={!file() && password()}>
<Row>
<span class="already-registered">Need signature</span>
<span class="already-registered">Required signature</span>
</Row>
</Show>
</Padding>
@ -261,7 +261,7 @@ export default () => {
<Show when={!file()}>
<Row>
<span class="already-registered">Need signature</span>
<span class="already-registered">Required signature</span>
</Row>
</Show>
</Padding>