magmaus3/infohash2base64
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

more changes

Browse source
This commit is contained in:
magmaus3 2023-07-24 18:24:05 +02:00
parent 6a4b576a81
commit 206b295268
Signed by: magmaus3
GPG key ID: 966755D3F4A9B251
1 changed files with 11 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
index.html
View file

@ -69,6 +69,9 @@
function switchTab(name) {
// Switches the tab
// only "encode","decode" and "about" values are supported
let url = new URL(window.location)
url.searchParams.set("tab", name)
window.history.replaceState(null, "", url.href)
if (name === "encode") {
document.getElementById("encode").style.display = "block"
document.getElementById("decode").style.display = "none"
@ -112,7 +115,7 @@
width: 100vw; height: 100vh;
margin: 0; padding: 0;
display: flex; flex-direction: column;
justify-content: center; text-align: center;
justify-content: center;
align-items: center;
background-color: #10101a;
color: white;
@ -123,20 +126,18 @@
padding: 1em;
border: 1px solid white;
border-radius: 1em;
width: fit-content;
box-shadow: 0px 5px 15px black, 0px 1px 15px black inset;
}
input {
color: white;
background-color: transparent;
border: 1px solid #50505a;
border: 1px solid white;
}
label {
margin-right: 0.5rem;
}
.tab {
display: none; /* Default value to keep tabs hidden when JS is not available */
border: 1px solid white;
padding: 1em;
border-radius: 0em 1em 1em 1em;
@ -150,9 +151,8 @@
border: 1px solid gray;
border-radius: 1em;
}
.tabBar {
.tab, .tabBar {
display: none; /* Default value to keep tabs hidden when JS is not available */
border-collapse: collapse;
}
.button {
padding: 0.5em;
@ -160,6 +160,9 @@
border-bottom: none;
transition: box-shadow 200ms ease;
}
.leftButton {
border-radius: 1em 0em 0em 0em;
}
.button:hover {
box-shadow: 0px 5px 25px black;
}
@ -180,9 +183,9 @@
You can use DevTools in your browser to look at the code (it's intended to be easily readable).
</noscript>
<div class="tabBar">
<div onclick="switchTab('encode')" class="button">Encode</div>
<div onclick="switchTab('encode')" class="button leftButton">Encode</div>
<div onclick="switchTab('decode')" class="button">Decode</div>
<div onclick="switchTab('about')" class="button">About</div>
<div onclick="switchTab('about')" class="button right">About</div>
</div>
<div class="tab" id="encode">
<form>