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

add base64 encoder/decoder

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

27
base64/index.html Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Base64 Encoder/Decoder</title>
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" href="https://rimgo.pussthecat.org/RFbdMMB.png" type="image/x-icon">
</head>
<body>
<h1>Base64 Encoder/Decoder</h1>
<div class="card">
<h2>Base64 Encoder</h2>
<textarea id="encodeInput" rows="5" cols="50" placeholder="Enter text to encode"></textarea>
<textarea id="encodeOutput" rows="5" cols="50" readonly placeholder="Encoded Base64 result"></textarea>
<button id="encode">Encode</button>
</div>
<div class="card">
<h2>Base64 Decoder</h2>
<textarea id="decodeInput" rows="5" cols="50" placeholder="Enter Base64 to decode"></textarea>
<textarea id="decodeOutput" rows="5" cols="50" readonly placeholder="Decoded result"></textarea>
<button id="decode">Decode</button>
</div>
<script src="index.js"></script>
</body>
</html>

23
base64/index.js Normal file
View file

@ -0,0 +1,23 @@
const decodeElem = document.getElementById('decodeInput');
const encodeElem = document.getElementById('encodeInput');
const decodeOut = document.getElementById('decodeOutput');
const encodeOut = document.getElementById('encodeOutput');
function encodeBase64() {
const input = encodeElem.value;
const encoded = btoa(input);
encodeOut.value = encoded;
}
function decodeBase64() {
const input = decodeElem.value;
try {
const decoded = atob(input);
decodeOut.value = decoded;
} catch {
decodeOut.value = 'Invalid Base64 input';
}
}
document.getElementById('encode').addEventListener('click', encodeBase64);
document.getElementById('decode').addEventListener('click', decodeBase64);

37
base64/style.css Normal file
View file

@ -0,0 +1,37 @@
@import url(/global.css);
div {
margin-bottom: 50px;
}
textarea {
resize: none;
background-color: #2a2a2a;
color: #f0f0f0;
border: 2px solid #2c2c2c;
margin-bottom: 25px;
border-radius: 5px;
outline: none;
}
textarea[readonly] {
background-color: #282828;
color: #999;
}
button {
margin: 5px 0 50px 0;
width: 50%;
height: 15%;
background-color: #2a2a2a;
color: #f0f0f0;
border: 2px solid #2c2c2c;
cursor: pointer;
border-radius: 5px;
font-size: 16px;
}
button:hover {
background-color: #2c2c2c;
border: 2px solid #2e2e2e;
}