2018-11-19 16:57:35 +02:00
|
|
|
<nb-card class="col-md-12 col-lg-12 col-xxxl-12">
|
|
|
|
|
<nb-card-body>
|
|
|
|
|
<nb-stepper orientation="horizontal">
|
|
|
|
|
<nb-step [label]="labelOne">
|
2024-03-20 22:31:55 -07:00
|
|
|
<ng-template #labelOne>Personal details</ng-template>
|
|
|
|
|
|
|
|
|
|
<!-- Start of form -->
|
|
|
|
|
<nb-card>
|
|
|
|
|
<nb-card-header> <h3>Personal Details</h3></nb-card-header>
|
|
|
|
|
<nb-card-body>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="fullName"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Full Name</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="fullName"
|
|
|
|
|
placeholder="Full name"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label for="email" class="text-muted font-weight-bold small"
|
|
|
|
|
>Email Address</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="email"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="email"
|
|
|
|
|
placeholder="Email address"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label for="phone" class="text-muted font-weight-bold small"
|
|
|
|
|
>Phone Number</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="tel"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="phone"
|
|
|
|
|
placeholder="Phone number"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="linkedin"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>LinkedIn URL</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="url"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="linkedin"
|
|
|
|
|
placeholder="LinkedIn URL"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="website"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Personal Website or Relevant Link</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="url"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="website"
|
|
|
|
|
placeholder="Website link"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="country"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Country</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="country"
|
|
|
|
|
placeholder="Country"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</nb-card-body>
|
|
|
|
|
</nb-card>
|
|
|
|
|
|
|
|
|
|
<!-- end of form -->
|
2018-11-19 16:57:35 +02:00
|
|
|
<button nbButton disabled nbStepperNext>prev</button>
|
|
|
|
|
<button nbButton nbStepperNext>next</button>
|
|
|
|
|
</nb-step>
|
2024-03-20 22:31:55 -07:00
|
|
|
|
|
|
|
|
<nb-step label="Experience">
|
|
|
|
|
<!-- Start of form -->
|
|
|
|
|
<nb-card>
|
|
|
|
|
<nb-card-header><h3>Experience</h3></nb-card-header>
|
|
|
|
|
<nb-card-body>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label for="role" class="text-muted font-weight-bold small"
|
|
|
|
|
>What was your role at the company?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="role"
|
|
|
|
|
placeholder="Your role at the company"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="company"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>For which company did you work?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="company"
|
|
|
|
|
placeholder="Company name"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="duration"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>How long were you with the company?</label
|
|
|
|
|
>
|
|
|
|
|
<div class="input-group">
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="duration"
|
|
|
|
|
placeholder="Start date"
|
|
|
|
|
/>
|
|
|
|
|
<div class="input-group-prepend">
|
|
|
|
|
<span class="input-group-text">-</span>
|
|
|
|
|
</div>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
placeholder="End date"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="location"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Where was the company located?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="location"
|
|
|
|
|
placeholder="Company location"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="responsibilities"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>What did you do at the company?</label
|
|
|
|
|
>
|
|
|
|
|
<textarea
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="responsibilities"
|
|
|
|
|
rows="5"
|
|
|
|
|
placeholder="Enter your responsibilities"
|
|
|
|
|
></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</nb-card-body>
|
|
|
|
|
</nb-card>
|
|
|
|
|
<!-- end of form -->
|
|
|
|
|
|
2018-11-19 16:57:35 +02:00
|
|
|
<button nbButton nbStepperPrevious>prev</button>
|
|
|
|
|
<button nbButton nbStepperNext>next</button>
|
|
|
|
|
</nb-step>
|
2024-03-20 22:31:55 -07:00
|
|
|
<nb-step label="Project">
|
|
|
|
|
|
|
|
|
|
<!-- Start of form -->
|
|
|
|
|
<nb-card>
|
|
|
|
|
<nb-card-header><h3>Project</h3></nb-card-header>
|
|
|
|
|
<nb-card-body>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="projectTitle"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Give your project a title</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="projectTitle"
|
|
|
|
|
placeholder="Project title"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="organization"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>In which organization did you do your project?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="organization"
|
|
|
|
|
placeholder="Organization name"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="projectDuration"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>When did you do your project?</label
|
|
|
|
|
>
|
|
|
|
|
<div class="input-group">
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="projectDuration"
|
|
|
|
|
placeholder="Start date"
|
|
|
|
|
/>
|
|
|
|
|
<div class="input-group-prepend">
|
|
|
|
|
<span class="input-group-text">-</span>
|
|
|
|
|
</div>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
placeholder="End date"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="projectURL"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Project URL</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="url"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="projectURL"
|
|
|
|
|
placeholder="Project URL"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="projectDescription"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Now describe what you did</label
|
|
|
|
|
>
|
|
|
|
|
<textarea
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="projectDescription"
|
|
|
|
|
rows="5"
|
|
|
|
|
placeholder="Describe your project"
|
|
|
|
|
></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</nb-card-body>
|
|
|
|
|
</nb-card>
|
|
|
|
|
<!-- end of form -->
|
|
|
|
|
|
|
|
|
|
<button nbButton nbStepperPrevious>prev</button>
|
|
|
|
|
<button nbButton nbStepperNext>next</button>
|
|
|
|
|
</nb-step>
|
|
|
|
|
<nb-step label="Education">
|
|
|
|
|
|
|
|
|
|
<!-- Start of form -->
|
|
|
|
|
<nb-card>
|
|
|
|
|
<nb-card-header><h3>Education</h3></nb-card-header>
|
|
|
|
|
<nb-card-body>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="degree"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>What is your degree or other qualification and
|
|
|
|
|
major?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="degree"
|
|
|
|
|
placeholder="Your degree and major"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="institution"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Where did you earn your degree/qualification?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="institution"
|
|
|
|
|
placeholder="Institution name"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="institutionLocation"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Where is the institution located?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="institutionLocation"
|
|
|
|
|
placeholder="Institution location"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="graduationYear"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>When did you earn your degree/qualification?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="graduationYear"
|
|
|
|
|
placeholder="Graduation year"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label for="minor" class="text-muted font-weight-bold small"
|
|
|
|
|
>Did you minor in anything?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="minor"
|
|
|
|
|
placeholder="Minor subject"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label for="gpa" class="text-muted font-weight-bold small"
|
|
|
|
|
>GPA (if applicable)</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="gpa"
|
|
|
|
|
placeholder="Your GPA"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="additionalInfo"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Open field for additional information</label
|
|
|
|
|
>
|
|
|
|
|
<textarea
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="additionalInfo"
|
|
|
|
|
rows="5"
|
|
|
|
|
placeholder="Additional information"
|
|
|
|
|
></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</nb-card-body>
|
|
|
|
|
</nb-card>
|
|
|
|
|
<!-- end of form -->
|
|
|
|
|
|
|
|
|
|
<button nbButton nbStepperPrevious>prev</button>
|
|
|
|
|
<button nbButton nbStepperNext>next</button>
|
|
|
|
|
</nb-step>
|
|
|
|
|
<nb-step label="Certifications">
|
|
|
|
|
|
|
|
|
|
<!-- Start of form -->
|
|
|
|
|
<nb-card>
|
|
|
|
|
<nb-card-header> <h3>Certifications</h3></nb-card-header>
|
|
|
|
|
<nb-card-body>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="certificateName"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>What was the certificate name?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="certificateName"
|
|
|
|
|
placeholder="Certificate name"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="certificateIssuer"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Where did you get the certificate?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="certificateIssuer"
|
|
|
|
|
placeholder="Certificate issuer"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="certificateYear"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>When did you get the certificate?</label
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="text"
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="certificateYear"
|
|
|
|
|
placeholder="Certificate year"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="certificateRelevance"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>How is the certificate relevant?</label
|
|
|
|
|
>
|
|
|
|
|
<textarea
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="certificateRelevance"
|
|
|
|
|
rows="5"
|
|
|
|
|
placeholder="Certificate relevance"
|
|
|
|
|
></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</nb-card-body>
|
|
|
|
|
</nb-card>
|
|
|
|
|
<!-- end of form -->
|
|
|
|
|
|
|
|
|
|
<button nbButton nbStepperPrevious>prev</button>
|
|
|
|
|
<button nbButton nbStepperNext>next</button>
|
|
|
|
|
</nb-step>
|
|
|
|
|
<nb-step label="Skills">
|
|
|
|
|
|
|
|
|
|
<!-- Start of form -->
|
|
|
|
|
<nb-card>
|
|
|
|
|
<nb-card-header><h3>Skills</h3></nb-card-header>
|
|
|
|
|
<nb-card-body>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="skills"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Enter the skills you possess</label
|
|
|
|
|
>
|
|
|
|
|
<textarea
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="skills"
|
|
|
|
|
rows="5"
|
|
|
|
|
placeholder="Enter your skills"
|
|
|
|
|
></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</nb-card-body>
|
|
|
|
|
</nb-card>
|
|
|
|
|
<!-- end of form -->
|
|
|
|
|
|
2018-11-19 16:57:35 +02:00
|
|
|
<button nbButton nbStepperPrevious>prev</button>
|
|
|
|
|
<button nbButton nbStepperNext>next</button>
|
|
|
|
|
</nb-step>
|
|
|
|
|
<nb-step [label]="labelFour">
|
2024-03-20 22:31:55 -07:00
|
|
|
<ng-template #labelFour>Summary</ng-template>
|
|
|
|
|
|
|
|
|
|
<!-- Start of form -->
|
|
|
|
|
<nb-card>
|
|
|
|
|
<nb-card-header><h3>Summary</h3></nb-card-header>
|
|
|
|
|
<nb-card-body>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-6">
|
|
|
|
|
|
|
|
|
|
<div class="form-group text-left">
|
|
|
|
|
<label
|
|
|
|
|
for="professionalSummary"
|
|
|
|
|
class="text-muted font-weight-bold small"
|
|
|
|
|
>Write a professional summary</label
|
|
|
|
|
>
|
|
|
|
|
<textarea
|
|
|
|
|
class="form-control bg-light"
|
|
|
|
|
id="professionalSummary"
|
|
|
|
|
rows="5"
|
|
|
|
|
placeholder="Write your professional summary"
|
|
|
|
|
></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</nb-card-body>
|
|
|
|
|
</nb-card>
|
|
|
|
|
<!-- end of form -->
|
|
|
|
|
|
2018-11-19 16:57:35 +02:00
|
|
|
<button nbButton nbStepperPrevious>prev</button>
|
|
|
|
|
<button nbButton disabled nbStepperNext>next</button>
|
|
|
|
|
</nb-step>
|
|
|
|
|
</nb-stepper>
|
|
|
|
|
</nb-card-body>
|
|
|
|
|
</nb-card>
|
|
|
|
|
|
