Kuis PWEB A - Form Registrasi
Baca Juga
Nama : Abd. Wahid
NRP : 5025201039
Kelask : PWEB A (2022)
Repository : Repository
Website : Website
Source Code :
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<link rel="stylesheet" href="style/style.css"> | |
<title>Quiz 1</title> | |
</head> | |
<body> | |
<main class="container"> | |
<div class="form"> | |
<h1 class="form-title">Formulir Registrasi</h1> | |
<h2 class="form-subheader"><b>PESERTA</b></h2> | |
<div class="form-container"> | |
<form action=""> | |
<div class="row input-row"> | |
<p class="label">Nama Lengkap & Gelar</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">Asal Instansi / Kota</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">Alamat</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">Kode Pos</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">Provinsi</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">Telpon / Handphone</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">Email</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">Sponsor</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">- Nama Perusahaan</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">- Alamat Perusahaan</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">- Nama Kontak Personal</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">- Telp. Personal</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row input-row"> | |
<p class="label">- Email Perusahaan</p> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<div class="row-bottom input-row-bottom"> | |
<p class="label">Kontribusi peserta Rp. 2.500.000, -(Dua Juta Lima Ratus Ribu Rupiah) belum termasuk penginapan dan akomodasi</p> | |
<br> | |
<p class="colon">:</p> | |
<input class="input" type="text"> | |
</div> | |
<p> | |
Konformasi Kepesertaan : | |
<br> | |
* Sebelum 15 Januari | |
</p> | |
<div class="row-bottom input-row-bottom"> | |
<p class="label">Konfirmasi Kepesertaan</p> | |
<p class="colon">:</p> | |
<input class="input-bottom" type="text"> | |
</div> | |
<div class="col"> | |
<p> | |
Konfirmasi Kepesertaan: | |
<ul> | |
<li> Sebelum 15 Januari 2012 : Rp.2.500.000,-</li> | |
<li> Sesudah 15 Januari 2012 : Rp.2.750.000,-</li> | |
<li> On Site : Rp.3.000.000,-</li> | |
</ul> | |
</p> | |
</div> | |
<div class="col"> | |
<p> | |
Pembatalan pendaftaran : | |
<br> | |
* sebelum H-5 uang dikembalikan 50% | |
<br> | |
* sesudah H-5 uang tidak dikembalikan | |
</p> | |
</div> | |
<p> | |
Akomodasi Penginapan peserta,harga kamar kelas standar berkisar antara Rp. 250.000 - Rp. 300.000 | |
</p> | |
<p> | |
Pendaftaran via transfer Bank ke : | |
</p> | |
<p> | |
Nama Bank : Bank BCA KCU Cirebon | |
</p> | |
<p> | |
No Rekening : 1341015478 | |
</p> | |
<p> | |
Atas Nama : Junaedi S.Kep | |
</p> | |
</form> | |
</div> | |
</div> | |
</main> | |
<script src="js/script.js"></script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.container { | |
padding: 10px 10px; | |
display: flex; | |
justify-content: space-between; | |
align-items: space-between; | |
flex-direction: column; | |
} | |
.form { | |
width: 70%; | |
border: 5px solid gray; | |
border-radius: 26px; | |
display: flex; | |
justify-content: center; | |
align-items: center ; | |
margin: auto; | |
flex-direction: column; | |
} | |
.form-subheader { | |
text-align: start; | |
} | |
.form-container { | |
width: 100%; | |
margin-top: 20px; | |
padding: 20px 20px; | |
box-sizing: border-box; | |
} | |
.row { | |
width: 100%; | |
display: grid; | |
grid-template-columns: 1fr 1fr 30px 1fr 1fr 1fr 1fr 1fr; | |
grid-template-areas: "label label colon input input input input input"; | |
column-gap: 10px; | |
} | |
.row-input { | |
width: 100%; | |
display: flex; | |
padding-top: 20px; | |
} | |
.row-bottom { | |
width: 100%; | |
display: grid; | |
grid-template-columns: 1fr 1fr 30px 1fr 1fr 1fr 1fr 1fr; | |
grid-template-areas: "label-bottom"; | |
column-gap: 10px; | |
} | |
.label { | |
grid-area: label; | |
} | |
.colon { | |
grid-area: colon; | |
} | |
.input-row { | |
margin-top: 0.2px; | |
display: grid; | |
} | |
.input-row-bottom { | |
width: 100%; | |
display: flex; | |
} | |
.input { | |
grid-area: input; | |
display: flex; | |
align-items: center; | |
} | |
input.input { | |
border-top: 0px; | |
border-left: 0px; | |
border-right: 0px; | |
border-bottom: 2px solid black; | |
border-style: dotted; | |
} | |
input.input-bottom { | |
border-top: 0px; | |
border-left: 0px; | |
border-right: 0px; | |
border-bottom: 0px; | |
} | |
.text-italic { | |
font-style: italic; | |
} | |
.letter-time { | |
width: 100%; | |
text-align: left; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
document.querySelectorAll('.lomba').forEach((item) => { | |
item.addEventListener('click', (event) => { | |
event.target.style.border = "2px solid green"; | |
event.target.style.padding = "2px 2px"; | |
event.target.style.borderRadius = "9999px" | |
}) | |
}) |
Belum ada Komentar untuk "Kuis PWEB A - Form Registrasi"
Posting Komentar