Skip to content

Commit

Permalink
Merge branch 'feature/input-page'
Browse files Browse the repository at this point in the history
  • Loading branch information
@thaiminhpv
thaiminhpv committed Mar 28, 2022
2 parents 38149dd + 429281c commit dfb2c62
Show file tree
Hide file tree
Showing 2 changed files with 106 additions and 23 deletions.
21 changes: 21 additions & 0 deletions front-end/css/input-page.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ body {
display: flex;
padding: 0 20px 0 20px;
border-radius: 4px;
position: relative;
}

#avt {
Expand All @@ -30,3 +31,23 @@ body {
display: block;
margin: auto;
}

/* Work experience */
h4 {
color: green;
font-weight: 700;
}

#position {
font-weight: bold;
}

#workplace {
font-weight: bolder;
}

#buttonSave {
position: absolute;
right: 35px;
bottom: 2%;
}
108 changes: 85 additions & 23 deletions front-end/input-page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,47 +11,42 @@
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://kit.fontawesome.com/81e4fcabce.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="css/input-page.css">
<link rel="stylesheet" href="./css/input-page.css">
</head>

<body>
<form novalidate id="border_form" class="row">
<div novalidate id="left" class="col-md-5 mt-5">
<form novalidate id="border_form" class="row mb-5">
<div novalidate id="left" class="col-md-5 mt-5 ">

<img class="mb-4" src="img/place-holder-ava.jpg" id="avt">
<!-- <div class=" custom-file">
<input type="file" class="custom-file-input " accept=".jpg, .png" id="customeFile">
<label for="customFile" class="custom-file-label">Upload your photo</label>
</div> -->

<div class="row">
<div class="col-md-6 mb-2">
<label for="FirstName">First Name</label>
<input type="text" id="FirstName" class="form-control" placeholder="First Name">
</div>
<div class="col-md-6 mb-2">
<label for="LastName">Last Name</label>
<input type="text" id="LastName" class="form-control" placeholder="Last Name">
</div>
<div class=" mb-2">
<label for="fullName">Full Name</label>
<input type="text" id="fullName" class="form-control" placeholder="Nguyen Van A">
</div>

<div class="mb-2">
<label for="Email">Email</label>
<input type="email" id="Email" class="form-control" placeholder="Email">
<input type="email" id="Email" class="form-control" placeholder="[email protected]">
</div>
<div class="mb-2">
<label for="Phone">Phone</label>
<input type="Number" id="Phone" class="form-control" placeholder="Phone">
<input type="Number" id="Phone" class="form-control" placeholder="033764527">
</div>
<div class="mb-2">
<label for="Address">Address</label>
<input type="text" id="Address" class="form-control" placeholder="Address">
<input type="text" id="Address" class="form-control" placeholder="Hanoi, Vietnam">
</div>
</div>

<div id="right" class="col-md-7 mt-5">
<div class="mb-2">
<label for="Nation">Nation</label>
<input type="text" id="Nation" class="form-control" placeholder="Nation">
<input type="text" id="Nation" class="form-control" placeholder="Viet Nam">
</div>
<div class="mb-2">
<label for="Sologan">Slogan</label>
Expand Down Expand Up @@ -84,32 +79,99 @@
</div>
<div class="row">
<div class="col-md-6 mb-2">
<label for=Twitter">Twitter</label>
<input type="text" id=Twitter" class="form-control" placeholder="Twitter">
<label for="Twitter">Twitter</label>
<input type="text" id="Twitter" class="form-control" placeholder="https://twitter.com/abc">
</div>
<div class="col-md-6 mb-2">
<label for="Linked in">Linked in</label>
<input type="text" id="Linked in" class="form-control" placeholder="Linked in">
<input type="text" id="Linked in" class="form-control" placeholder="https://linkedin.com/abc">
</div>
</div>
<div class="row">
<div class="col-md-6 mb-2">
<label for="Facebook">Facebook</label>
<input type="text" id="Facebook" class="form-control" placeholder="Facebook">
<input type="text" id="Facebook" class="form-control" placeholder="https://facebook.com/abc">
</div>
<div class="col-md-6 mb-2">
<label for="Github">Github</label>
<input type="text" id="Github" class="form-control" placeholder="Github">
<input type="text" id="Github" class="form-control" placeholder="https://github.com/abc">
</div>
</div>
</div>

<div class="col-md-5">
<div class="row">
<div class="col-md-6">
<h4>Work experience</h4>
<div class="form-row">
<div class="col-md-4">
<input type="text" class="form-control form-control-sm" placeholder="June 2014">
</div>
<p> - </p>
<div class="col-md-4">
<input type="text" class="form-control form-control-sm" placeholder="Present">
</div>
</div>
<input class="form-control form-control-sm mb-2" id="position" type="text"
placeholder="Sales Staff">
<input class="form-control form-control-sm mb-2" id="workplace" type="text" placeholder="TOPCV JSC">
<textarea class="form-control form-control-sm mb-2" name="" id="" cols="30" rows="5"></textarea>
</div>

<div class="col-md-6">
<div>
<button type="button" class="btn btn-outline-success btn-sm mt-5 mr-3" id=""><i
class="fa-solid fa-arrow-down"></i></button>
<button type="button" class="btn btn-outline-success btn-sm mt-5" id=""><i
class="fa-solid fa-arrow-up"></i></button>
</div>
<div>
<button type="button" class="btn btn-outline-success btn-sm mt-3" id="">+ Add</button>
<button type="button" class="btn btn-outline-danger btn-sm mt-3" id="">-
Delete</button>
</div>
</div>
</div>
</div>

<div class="col-md-7 row">
<div class="col-md-6">
<h4 style="color: dodgerblue;">Activities</h4>
<div class="form-row">
<div class="col-4">
<input type="text" class="form-control form-control-sm" placeholder="June 2014">
</div>
<p> - </p>
<div class="col-4">
<input type="text" class="form-control form-control-sm" placeholder="Present">
</div>
</div>
<input class="form-control form-control-sm mb-2" id="position" type="text" placeholder="Sales Staff">
<input class="form-control form-control-sm mb-2" id="workplace" type="text" placeholder="TOPCV JSC">
<textarea class="form-control form-control-sm mb-2" name="" id="" cols="30" rows="5"></textarea>
</div>

<div class="col-md-6">
<div class="">
<button type="button" class="btn btn-outline-success btn-sm mt-5 mr-3" id=""><i
class="fa-solid fa-arrow-down"></i></button>
<button type="button" class="btn btn-outline-success btn-sm mt-5" id=""><i
class="fa-solid fa-arrow-up"></i></button>
</div>
<div class="">
<button type="button" class="btn btn-outline-success btn-sm mt-3" id="">+ Add</button>
<button type="button" class="btn btn-outline-danger btn-sm mt-3" id="">- Delete</button>
</div>
</div>
<button type="button" class="btn btn-primary btn-lg mt-5" id="buttonSave">Submit</button>
</div>

<button type="button" class="btn btn-primary btn-lg" id="buttonSave">Submit</button>
</form>



<script src="js/input-page.js"></script>

</body>

</html>
</html>

1 comment on commit dfb2c62

@vercel
Copy link

@vercel vercel bot commented on dfb2c62 Mar 28, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

Please sign in to comment.