This commit is contained in:
Sergio Álvarez 2021-09-16 11:28:28 +02:00
parent 0a44536179
commit e485a0bb3b
2 changed files with 25 additions and 14 deletions

View File

@ -6,22 +6,31 @@
--line-height: 1.3; --line-height: 1.3;
} }
body {
padding-top: var(--spacing);
}
footer { footer {
text-align: right; text-align: right;
} }
textarea { textarea {
height: 80vh; height: 88vh;
font-family: monospace; font-family: monospace;
} }
header button {
margin-top: var(--spacing);
}
header a { header a {
display: block; display: block;
margin-top: var(--spacing); margin-top: var(--spacing);
margin-bottom: var(--spacing); margin-bottom: var(--spacing);
text-align: center; text-align: center;
} }
.layout {
display: grid;
grid-template-columns: 0.3fr 1.7fr;
grid-template-rows: 1fr;
gap: 0px 1rem;
grid-template-areas:
". .";
}

View File

@ -133,19 +133,21 @@ if ($action == 'reset') {
<body class="container-fluid"> <body class="container-fluid">
<form method="get"> <form method="get">
<header class="grid"> <main class="layout">
<?php foreach ($buttons as $act => $label) { ?> <div>
<button type="submit" name="action" value="<?=$act?>" class="<?=($action == $act? ' contrast': '')?>"><?=$label?></button> <?php foreach ($buttons as $act => $label) { ?>
<?php } ?> <button type="submit" name="action" value="<?=$act?>" class="<?=($action == $act? ' contrast': '')?>"><?=$label?></button>
<a href="/">Reset</a> <?php } ?>
<a href="<?=$help?>">Help</a> <a href="/" role="button" class="secondary">Reset</a>
</header> <a href="<?=$help?>" role="button" class="secondary">Help</a>
</div>
<main class="grid"> <div>
<textarea name="str" class="form-input" placeholder="Paste a string here"><?=htmlentities($result, ENT_QUOTES | ENT_HTML5 | ENT_IGNORE)?></textarea> <textarea name="str" class="form-input" placeholder="Paste a string here"><?=htmlentities($result, ENT_QUOTES | ENT_HTML5 | ENT_IGNORE)?></textarea>
</div>
</main> </main>
<footer class="grid"> <footer>
<small>Contact me via <a href="mailto:correo@sergio.am">email</a> or <a href="https://twitter.com/xergio">twitter</a>. Made with pure <a href="https://php.net/">PHP</a> and <a href="https://picocss.com/"><strong>Pico</strong>.css</a>. <a href="https://sergio.am/code/dencode.xrg.es">Code</a>.</small> <small>Contact me via <a href="mailto:correo@sergio.am">email</a> or <a href="https://twitter.com/xergio">twitter</a>. Made with pure <a href="https://php.net/">PHP</a> and <a href="https://picocss.com/"><strong>Pico</strong>.css</a>. <a href="https://sergio.am/code/dencode.xrg.es">Code</a>.</small>
</footer> </footer>
</form> </form>