Compare commits
2 Commits
5e05861934
...
aa6eb062ba
Author | SHA1 | Date | |
---|---|---|---|
aa6eb062ba | |||
efa4821acc |
@ -0,0 +1,3 @@
|
|||||||
|
FROM nginx:latest
|
||||||
|
WORKDIR /usr/share/nginx/html
|
||||||
|
ADD index.html style.css script.js ./
|
2
Makefile
2
Makefile
@ -1,6 +1,6 @@
|
|||||||
.DEFAULT_GOAL := default
|
.DEFAULT_GOAL := default
|
||||||
|
|
||||||
IMAGE ?= docker.cluster.fun/private/base64:latest
|
IMAGE ?= docker.cluster.fun/averagemarcus/base64:latest
|
||||||
|
|
||||||
.PHONY: test # Run all tests, linting and format checks
|
.PHONY: test # Run all tests, linting and format checks
|
||||||
test: lint check-format run-tests
|
test: lint check-format run-tests
|
||||||
|
24
README.md
24
README.md
@ -2,30 +2,6 @@
|
|||||||
|
|
||||||
Web app to base64 encode and decode
|
Web app to base64 encode and decode
|
||||||
|
|
||||||
## Features
|
|
||||||
|
|
||||||
## Install
|
|
||||||
|
|
||||||
```sh
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
## Building from source
|
|
||||||
|
|
||||||
With Docker:
|
|
||||||
|
|
||||||
```sh
|
|
||||||
make docker-build
|
|
||||||
```
|
|
||||||
|
|
||||||
Standalone:
|
|
||||||
|
|
||||||
```sh
|
|
||||||
make build
|
|
||||||
```
|
|
||||||
|
|
||||||
## Resources
|
|
||||||
|
|
||||||
## Contributing
|
## Contributing
|
||||||
|
|
||||||
If you find a bug or have an idea for a new feature please [raise an issue](/AverageMarcus/base64/issues/new) to discuss it.
|
If you find a bug or have an idea for a new feature please [raise an issue](/AverageMarcus/base64/issues/new) to discuss it.
|
||||||
|
31
index.html
Normal file
31
index.html
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title>Base64 Encode / Decode</title>
|
||||||
|
<link rel="stylesheet" href="/style.css">
|
||||||
|
<script src="/script.js" defer></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>
|
||||||
|
Base64 Encode / Decode
|
||||||
|
</h1>
|
||||||
|
<div class="main">
|
||||||
|
<div class="encoded">
|
||||||
|
<h2>
|
||||||
|
Encoded
|
||||||
|
</h2>
|
||||||
|
<textarea id="encoded"></textarea>
|
||||||
|
</div>
|
||||||
|
<button>🔄</button>
|
||||||
|
<div class="decoded">
|
||||||
|
<h2>
|
||||||
|
Decoded
|
||||||
|
</h2>
|
||||||
|
<textarea id="decoded"></textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
14
script.js
Normal file
14
script.js
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
document.getElementById("encoded").addEventListener("change", function() {
|
||||||
|
try {
|
||||||
|
document.getElementById("decoded").value = atob(this.value);
|
||||||
|
} catch (ex) {
|
||||||
|
document.getElementById("decoded").value = "⚠️ INVALID!!!"
|
||||||
|
}
|
||||||
|
});
|
||||||
|
document.getElementById("decoded").addEventListener("change", function() {
|
||||||
|
try {
|
||||||
|
document.getElementById("encoded").value = btoa(this.value);
|
||||||
|
} catch (ex) {
|
||||||
|
document.getElementById("decoded").value = "⚠️ INVALID!!!"
|
||||||
|
}
|
||||||
|
});
|
42
style.css
Normal file
42
style.css
Normal file
@ -0,0 +1,42 @@
|
|||||||
|
body {
|
||||||
|
font-family: helvetica, arial, sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #dbe3e5;
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg width='52' height='26' viewBox='0 0 52 26' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%2392aca0' fill-opacity='0.4'%3E%3Cpath d='M10 10c0-2.21-1.79-4-4-4-3.314 0-6-2.686-6-6h2c0 2.21 1.79 4 4 4 3.314 0 6 2.686 6 6 0 2.21 1.79 4 4 4 3.314 0 6 2.686 6 6 0 2.21 1.79 4 4 4v2c-3.314 0-6-2.686-6-6 0-2.21-1.79-4-4-4-3.314 0-6-2.686-6-6zm25.464-1.95l8.486 8.486-1.414 1.414-8.486-8.486 1.414-1.414z' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.main {
|
||||||
|
display:flex;
|
||||||
|
width: 100%;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
width: 40vw;
|
||||||
|
height: 50vh;
|
||||||
|
background-color: #ffffffbb;
|
||||||
|
font-size: 1.5em;
|
||||||
|
border: none;
|
||||||
|
padding: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
height: 50px;
|
||||||
|
align-self: center;
|
||||||
|
font-size: 3em;
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media(max-width: 700px) {
|
||||||
|
.main {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
width: 90vw;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user