✨feature: Wire up contact and thank you pages, add showInNav meta functionality
This commit is contained in:
Keith Solomon
@@ -7,12 +7,13 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Go SSG - About</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1 class="text-white text-40px hover:text-primary-200"><a href="/">Go SSG</a></h1>
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
@@ -42,7 +43,6 @@
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
41
public/assets/contact.js
Normal file
41
public/assets/contact.js
Normal file
@@ -0,0 +1,41 @@
|
||||
|
||||
document.getElementById("contactForm").addEventListener("submit", function (e) {
|
||||
const name = document.getElementById("name");
|
||||
const email = document.getElementById("email");
|
||||
const message = document.getElementById("message");
|
||||
let valid = true;
|
||||
|
||||
// Clear errors
|
||||
document.querySelectorAll("[data-error]").forEach(el => {
|
||||
el.classList.add("hidden");
|
||||
el.textContent = "";
|
||||
});
|
||||
|
||||
// Validate name
|
||||
if (name.value.trim() === "") {
|
||||
showError("name", "Name is required");
|
||||
valid = false;
|
||||
}
|
||||
|
||||
// Validate email
|
||||
if (!/^[^@\s]+@[^@\s]+\.[^@\s]+$/.test(email.value)) {
|
||||
showError("email", "Enter a valid email address");
|
||||
valid = false;
|
||||
}
|
||||
|
||||
// Validate message
|
||||
if (message.value.trim().length < 10) {
|
||||
showError("message", "Message must be at least 10 characters");
|
||||
valid = false;
|
||||
}
|
||||
|
||||
if (!valid) {
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
function showError(field, message) {
|
||||
const el = document.querySelector(`[data-error="\${field}"]`);
|
||||
el.textContent = message;
|
||||
el.classList.remove("hidden");
|
||||
}
|
||||
});
|
||||
BIN
public/assets/favicon.ico
Normal file
BIN
public/assets/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 106 KiB |
@@ -6,25 +6,30 @@
|
||||
--font-sans: "Raleway", sans-serif;
|
||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
||||
"Courier New", monospace;
|
||||
--color-red-600: oklch(57.7% 0.245 27.325);
|
||||
--color-green-700: oklch(52.7% 0.154 150.069);
|
||||
--color-blue-600: oklch(54.6% 0.245 262.881);
|
||||
--color-blue-700: oklch(48.8% 0.243 264.376);
|
||||
--color-black: oklch(0% 0 0);
|
||||
--color-white: oklch(100% 0 0);
|
||||
--spacing: 0.25rem;
|
||||
--container-xl: 36rem;
|
||||
--container-2xl: 42rem;
|
||||
--container-5xl: 64rem;
|
||||
--text-xs: 0.75rem;
|
||||
--text-xs--line-height: calc(1 / 0.75);
|
||||
--text-sm: 0.875rem;
|
||||
--text-sm--line-height: calc(1.25 / 0.875);
|
||||
--text-base: 1rem;
|
||||
--text-lg: 1.125rem;
|
||||
--text-lg--line-height: calc(1.75 / 1.125);
|
||||
--text-2xl: 1.5rem;
|
||||
--text-2xl--line-height: calc(2 / 1.5);
|
||||
--text-3xl: 1.875rem;
|
||||
--text-3xl--line-height: calc(2.25 / 1.875);
|
||||
--font-weight-medium: 500;
|
||||
--font-weight-bold: 700;
|
||||
--radius-sm: 0.25rem;
|
||||
--default-transition-duration: 150ms;
|
||||
--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
--default-font-family: var(--font-sans);
|
||||
--default-mono-font-family: var(--font-mono);
|
||||
--spacing-section: 2rem;
|
||||
@@ -63,22 +68,6 @@
|
||||
--tw-prose-pre-bg: var(--color-secondary);
|
||||
--tw-prose-th-borders: var(--color-secondary);
|
||||
--tw-prose-td-borders: var(--color-secondary);
|
||||
--tw-prose-invert-body: var(--color-primary);
|
||||
--tw-prose-invert-headings: var(--color-primary);
|
||||
--tw-prose-invert-lead: var(--color-primary);
|
||||
--tw-prose-invert-links: var(--color-secondary);
|
||||
--tw-prose-invert-bold: var(--color-primary);
|
||||
--tw-prose-invert-counters: var(--color-primary);
|
||||
--tw-prose-invert-bullets: var(--color-primary);
|
||||
--tw-prose-invert-hr: var(--color-secondary);
|
||||
--tw-prose-invert-quotes: var(--color-primary);
|
||||
--tw-prose-invert-quote-borders: var(--color-primary);
|
||||
--tw-prose-invert-captions: var(--color-primary);
|
||||
--tw-prose-invert-code: var(--color-secondary);
|
||||
--tw-prose-invert-pre-code: var(--color-primary);
|
||||
--tw-prose-invert-pre-bg: oklch(0% 0 0 / 50%);
|
||||
--tw-prose-invert-th-borders: var(--color-primary);
|
||||
--tw-prose-invert-td-borders: var(--color-primary);
|
||||
}
|
||||
}
|
||||
@layer base {
|
||||
@@ -230,447 +219,14 @@
|
||||
.static {
|
||||
position: static;
|
||||
}
|
||||
.container {
|
||||
width: 100%;
|
||||
@media (width >= 22.5rem) {
|
||||
max-width: 22.5rem;
|
||||
}
|
||||
@media (width >= 29.6875rem) {
|
||||
max-width: 29.6875rem;
|
||||
}
|
||||
@media (width >= 40rem) {
|
||||
max-width: 40rem;
|
||||
}
|
||||
@media (width >= 48rem) {
|
||||
max-width: 48rem;
|
||||
}
|
||||
@media (width >= 64rem) {
|
||||
max-width: 64rem;
|
||||
}
|
||||
@media (width >= 80rem) {
|
||||
max-width: 80rem;
|
||||
}
|
||||
@media (width >= 96rem) {
|
||||
max-width: 96rem;
|
||||
}
|
||||
}
|
||||
.m-0 {
|
||||
margin: calc(var(--spacing) * 0);
|
||||
}
|
||||
.prose {
|
||||
color: var(--tw-prose-body);
|
||||
max-width: 65ch;
|
||||
:where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
:where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-lead);
|
||||
font-size: 1.25em;
|
||||
line-height: 1.6;
|
||||
margin-top: 1.2em;
|
||||
margin-bottom: 1.2em;
|
||||
}
|
||||
:where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-links);
|
||||
text-decoration: underline;
|
||||
font-weight: 500;
|
||||
}
|
||||
:where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-bold);
|
||||
font-weight: 600;
|
||||
}
|
||||
:where(a strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(blockquote strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(thead th strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: decimal;
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
padding-inline-start: 1.625em;
|
||||
}
|
||||
:where(ol[type="A"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: upper-alpha;
|
||||
}
|
||||
:where(ol[type="a"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: lower-alpha;
|
||||
}
|
||||
:where(ol[type="A" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: upper-alpha;
|
||||
}
|
||||
:where(ol[type="a" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: lower-alpha;
|
||||
}
|
||||
:where(ol[type="I"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: upper-roman;
|
||||
}
|
||||
:where(ol[type="i"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: lower-roman;
|
||||
}
|
||||
:where(ol[type="I" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: upper-roman;
|
||||
}
|
||||
:where(ol[type="i" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: lower-roman;
|
||||
}
|
||||
:where(ol[type="1"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
:where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: disc;
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
padding-inline-start: 1.625em;
|
||||
}
|
||||
:where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
|
||||
font-weight: 400;
|
||||
color: var(--tw-prose-counters);
|
||||
}
|
||||
:where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
|
||||
color: var(--tw-prose-bullets);
|
||||
}
|
||||
:where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 600;
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
:where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-color: var(--tw-prose-hr);
|
||||
border-top-width: 1;
|
||||
margin-top: 3em;
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
:where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
color: var(--tw-prose-quotes);
|
||||
border-inline-start-width: 0.25rem;
|
||||
border-inline-start-color: var(--tw-prose-quote-borders);
|
||||
quotes: "\201C""\201D""\2018""\2019";
|
||||
margin-top: 1.6em;
|
||||
margin-bottom: 1.6em;
|
||||
padding-inline-start: 1em;
|
||||
}
|
||||
:where(blockquote p:first-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
|
||||
content: open-quote;
|
||||
}
|
||||
:where(blockquote p:last-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
|
||||
content: close-quote;
|
||||
}
|
||||
:where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 800;
|
||||
font-size: 2.25em;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.8888889em;
|
||||
line-height: 1.1111111;
|
||||
}
|
||||
:where(h1 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 900;
|
||||
color: inherit;
|
||||
}
|
||||
:where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 700;
|
||||
font-size: 1.5em;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 1em;
|
||||
line-height: 1.3333333;
|
||||
}
|
||||
:where(h2 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 800;
|
||||
color: inherit;
|
||||
}
|
||||
:where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 600;
|
||||
font-size: 1.25em;
|
||||
margin-top: 1.6em;
|
||||
margin-bottom: 0.6em;
|
||||
line-height: 1.6;
|
||||
}
|
||||
:where(h3 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 700;
|
||||
color: inherit;
|
||||
}
|
||||
:where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 600;
|
||||
margin-top: 1.5em;
|
||||
margin-bottom: 0.5em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
:where(h4 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 700;
|
||||
color: inherit;
|
||||
}
|
||||
:where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
:where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
display: block;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
:where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
:where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 500;
|
||||
font-family: inherit;
|
||||
color: var(--tw-prose-kbd);
|
||||
box-shadow: 0 0 0 1px rgb(var(--tw-prose-kbd-shadows) / 10%), 0 3px 0 rgb(var(--tw-prose-kbd-shadows) / 10%);
|
||||
font-size: 0.875em;
|
||||
border-radius: 0.3125rem;
|
||||
padding-top: 0.1875em;
|
||||
padding-inline-end: 0.375em;
|
||||
padding-bottom: 0.1875em;
|
||||
padding-inline-start: 0.375em;
|
||||
}
|
||||
:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-code);
|
||||
font-weight: 600;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
|
||||
content: "`";
|
||||
}
|
||||
:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
|
||||
content: "`";
|
||||
}
|
||||
:where(a code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(h1 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
:where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
:where(h4 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(blockquote code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-pre-code);
|
||||
background-color: var(--tw-prose-pre-bg);
|
||||
overflow-x: auto;
|
||||
font-weight: 400;
|
||||
font-size: 0.875em;
|
||||
line-height: 1.7142857;
|
||||
margin-top: 1.7142857em;
|
||||
margin-bottom: 1.7142857em;
|
||||
border-radius: 0.375rem;
|
||||
padding-top: 0.8571429em;
|
||||
padding-inline-end: 1.1428571em;
|
||||
padding-bottom: 0.8571429em;
|
||||
padding-inline-start: 1.1428571em;
|
||||
}
|
||||
:where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
background-color: transparent;
|
||||
border-width: 0;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
font-weight: inherit;
|
||||
color: inherit;
|
||||
font-size: inherit;
|
||||
font-family: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
:where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
|
||||
content: none;
|
||||
}
|
||||
:where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
|
||||
content: none;
|
||||
}
|
||||
:where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
width: 100%;
|
||||
table-layout: auto;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
font-size: 0.875em;
|
||||
line-height: 1.7142857;
|
||||
}
|
||||
:where(thead):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-color: var(--tw-prose-th-borders);
|
||||
}
|
||||
:where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 600;
|
||||
vertical-align: bottom;
|
||||
padding-inline-end: 0.5714286em;
|
||||
padding-bottom: 0.5714286em;
|
||||
padding-inline-start: 0.5714286em;
|
||||
}
|
||||
:where(tbody tr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-color: var(--tw-prose-td-borders);
|
||||
}
|
||||
:where(tbody tr:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-bottom-width: 0;
|
||||
}
|
||||
:where(tbody td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
:where(tfoot):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-top-width: 1px;
|
||||
border-top-color: var(--tw-prose-th-borders);
|
||||
}
|
||||
:where(tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
vertical-align: top;
|
||||
}
|
||||
:where(th, td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
text-align: start;
|
||||
}
|
||||
:where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
:where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-captions);
|
||||
font-size: 0.875em;
|
||||
line-height: 1.4285714;
|
||||
margin-top: 0.8571429em;
|
||||
}
|
||||
--tw-prose-body: oklch(37.3% 0.034 259.733);
|
||||
--tw-prose-headings: oklch(21% 0.034 264.665);
|
||||
--tw-prose-lead: oklch(44.6% 0.03 256.802);
|
||||
--tw-prose-links: oklch(21% 0.034 264.665);
|
||||
--tw-prose-bold: oklch(21% 0.034 264.665);
|
||||
--tw-prose-counters: oklch(55.1% 0.027 264.364);
|
||||
--tw-prose-bullets: oklch(87.2% 0.01 258.338);
|
||||
--tw-prose-hr: oklch(92.8% 0.006 264.531);
|
||||
--tw-prose-quotes: oklch(21% 0.034 264.665);
|
||||
--tw-prose-quote-borders: oklch(92.8% 0.006 264.531);
|
||||
--tw-prose-captions: oklch(55.1% 0.027 264.364);
|
||||
--tw-prose-kbd: oklch(21% 0.034 264.665);
|
||||
--tw-prose-kbd-shadows: NaN NaN NaN;
|
||||
--tw-prose-code: oklch(21% 0.034 264.665);
|
||||
--tw-prose-pre-code: oklch(92.8% 0.006 264.531);
|
||||
--tw-prose-pre-bg: oklch(27.8% 0.033 256.848);
|
||||
--tw-prose-th-borders: oklch(87.2% 0.01 258.338);
|
||||
--tw-prose-td-borders: oklch(92.8% 0.006 264.531);
|
||||
--tw-prose-invert-body: oklch(87.2% 0.01 258.338);
|
||||
--tw-prose-invert-headings: #fff;
|
||||
--tw-prose-invert-lead: oklch(70.7% 0.022 261.325);
|
||||
--tw-prose-invert-links: #fff;
|
||||
--tw-prose-invert-bold: #fff;
|
||||
--tw-prose-invert-counters: oklch(70.7% 0.022 261.325);
|
||||
--tw-prose-invert-bullets: oklch(44.6% 0.03 256.802);
|
||||
--tw-prose-invert-hr: oklch(37.3% 0.034 259.733);
|
||||
--tw-prose-invert-quotes: oklch(96.7% 0.003 264.542);
|
||||
--tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733);
|
||||
--tw-prose-invert-captions: oklch(70.7% 0.022 261.325);
|
||||
--tw-prose-invert-kbd: #fff;
|
||||
--tw-prose-invert-kbd-shadows: 255 255 255;
|
||||
--tw-prose-invert-code: #fff;
|
||||
--tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338);
|
||||
--tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
|
||||
--tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802);
|
||||
--tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733);
|
||||
font-size: 1rem;
|
||||
line-height: 1.75;
|
||||
:where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
:where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
:where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-start: 0.375em;
|
||||
}
|
||||
:where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-start: 0.375em;
|
||||
}
|
||||
:where(.prose > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0.75em;
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
:where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
:where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
:where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
:where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
:where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0.75em;
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
:where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
:where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0.5em;
|
||||
padding-inline-start: 1.625em;
|
||||
}
|
||||
:where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-start: 0;
|
||||
}
|
||||
:where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-end: 0;
|
||||
}
|
||||
:where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-top: 0.5714286em;
|
||||
padding-inline-end: 0.5714286em;
|
||||
padding-bottom: 0.5714286em;
|
||||
padding-inline-start: 0.5714286em;
|
||||
}
|
||||
:where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-start: 0;
|
||||
}
|
||||
:where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-end: 0;
|
||||
}
|
||||
:where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
:where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.mx-auto {
|
||||
margin-inline: auto;
|
||||
}
|
||||
.mt-10 {
|
||||
margin-top: calc(var(--spacing) * 10);
|
||||
}
|
||||
.mb-4 {
|
||||
margin-bottom: calc(var(--spacing) * 4);
|
||||
@@ -681,21 +237,15 @@
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
.table {
|
||||
display: table;
|
||||
}
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
.max-w-2xl {
|
||||
max-width: var(--container-2xl);
|
||||
}
|
||||
.max-w-xl {
|
||||
max-width: var(--container-xl);
|
||||
}
|
||||
.border-collapse {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
.resize {
|
||||
resize: both;
|
||||
}
|
||||
.list-none {
|
||||
list-style-type: none;
|
||||
}
|
||||
@@ -731,17 +281,25 @@
|
||||
.py-4 {
|
||||
padding-block: calc(var(--spacing) * 4);
|
||||
}
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
.text-2xl {
|
||||
font-size: var(--text-2xl);
|
||||
line-height: var(--tw-leading, var(--text-2xl--line-height));
|
||||
}
|
||||
.text-3xl {
|
||||
font-size: var(--text-3xl);
|
||||
line-height: var(--tw-leading, var(--text-3xl--line-height));
|
||||
}
|
||||
.text-lg {
|
||||
font-size: var(--text-lg);
|
||||
line-height: var(--tw-leading, var(--text-lg--line-height));
|
||||
}
|
||||
.text-sm {
|
||||
font-size: var(--text-sm);
|
||||
line-height: var(--tw-leading, var(--text-sm--line-height));
|
||||
}
|
||||
.text-40px {
|
||||
font-size: var(--text-40px);
|
||||
}
|
||||
.leading-none {
|
||||
--tw-leading: 1;
|
||||
line-height: 1;
|
||||
@@ -754,24 +312,18 @@
|
||||
--tw-font-weight: var(--font-weight-medium);
|
||||
font-weight: var(--font-weight-medium);
|
||||
}
|
||||
.text-green-700 {
|
||||
color: var(--color-green-700);
|
||||
}
|
||||
.text-primary {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.text-red-600 {
|
||||
color: var(--color-red-600);
|
||||
}
|
||||
.text-white {
|
||||
color: var(--color-white);
|
||||
}
|
||||
.underline {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
.outline {
|
||||
outline-style: var(--tw-outline-style);
|
||||
outline-width: 1px;
|
||||
}
|
||||
.transition {
|
||||
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
|
||||
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
||||
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
||||
}
|
||||
.hover\:bg-blue-700 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
@@ -898,6 +450,15 @@ h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a {
|
||||
color: inherit;
|
||||
text-decoration: underline;
|
||||
}
|
||||
#site_head h1 a {
|
||||
font-size: var(--text-40px);
|
||||
color: var(--color-white);
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
color: var(--color-primary-200);
|
||||
}
|
||||
}
|
||||
}
|
||||
p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1rem;
|
||||
@@ -1449,11 +1010,6 @@ footer#site_foot {
|
||||
syntax: "*";
|
||||
inherits: false;
|
||||
}
|
||||
@property --tw-outline-style {
|
||||
syntax: "*";
|
||||
inherits: false;
|
||||
initial-value: solid;
|
||||
}
|
||||
@property --tw-space-x-reverse {
|
||||
syntax: "*";
|
||||
inherits: false;
|
||||
@@ -1466,7 +1022,6 @@ footer#site_foot {
|
||||
--tw-border-style: solid;
|
||||
--tw-leading: initial;
|
||||
--tw-font-weight: initial;
|
||||
--tw-outline-style: solid;
|
||||
--tw-space-x-reverse: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,12 +7,13 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Go SSG - Another Blog Post</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1 class="text-white text-40px hover:text-primary-200"><a href="/">Go SSG</a></h1>
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
@@ -69,7 +70,6 @@
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
@@ -7,12 +7,13 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Category: Anger</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1 class="text-white text-40px hover:text-primary-200"><a href="/">Go SSG</a></h1>
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
@@ -43,7 +44,6 @@
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
@@ -7,12 +7,13 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Category: Go</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1 class="text-white text-40px hover:text-primary-200"><a href="/">Go SSG</a></h1>
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
@@ -45,7 +46,6 @@
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
@@ -7,12 +7,13 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Category: Progrmming</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1 class="text-white text-40px hover:text-primary-200"><a href="/">Go SSG</a></h1>
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
@@ -43,7 +44,6 @@
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
@@ -7,12 +7,13 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Blog Index</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1 class="text-white text-40px hover:text-primary-200"><a href="/">Go SSG</a></h1>
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
@@ -48,7 +49,6 @@
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
@@ -7,12 +7,13 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Go SSG - My First Blog Post</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1 class="text-white text-40px hover:text-primary-200"><a href="/">Go SSG</a></h1>
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
@@ -69,7 +70,6 @@
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
@@ -7,12 +7,13 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Contact</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1 class="text-white text-40px hover:text-primary-200"><a href="/">Go SSG</a></h1>
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
@@ -32,8 +33,40 @@
|
||||
|
||||
<main>
|
||||
<article>
|
||||
<h1>Contact</h1>
|
||||
|
||||
<h1 class="text-2xl font-bold mb-4">Contact Me</h1>
|
||||
|
||||
<form action="https://api.staticforms.xyz/submit" method="POST" class="space-y-4 max-w-xl">
|
||||
|
||||
<input type="hidden" name="accessKey" value="sf_5m86ek16hmele1jlkl62ghml" />
|
||||
|
||||
|
||||
<input type="hidden" name="redirectTo" value="/thanks/" />
|
||||
|
||||
<label>
|
||||
<span>Name</span>
|
||||
<input id="name" type="text" name="name" required class="w-full border p-2 rounded" />
|
||||
<span class="text-red-600 text-sm hidden" data-error="name"></span>
|
||||
</label>
|
||||
|
||||
<label>
|
||||
<span>Email</span>
|
||||
<input id="email" type="email" name="email" required class="w-full border p-2 rounded" />
|
||||
<span class="text-red-600 text-sm hidden" data-error="email"></span>
|
||||
</label>
|
||||
|
||||
<label>
|
||||
<span>Message</span>
|
||||
<textarea id="message" name="message" rows="5" required class="w-full border p-2 rounded"></textarea>
|
||||
<span class="text-red-600 text-sm hidden" data-error="message"></span>
|
||||
</label>
|
||||
|
||||
|
||||
|
||||
|
||||
<button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700">
|
||||
Send Message
|
||||
</button>
|
||||
</form>
|
||||
</article>
|
||||
</main>
|
||||
|
||||
@@ -41,7 +74,6 @@
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
<script src="/assets/contact.js" defer></script></body>
|
||||
</html>
|
||||
|
||||
|
||||
@@ -7,12 +7,13 @@
|
||||
<meta charset="UTF-8">
|
||||
<title>Go SSG - Home</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1 class="text-white text-40px hover:text-primary-200"><a href="/">Go SSG</a></h1>
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
@@ -42,7 +43,6 @@
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
47
public/thanks/index.html
Normal file
47
public/thanks/index.html
Normal file
@@ -0,0 +1,47 @@
|
||||
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Thank You</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header id="site_head">
|
||||
<h1><a href="/">Go SSG</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul class="list-none">
|
||||
|
||||
<li class="list-none"><a class="text-white hover:text-primary-200" href="/">Home</a></li>
|
||||
|
||||
<li class="list-none"><a class="text-white hover:text-primary-200" href="/blog/">Blog</a></li>
|
||||
|
||||
<li class="list-none"><a class="text-white hover:text-primary-200" href="/about/">About</a></li>
|
||||
|
||||
<li class="list-none"><a class="text-white hover:text-primary-200" href="/contact/">Contact</a></li>
|
||||
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
|
||||
<main>
|
||||
<div class="max-w-2xl mx-auto mt-10 text-center">
|
||||
<h1 class="text-3xl font-bold text-green-700 mb-4">Thanks for reaching out!</h1>
|
||||
<p class="text-lg">Your message has been received. I’ll get back to you as soon as I can.</p>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
|
||||
<footer id="site_foot">
|
||||
<p class="p-0 py-4 m-0 leading-none">© 2025 Keith Solomon - Go SSG</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user