inherentlee/mattrbld-site
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

test

Browse Source
This commit is contained in:
Lee Cattarin
2026-05-13 13:41:05 -07:00
parent 54377753f3
commit 1fdac725df
1 changed files with 188 additions and 141 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
index.html
View File

@ -1,34 +1,32 @@
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>This is my home page |</title> <title>This is my home page |</title>
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta charset="utf-8"> <meta charset="utf-8" />
<!-- Meta --> <!-- Meta -->
<link rel="canonical" href="/"> <link rel="canonical" href="/" />
<meta name="description" content=""> <meta name="description" content="" />
<meta name="robots" content="index,follow"> <meta name="robots" content="index,follow" />
<meta property="og:title" content="This is my home page | "> <meta property="og:title" content="This is my home page | " />
<meta property="og:type" content="article"> <meta property="og:type" content="article" />
<meta property="og:url" content="/"> <meta property="og:url" content="/" />
<meta property="og:description" content=""> <meta property="og:description" content="" />
<meta name="generator" content="Eleventy v3.1.5" />
<meta name="generator" content="Eleventy v3.1.5">
<!-- CSS --> <!-- CSS -->
<style>:root { <style>
:root {
color-scheme: light dark; color-scheme: light dark;
} }
/* numbered components are from https://www.joshwcomeau.com/css/custom-css-reset/ */ /* numbered components are from https://www.joshwcomeau.com/css/custom-css-reset/ */
/* 1. Use a more-intuitive box-sizing model */ /* 1. Use a more-intuitive box-sizing model */
*, *::before, *::after { *,
*::before,
*::after {
box-sizing: border-box; box-sizing: border-box;
} }
@ -52,19 +50,32 @@ body {
} }
/* 6. Improve media defaults */ /* 6. Improve media defaults */
img, picture, video, canvas, svg { img,
picture,
video,
canvas,
svg {
display: block; display: block;
max-width: 100%; max-width: 100%;
height: auto; height: auto;
} }
/* 7. Inherit fonts for form controls */ /* 7. Inherit fonts for form controls */
input, button, textarea, select { input,
button,
textarea,
select {
font: inherit; font: inherit;
} }
/* 8. Avoid text overflows */ /* 8. Avoid text overflows */
p, h1, h2, h3, h4, h5, h6 { p,
h1,
h2,
h3,
h4,
h5,
h6 {
overflow-wrap: break-word; overflow-wrap: break-word;
} }
@ -72,36 +83,42 @@ p, h1, h2, h3, h4, h5, h6 {
p { p {
text-wrap: pretty; text-wrap: pretty;
} }
h1, h2, h3, h4, h5, h6 { h1,
h2,
h3,
h4,
h5,
h6 {
text-wrap: balance; text-wrap: balance;
} }
/* /*
10. Create a root stacking context 10. Create a root stacking context
*/ */
#root, #__next { #root,
#__next {
isolation: isolate; isolation: isolate;
}</style> }
</style>
</head> </head>
<body> <body>
<div id="content"> <div id="content">
<header> <header>
<nav> <nav></nav>
</nav>
</header> </header>
<main id="main"> <main id="main">
<h1>This is my home page</h1> <h1>This is my home page</h1>
<img
<img src="/img/TPPh3kvfzS-4898.jpeg" alt="chickadee" loading="lazy" decoding="async" width="4898" height="3265"> src="/img/TPPh3kvfzS-4898.jpeg"
alt="chickadee"
loading="lazy"
decoding="async"
width="4898"
height="3265"
/>
<h2>Here’s an h2</h2> <h2>Here’s an h2</h2>
<p>This is a paragraph.</p> <p>This is a paragraph.</p>
@ -116,14 +133,30 @@ h1, h2, h3, h4, h5, h6 {
</ul> </ul>
<p>And I can double-enter to get out of the list.</p> <p>And I can double-enter to get out of the list.</p>
<h3>Here’s an h3</h3> <h3>Here’s an h3</h3>
<p>Similarly, the editor understands markdown notation for headings. That’s really handy. I also like that I can prevent editors from creating h1s (or h5/h6, who needs those).</p> <p>
Similarly, the editor understands markdown notation for headings.
That’s really handy. I also like that I can prevent editors from
creating h1s (or h5/h6, who needs those).
</p>
<h4>Let’s do some formatting</h4> <h4>Let’s do some formatting</h4>
<p><em>Italics.</em> <strong>Bold!</strong> <em><strong>Bold and italic.</strong></em> There’s even <s>strikethrough</s>.</p> <p>
<p>Inline <code>code blocks</code> work as well, though they don’t pick up on markdown formatting.</p> <em>Italics.</em> <strong>Bold!</strong>
<em><strong>Bold and italic.</strong></em> There’s even
<s>strikethrough</s>.
</p>
<p>
Inline <code>code blocks</code> work as well, though they don’t pick
up on markdown formatting.
</p>
<blockquote> <blockquote>
<p>Blockquotes work like this.</p> <p>Blockquotes work like this.</p>
</blockquote> </blockquote>
<p>Let’s add a link. Here’s my <a href="https://leecat.art">website</a>. They let you choose internal vs. external. Annoyingly, in the rich text editor links are only distinguishable via color, so that’s a bit of an accessibility fail.</p> <p>
Let’s add a link. Here’s my <a href="https://leecat.art">website</a>.
They let you choose internal vs. external. Annoyingly, in the rich
text editor links are only distinguishable via color, so that’s a bit
of an accessibility fail.
</p>
<h2>Let’s do more with lists</h2> <h2>Let’s do more with lists</h2>
<ol> <ol>
<li> <li>
@ -138,25 +171,39 @@ h1, h2, h3, h4, h5, h6 {
</ol> </ol>
</li> </li>
<li> <li>
<p>You can of course tab and shift+tab to change your list level.</p> <p>
You can of course tab and shift+tab to change your list level.
</p>
</li> </li>
</ol> </ol>
<hr> <hr />
<p>We’ve got some lovely horizontal rules as well.</p> <p>We’ve got some lovely horizontal rules as well.</p>
<h2>Markdown attrs plugin</h2> <h2>Markdown attrs plugin</h2>
<p>Now, let’s see if our markdown attributes feature works. Here’s my <a href="https://leecat.art" rel="”external”">website again</a>. I suspect the smart quotes will cause issues! So that may not work.</p> <p>
Now, let’s see if our markdown attributes feature works. Here’s my
<a href="https://leecat.art" rel="”external”">website again</a>. I
suspect the smart quotes will cause issues! So that may not work.
</p>
<h2>Images</h2> <h2>Images</h2>
<p><img src="/img/TPPh3kvfzS-4898.jpeg" alt="" loading="lazy" decoding="async" width="4898" height="3265"></p> <p>
<p>We’ve added an image above. I tried to add alt text, but I’m not sure that Eleventy will pick up on that.</p> <img
src="/img/TPPh3kvfzS-4898.jpeg"
alt=""
loading="lazy"
decoding="async"
width="4898"
height="3265"
/>
</p>
<p>
We’ve added an image above. I tried to add alt text, but I’m not sure
that Eleventy will pick up on that.
</p>
<p>Ok, let’s push this and see what we get.</p> <p>Ok, let’s push this and see what we get.</p>
</main> </main>
</div> </div>
<footer> <footer></footer>
</footer>
<!-- This page `/` was built on 2026-05-13T20:22:29.486Z --> <!-- This page `/` was built on 2026-05-13T20:22:29.486Z -->
</body> </body>