Catcrafts/catcrafts.net
Watch
2
0
Fork
You've already forked catcrafts.net
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

coingate
All checks were successful
Deploy / build-deploy (push) Successful in 3m10s
Details

Browse source
This commit is contained in:
Jorijn van der Graaf 2026-08-13 23:34:19 +02:00
commit 70668af8f5
20 changed files with 2354 additions and 1048 deletions
Download patch file Download diff file Expand all files Collapse all files

41
styles/styles.css
View file

@ -817,6 +817,47 @@ treatment it replaces, which read as the wrong category for the work.
.field__error { font-size: var(--step--1); color: var(--danger); }
.field__error:empty { display: none; }
/* The payment choice. A <fieldset> so the radios are a labelled group for a
screen reader, which means undoing the browser's default frame and
margins before it can sit in the .field grid like everything else. */
.field--pay { border: 0; padding: 0; margin: 0; min-inline-size: 0; }
.field--pay legend {
padding: 0;
font-weight: 550;
font-size: var(--step--1);
margin-bottom: var(--s-3);
}
/* The whole row is the label, so the target is the option rather than the
8mm dot next to it — the difference between one tap and three on a phone. */
.pay-option {
display: flex;
gap: var(--s-1);
align-items: start;
padding: var(--s-2);
border: 1px solid var(--border-strong);
border-radius: var(--radius-sm);
background: var(--surface-2);
cursor: pointer;
font-weight: 400;
font-size: var(--step--1);
}
.pay-option + .pay-option { margin-top: var(--s-3); }
.pay-option:has(input:checked) { border-color: var(--accent); }
.pay-option:has(input:focus-visible) { border-color: var(--accent); }
/* .field input above is sized for text boxes — full width and 44px tall,
which would turn a radio into a stripe across the form. */
.field--pay input[type="radio"] {
width: auto;
min-height: 0;
/* Aligns the dot with the first line of its sentence rather than the
middle of a three-line block. */
margin-top: 0.15em;
flex: none;
accent-color: var(--accent);
}
.notice {
padding: var(--s-1) var(--s0);
border-radius: var(--radius-sm);