Imbus/FrostByte
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Slight restyle to better fit mobile screens

Browse source
This commit is contained in:
Imbus 2023-12-18 15:42:49 +01:00
parent 8edb1c77c2
commit ebfce0db65
1 changed files with 15 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
client-solid/src/Containers/LoginModal.tsx
View file

@ -19,7 +19,7 @@ export function LoginModal(): JSXElement {
return ( return (
<Show when={modal_ctx.isOpen()}> <Show when={modal_ctx.isOpen()}>
<dialog class="modal modal-open"> <dialog class="modal modal-open">
<div class="modal-box"> <div class="modal-box p-4 md:p-6">
<form method="dialog"> <form method="dialog">
<button <button
onClick={closeModal} onClick={closeModal}
@ -37,9 +37,9 @@ export function LoginModal(): JSXElement {
aria-label="Login" aria-label="Login"
checked checked
/> />
<div class="tab-content rounded-box border-base-300 bg-base-100 p-10"> <FormContainer>
<LoginForm /> <LoginForm />
</div> </FormContainer>
<input <input
type="radio" type="radio"
@ -47,10 +47,10 @@ export function LoginModal(): JSXElement {
class="tab" class="tab"
aria-label="Register" aria-label="Register"
/> />
<div class="tab-content rounded-box border-base-300 bg-base-100 p-10"> </div>
<FormContainer>
<RegisterForm /> <RegisterForm />
</div> </FormContainer>
</div>
</div> </div>
<form method="dialog" class="modal-backdrop"> <form method="dialog" class="modal-backdrop">
<button onClick={closeModal}>close</button> <button onClick={closeModal}>close</button>
@ -59,3 +59,12 @@ export function LoginModal(): JSXElement {
</Show> </Show>
); );
} }
// Local wrapper component for the login and register forms
function FormContainer({ children }: { children: JSXElement }): JSXElement {
return (
<div class="tab-content rounded-box border-base-300 bg-base-100 p-2 md:p-10">
<span class="label-text">{children}</span>
</div>
);
}