msb-public
/
tech-interview-handbook
mirror of https://github.com/yangshun/tech-interview-handbook
2
1
Code Issues Projects Releases Wiki Activity

[resume][refactor] tweak resume submission UI

Browse Source
pull/511/head
Yangshun Tay 2 years ago
parent 80fd274662
commit b161df0b70
3 changed files with 217 additions and 213 deletions
Show Stats Download Patch File Download Diff File

29
apps/portal/src/components/resumes/submit-form/ResumeSubmissionGuidelines.tsx
Unescape View File

@ -0,0 +1,29 @@
export default function ResumeSubmissionGuidelines() {
return (
<div className="rounded-lg border border-slate-200 bg-slate-50 p-5">
<div className="prose text-sm">
<h2 className="mt-0 text-xl font-medium">Submission Guidelines</h2>
<p>
Before submitting your resume for review, please review and
acknowledge our{' '}
<span className="font-medium">submission guidelines</span> stated
below.
</p>
<ul>
<li>
Ensure that you do not divulge any of your{' '}
<span className="font-medium">personal particulars</span>.
</li>
<li>
Ensure that you do not divulge any{' '}
<span className="font-medium">
company's proprietary and confidential information
</span>
.
</li>
<li>Proofread your resumes for grammatical/spelling errors.</li>
</ul>
</div>
</div>
);
}

29
apps/portal/src/components/resumes/submit-form/SubmissionGuidelines.tsx
Unescape View File

@ -1,29 +0,0 @@
export default function SubmissionGuidelines() {
return (
<div className="text-left text-sm text-slate-700">
<h2 className="mb-2 text-xl font-medium">Submission Guidelines</h2>
<p>
Before you submit, please review and acknowledge our
<span className="font-bold"> submission guidelines </span>
stated below.
</p>
<p>
<span className="text-lg font-bold">• </span>
Ensure that you do not divulge any of your{' '}
<span className="font-bold">personal particulars</span>.
</p>
<p>
<span className="text-lg font-bold">• </span>
Ensure that you do not divulge any{' '}
<span className="font-bold">
company's proprietary and confidential information
</span>
.
</p>
<p>
<span className="text-lg font-bold">• </span>
Proof-read your resumes to look for grammatical/spelling errors.
</p>
</div>
);
}

26
apps/portal/src/pages/resumes/submit.tsx
Unescape View File

@ -20,7 +20,8 @@ import {
} from '@tih/ui';
import { useGoogleAnalytics } from '~/components/global/GoogleAnalytics';
import SubmissionGuidelines from '~/components/resumes/submit-form/SubmissionGuidelines';
import ResumeSubmissionGuidelines from '~/components/resumes/submit-form/ResumeSubmissionGuidelines';
import Container from '~/components/shared/Container';
import loginPageHref from '~/components/shared/loginPageHref';
import { RESUME_STORAGE_KEY } from '~/constants/file-storage-keys';
@ -239,10 +240,10 @@ export default function SubmitResumeForm({
<Head>
<title>Upload a Resume</title>
</Head>
<Container variant="xs">
{status === 'loading' && (
<div className="w-full pt-4">
{' '}
<Spinner display="block" size="lg" />{' '}
<Spinner display="block" size="lg" />
</div>
)}
{status === 'authenticated' && (
@ -278,9 +279,9 @@ export default function SubmitResumeForm({
Note that your current input will not be saved!
</Dialog>
<form
className="mt-8 w-full max-w-screen-lg space-y-6 self-center rounded-lg bg-white p-10 shadow-lg"
className="w-full space-y-6 self-center bg-white p-10 md:my-8 md:rounded-lg md:shadow-lg"
onSubmit={handleSubmit(onSubmit)}>
<h1 className="mb-4 text-center text-2xl font-semibold">
<h1 className="mb-8 text-2xl font-bold text-slate-900 sm:text-center sm:text-4xl">
{isNewForm ? 'Upload a resume' : 'Update details'}
</h1>
{/* Title Section */}
@ -344,7 +345,7 @@ export default function SubmitResumeForm({
fileUploadError
? 'border-danger-600'
: 'border-slate-300',
'cursor-pointer flex-col items-center space-y-1 rounded-md border-2 border-dashed bg-slate-100 py-4 px-4 text-center',
'cursor-pointer flex-col items-center space-y-1 rounded-md border-2 border-dashed bg-slate-50 py-4 px-4 text-center',
)}>
<input
{...register('file', { required: true })}
@ -379,7 +380,9 @@ export default function SubmitResumeForm({
</p>
</div>
{fileUploadError && (
<p className="text-danger-600 text-sm">{fileUploadError}</p>
<p className="text-danger-600 text-sm">
{fileUploadError}
</p>
)}
</div>
)}
@ -394,8 +397,8 @@ export default function SubmitResumeForm({
/>
{/* Submission Guidelines */}
{isNewForm && (
<>
<SubmissionGuidelines />
<div className="space-y-4">
<ResumeSubmissionGuidelines />
<CheckboxInput
{...register('isChecked', { required: true })}
disabled={isLoading}
@ -404,7 +407,7 @@ export default function SubmitResumeForm({
? 'Please tick the checkbox after reading through the guidelines.'
: undefined
}
label="I have read and will follow the guidelines stated."
label="I have read and followed the above guidelines."
onChange={(val) => {
if (val) {
clearErrors('isChecked');
@ -412,7 +415,7 @@ export default function SubmitResumeForm({
setValue('isChecked', val);
}}
/>
</>
</div>
)}
{/* Clear and Submit Buttons */}
<div className="flex justify-end gap-4">
@ -436,6 +439,7 @@ export default function SubmitResumeForm({
</section>
</main>
)}
</Container>
</>
);
}

Write Preview
Loading…
Cancel
Save