Skip to content

Commit

Permalink
modal user and fix slide show
Browse files Browse the repository at this point in the history
  • Loading branch information
DarqPL committed Apr 13, 2024
1 parent a08fd30 commit 30c8db4
Show file tree
Hide file tree
Showing 6 changed files with 122 additions and 7 deletions.
9 changes: 7 additions & 2 deletions CSS/styleindex.css
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,12 @@ header {
background-color: rgb(26, 148, 255);
}
.slide-show{
width: 50%;
width: 95%;
margin: auto;
margin-top: 3%;
height: 510px;
height: 1%;
background-color: var(--main-background-color);
text-align: center;
}


Expand Down Expand Up @@ -349,3 +350,7 @@ data-styled.g786[id="Userstyle__MenuItemRevamp-sc-6e6am-19"]{content:"fUChpf,bhX
.iZYkSb{padding:0 !important;margin-left:24px;position:relative;}/*!sc*/
.iZYkSb:before{content:'';display:block;height:20px;position:absolute;left:-12px;border:1px solid #EBEBF0;}/*!sc*/
data-styled.g787[id="Userstyle__CartItemInnerRevamp-sc-6e6am-20"]{content:"iZYkSb,"}/*!sc*/

.carousel-inner img{
height: 600px;
}
Binary file added IMG/4092_detail.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added IMG/Suc-manh-tam-thuc1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
58 changes: 58 additions & 0 deletions JS/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
function formValidation() {
var username = document.getElementById("username").value;
var regUsername = /^[A-Z][A-Za-z\s]+$/;
var regEmail = /^[a-z0-9]+@[a-z0-9]+(\.iuh\.edu\.vn)/;
var regPhone = /^(090|091|092)[0-9]{7}/;
var regPwd = /^[a-zA-Z0-9]{6,}/;
var regRepwd = /^[a-zA-Z0-9]{6,}/;
if(username == "" || username == null) {
errName.innerHTML = "Username khong duoc rong";
} else if (isNaN(username) == false) {
errName.innerHTML = "Username khong hop le";
} else if (username.match(regUsername)) {
errName.innerHTML = "";
} else {
errName.innerHTML = "Username sai cu phap";
}

var email = document.getElementById("email").value;
if(email == "" || email == null) {
errEmail.innerHTML = "Email khong duoc rong";
} else if(email.match(regEmail)) {
errEmail.innerHTML = "";
} else {
errEmail.innerHTML = "Email sai cu phap";
}

var phone = document.getElementById("phone").value;
if(phone == "" || phone == null) {
errPhone.innerHTML = "Phone khong duoc rong";
} else if(isNaN(phone) == true){
errPhone.innerHTML = "Phone khong hop le";
} else if(phone.match(regPhone)){
errPhone.innerHTML = "";
} else {
errPhone.innerHTML = "Phone sai cu phap";
}

var pwd = document.getElementById("pwd").value;
if(pwd == "" || pwd == null) {
errPwd.innerHTML = "Password khong duoc rong";
} else if(pwd.match(regPhone)){
errPwd.innerHTML = "";
} else {
errPwd.innerHTML = "Password sai cu phap";
}

var Repwd = document.getElementById("Repwd").value;
if(Repwd == "" || Repwd == null) {
errRepwd.innerHTML = "Repassword khong duoc rong";
} else if(Repwd.match(regRepwd) && Repwd == pwd){
errRepwd.innerHTML = "";
} else if(Repwd != pwd){
errRepwd.innerHTML = "Repassword khong trung";
} else {
errRepwd.innerHTML = "Repassword sai cu phap";
}
return false;
}
2 changes: 2 additions & 0 deletions JS/jquery-3.7.1.min.js

Large diffs are not rendered by default.

60 changes: 55 additions & 5 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,10 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Toko - Web bán sách chất lượng</title>
<link rel="stylesheet" href="CSS/bootstrap.min.css">
<script src="JS/jquery-3.7.1.min.js"></script>
<script src="JS/bootstrap.bundle.min.js"></script>
<link rel="stylesheet" href="CSS/styleindex.css">
<script src="js/index.js"></script>
</head>
<body>
<div class="container-fluids">
Expand Down Expand Up @@ -48,7 +50,7 @@
<img src="IMG/home.png" alt="header_menu_item_home">
<a rel="nofollow">Trang chủ</a>
</div>
<div data-view-id="header_header_account_container" class="Userstyle__MenuItemRevamp-sc-6e6am-19 fUChpf">
<div data-view-id="header_header_account_container" class="Userstyle__MenuItemRevamp-sc-6e6am-19 fUChpf" data-bs-toggle="modal" data-bs-target="#myModal">
<img src="IMG/smile.png" alt="header_header_account_img">
<span>Tài khoản</span>
</div>
Expand All @@ -67,6 +69,53 @@
</div>
</div>
</div>

<div class="modal" id="myModal">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal body -->
<div class="modal-body">
<form action="" onsubmit="return formValidation()">
<div class="row">
<label for="username" class="form-label">Username
<span style="color: red;" id="errName">(*)</span>
</label>
<input type="text" name="username" id="username" class="form-control">
</div>
<div class="row">
<label for="email" class="form-label">Email
<span style="color: red;" id="errEmail">(*)</span>
</label>
<input type="text" name="email" id="email" class="form-control">
</div>
<div class="row">
<label for="phone" class="form-label">Phone number
<span style="color: red;" id="errPhone">(*)</span>
</label>
<input type="text" name="phone" id="phone" class="form-control">
</div>
<div class="row">
<label for="pwd" class="form-label">Password
<span style="color: red;" id="errPwd">(*)</span>
</label>
<input type="password" name="pwd" id="pwd" class="form-control">
</div>
<div class="row">
<label for="Repwd" class="form-label">Repassword
<span style="color: red;" id="errRepwd">(*)</span>
</label>
<input type="password" name="Repwd" id="Repwd" class="form-control">
</div>
<div class="row">
<input type="submit" value="Submit" class="btn btn-success mt-3">
<input type="reset" value="Reset" class="btn mt-3">
</div>
</form>
</div>
</div>
</div>
</div>
<!-- navbar -->
<nav class="navbar navbar-expand-sm bg-info">
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapseNav">
Expand All @@ -91,17 +140,17 @@
</div>
</div>
</nav>
<div class="slide-show ">
<div class="slide-show">
<div id="carouselExampleControls" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img src="IMG/HinhanhSales.jpg" class="d-block" style="width: 100%;" alt="Slide1" />
<img src="IMG/HinhanhSales.jpg" class="d-block" alt="Slide1" width="100%"/>
</div>
<div class="carousel-item">
<img src="IMG/Olaf The Snowman.jpg" class="d-block" width="100%" height="510px" alt="Slide2" />
<img src="IMG/4092_detail.jpg" class="d-block" alt="Slide2" width="100%"/>
</div>
<div class="carousel-item">
<img src="IMG/th.jpg" class="d-block" width="100%" height="510px" alt="Slide3" />
<img src="IMG/Suc-manh-tam-thuc1.png" class="d-block" alt="Slide3" width="100%"/>
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="prev">
Expand All @@ -114,6 +163,7 @@
</button>
</div>
</div>

<!-- san pham -->
<div class="container-fluid mt-3 mb-3" id="product">
<h3>Sách Văn Học</h3>
Expand Down

0 comments on commit 30c8db4

Please sign in to comment.