layout
This commit is contained in:
parent
0a44536179
commit
e485a0bb3b
|
@ -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:
|
||||||
|
". .";
|
||||||
|
}
|
|
@ -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>
|
||||||
|
|
Loading…
Reference in New Issue