html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="./bootstrap.min.css">
<link rel="stylesheet" href="./style.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
</head>
<body>
<div id="overlay"></div>
<div class="container-fluid">
<div class="row flex-md-nowrap m-0 p-0"><!-- flex-md-nowrap -->
<!--******************* input box **********************************-->
<div class="inp d-flex justify-content-around align-items-center px-5">
<div class="srch">
<i class="fa fa-search"></i>
<input type=" text">
</div>
</div>
<!-- ************************************* -->
<div class="menu-toggle d-block d-md-none">
<a id="toggle-btn" class=" btn-sidenav-toggle btn-floating " href="#" data-target="slide-out"><i
class="bi bi-justify"></i></a>
</div>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
@import url(https://fonts.googleapis.com/css?family=Muli:300,300i,400,400i,500,600);
body {
direction: rtl;
font-family: "iranyekan";
/* font-size: 14[x]; */
}
@font-face {
font-family: "iransans";
src: url('./font/irsans.ttf') format('woff');
}
@font-face {
font-family: 'iranyekan';
src:
url('./font/IranYekan/eot/IRANYekanWebRegular.eot') format('eot'),
url('./font/IranYekan/woff/IRANYekanWebRegular.woff') format('woff'),
url('./font/IranYekan/ttf/IRANYekanWebRegular.ttf') format('truetype');
}
.col-4 {
background-color: #EDEDED;
padding: 0;
height: 100%;
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
addEventListener("load", (event) => {
(() => {
'use strict'
document.querySelectorAll('.needs-validation').forEach(elem => {
elem.addEventListener('submit', event => {
// console.log("okkkkkkkkkkkkkkkkkkkkkkkkkkk");
const form = event.target;
const nameinp = document.getElementById('nameinp');
let isPasswordValid = false;
let feedbakcspan = document.getElementById('feedbakcspan');
let feedbakcspans = document.getElementById('feedbakcspans');
let feedbakcspane = document.getElementById('feedbakcspane');
let feedbakcspang = document.getElementById('feedbakcspang');
// feedbakcspan.classList.remove('color-red');
// feedbakcspans.classList.remove('color-red');
// feedbakcspane.classList.remove('color-red');
// feedbakcspang.classList.remove('color-red');
let SIPRange = document.getElementById('SIPRange');
let EIPRange = document.getElementById('EIPRange');
let GWTci = document.getElementById('GWTci');
let en = nameinp.value.trim();
const ptern = /^[\u0621-\u0628\u062A-\u063A\u0641-\u0642\u0644-\u0648\u064E-\u0651\u0655\u067E\u0686\u0698\u06A9\u06AF\u06BE\u06CC]+$/;
const ippatern = /\b(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\b/;
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run