warns that contact form is semi-functional
This commit is contained in:
@@ -46,6 +46,17 @@
|
|||||||
--colour-error-90: oklch(0.9 0.2 26);
|
--colour-error-90: oklch(0.9 0.2 26);
|
||||||
--colour-error-95: oklch(0.95 0.2 26);
|
--colour-error-95: oklch(0.95 0.2 26);
|
||||||
|
|
||||||
|
--colour-warn-10: oklch(0.1 0.2 46);
|
||||||
|
--colour-warn-20: oklch(0.2 0.2 46);
|
||||||
|
--colour-warn-30: oklch(0.3 0.2 46);
|
||||||
|
--colour-warn-40: oklch(0.4 0.2 46);
|
||||||
|
--colour-warn-50: oklch(0.5 0.2 46);
|
||||||
|
--colour-warn-60: oklch(0.6 0.2 46);
|
||||||
|
--colour-warn-70: oklch(0.7 0.2 46);
|
||||||
|
--colour-warn-80: oklch(0.8 0.2 46);
|
||||||
|
--colour-warn-90: oklch(0.9 0.2 46);
|
||||||
|
--colour-warn-95: oklch(0.95 0.2 46);
|
||||||
|
|
||||||
--colour-primary-fg: var(--colour-primary-90);
|
--colour-primary-fg: var(--colour-primary-90);
|
||||||
--colour-primary-fg-accent: var(--colour-primary-80);
|
--colour-primary-fg-accent: var(--colour-primary-80);
|
||||||
--colour-primary-bg: var(--colour-primary-10);
|
--colour-primary-bg: var(--colour-primary-10);
|
||||||
@@ -57,6 +68,8 @@
|
|||||||
--colour-grey-bg: var(--colour-grey-30);
|
--colour-grey-bg: var(--colour-grey-30);
|
||||||
--colour-error-fg: var(--colour-error-90);
|
--colour-error-fg: var(--colour-error-90);
|
||||||
--colour-error-bg: var(--colour-error-40);
|
--colour-error-bg: var(--colour-error-40);
|
||||||
|
--colour-warn-fg: var(--colour-warn-20);
|
||||||
|
--colour-warn-bg: var(--colour-warn-80);
|
||||||
|
|
||||||
--font-size-sm: 1rem;
|
--font-size-sm: 1rem;
|
||||||
--font-size-base: 1.125rem;
|
--font-size-base: 1.125rem;
|
||||||
@@ -492,3 +505,12 @@ dialog {
|
|||||||
padding-block: var(--spacing--block-sm);
|
padding-block: var(--spacing--block-sm);
|
||||||
padding-inline: var(--spacing-inline-sm);
|
padding-inline: var(--spacing-inline-sm);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.warn {
|
||||||
|
background: var(--colour-warn-bg);
|
||||||
|
border: 2px solid var(--colour-warn-fg);
|
||||||
|
color: var(--colour-warn-fg);
|
||||||
|
padding-block: var(--spacing--block-sm);
|
||||||
|
padding-inline: var(--spacing-inline-sm);
|
||||||
|
--colour-hyperlink: var(--colour-hyperlink-40);
|
||||||
|
}
|
||||||
|
|||||||
@@ -8,6 +8,15 @@ import Page from "../layouts/Page.astro";
|
|||||||
|
|
||||||
<form class="contact-form">
|
<form class="contact-form">
|
||||||
<h1>Contact me</h1>
|
<h1>Contact me</h1>
|
||||||
|
|
||||||
|
<p class="warn">
|
||||||
|
This contact form only accepts a very small number of submissions per day
|
||||||
|
to avoid spamming my inbox with bots. I have an idea for a workaround, but
|
||||||
|
in the meantime, please forgive me if the form refuses to accept your
|
||||||
|
submission. If you want to get in touch with me professionally, you can
|
||||||
|
message me on <a href="https://www.linkedin.com/in/joe-carstairs-0aa936277">LinkedIn</a>.
|
||||||
|
</p>
|
||||||
|
|
||||||
<p hidden class="error"/>
|
<p hidden class="error"/>
|
||||||
<label for="name">Name</label>
|
<label for="name">Name</label>
|
||||||
<input id="name" name="name" type="text" required>
|
<input id="name" name="name" type="text" required>
|
||||||
|
|||||||
Reference in New Issue
Block a user