From 825c90e3b1900ecb9b027a41ecd3952288d3ffa0 Mon Sep 17 00:00:00 2001 From: zyqunix <117040076+zyqunix@users.noreply.github.com> Date: Sat, 5 Apr 2025 23:46:45 +0200 Subject: [PATCH] add char counter --- character/index.html | 20 ++++++++++++++++++++ character/index.js | 6 ++++++ character/style.css | 25 +++++++++++++++++++++++++ 3 files changed, 51 insertions(+) create mode 100644 character/index.html create mode 100644 character/index.js create mode 100644 character/style.css diff --git a/character/index.html b/character/index.html new file mode 100644 index 0000000..b13ea85 --- /dev/null +++ b/character/index.html @@ -0,0 +1,20 @@ + + + + + Character Counter + + + + + + +

Character Counter

+
+ +
0
+
+ + + + diff --git a/character/index.js b/character/index.js new file mode 100644 index 0000000..77320fe --- /dev/null +++ b/character/index.js @@ -0,0 +1,6 @@ +const textElem = document.getElementById('input'); +const countElem = document.getElementById('count'); + +setInterval(() => { + countElem.innerText = textElem.value.length; +}, 100); diff --git a/character/style.css b/character/style.css new file mode 100644 index 0000000..9de1eeb --- /dev/null +++ b/character/style.css @@ -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; +} +