wrote up this little basic html button to use on the "misc"-page (has some nice and smooth interactivity on hover), but unfortunately the website builder im using doesnt allow for it right now (cause the "link" feature is being used to link to the html-script, which is a workaround until the next update apparently)


so until that gets fixed im just storing the code in here for future reference so i can find it when i need it

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Simple Button</title>

<style>

body {

display: flex;

justify-content: center;

align-items: center;

height: 100vh;

margin: 0;

background: transparent;

}

.button {

background-color: transparent;

color: black;

font-family: monospace;

font-size: 16px;

padding: 10px 20px;

border: 2px solid black;

border-radius: 4px;

box-shadow: 4px 4px 0 black;

cursor: pointer;

transition: all 0.2s ease-in-out;

position: relative;

}

.button:hover {

box-shadow: 2px 2px 0 black;

transform: translate(2px, 2px);

}

</style>

</head>

<body>

<button class="button">Click Me</button>

</body>

</html>

if you for some reason were to have any use for it, feel free to copy and modify and use this code however you want i dont care.

i have found that this button looks way better on desktop than it does on phone. but i aint about to re-do it, so.