zyqunix/pages
1
0
Fork 0
mirror of https://github.com/zyqunix/tools.git synced 2025-07-05 22:10:31 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

add char counter

Browse source
This commit is contained in:
zyqunix 2025-04-05 23:46:45 +02:00
parent 9ed3ee790e
commit 825c90e3b1
No known key found for this signature in database
GPG key ID: 134A8DEEA83B80E6
3 changed files with 51 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

20
character/index.html Normal file
View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<title>Character Counter</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" href="https://rimgo.pussthecat.org/RFbdMMB.png" type="image/x-icon">
</head>
<body>
<h1>Character Counter</h1>
<div class="card shadow">
<textarea id="input" placeholder="Enter Text" rows="10" cols="60"></textarea>
<div id="count">0</div>
</div>
<script src="index.js"></script>
</body>
</html>

6
character/index.js Normal file
View file

@ -0,0 +1,6 @@
const textElem = document.getElementById('input');
const countElem = document.getElementById('count');
setInterval(() => {
countElem.innerText = textElem.value.length;
}, 100);

25
character/style.css Normal file
View file

@ -0,0 +1,25 @@
@import url(/global.css);
h1 {
font-size: 2rem;
margin-bottom: 30px;
}
textarea {
background: #1e1e1e;
border: 1px solid #444;
color: #f0f0f0;
padding: 12px;
border-radius: 8px;
font-size: 1rem;
width: 80%;
transition: border-color 0.2s;
outline: none;
resize: none;
}
#count {
margin-top: 10px;
font-size: 1.1rem;
}