Remove clear button to simplify UI

The clear button was unnecessary clutter - users can simply select and delete
text in the input field if they want to clear it.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Ole-Morten Duesund 2025-08-18 20:56:49 +02:00
commit cb7c456a8f
3 changed files with 0 additions and 60 deletions

View file

@ -14,7 +14,6 @@ const outputText = document.getElementById('outputText');
const intensitySlider = document.getElementById('intensity');
const intensityValue = document.getElementById('intensityValue');
const zalgoModeSelect = document.getElementById('zalgoMode');
const clearBtn = document.getElementById('clearBtn');
const copyNotification = document.getElementById('copyNotification');
// Easter egg state
@ -117,15 +116,6 @@ async function copyToClipboard() {
}
}
/**
* Clear all text fields
*/
function clearAll() {
inputText.value = '';
outputText.value = '';
inputText.focus();
}
/**
* Easter Egg Functions
*/
@ -325,16 +315,8 @@ outputText.addEventListener('click', () => {
}
});
clearBtn.addEventListener('click', clearAll);
// Handle keyboard shortcuts
document.addEventListener('keydown', e => {
// Ctrl/Cmd + K to clear
if ((e.ctrlKey || e.metaKey) && e.key === 'k') {
e.preventDefault();
clearAll();
}
// Ctrl/Cmd + C when output is focused to copy
if ((e.ctrlKey || e.metaKey) && e.key === 'c' && document.activeElement === outputText) {
copyToClipboard();

View file

@ -65,8 +65,6 @@
></textarea>
<div id="copyNotification" class="copy-notification">Copied!</div>
</div>
<button id="clearBtn" class="clear-btn">Clear All</button>
</main>
<footer>

View file

@ -270,33 +270,6 @@ textarea:focus {
}
}
.clear-btn {
width: 100%;
padding: 15px;
background: transparent;
border: 2px solid var(--accent);
border-radius: 12px;
color: var(--accent);
font-size: 1rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1px;
cursor: pointer;
transition: all 0.3s ease;
margin-top: 20px;
}
.clear-btn:hover {
background: var(--accent);
color: var(--bg-primary);
box-shadow: 0 0 30px var(--shadow);
transform: translateY(-2px);
}
.clear-btn:active {
transform: translateY(0);
}
footer {
text-align: center;
margin-top: 30px;
@ -374,11 +347,6 @@ footer p {
padding: 15px;
}
.clear-btn {
padding: 18px;
font-size: 1.1rem;
}
.copy-notification {
padding: 15px 25px;
font-size: 1rem;
@ -422,10 +390,6 @@ footer p {
padding: 15px;
}
.clear-btn {
min-height: 48px; /* Minimum touch target size */
}
#outputText {
cursor: pointer;
-webkit-user-select: all;
@ -486,8 +450,4 @@ footer p {
box-shadow: none;
border: 1px solid #ccc;
}
.clear-btn {
display: none;
}
}