Skip to content

Commit 15119f9

Browse files
s-peteys-petey
authored
Merge branch 'main' into feat/example-sveltekit
2 parents e9c76b9 + db9acfb commit 15119f9

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

62 files changed

+1199
-383
lines changed

‎.github/workflows/deploy.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ jobs:
4040

4141
- name: Run server
4242
working-directory: _site
43-
run: deno run --no-lock --allow-read=. --allow-net --allow-env server.ts &
43+
run: deno run --allow-read=. --allow-net --allow-env --lock=../deno.lock server.ts &
4444

4545
- name: Link checker
4646
env:

‎404.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ const styles = /*css*/ `
2424
text-wrap: balance;
2525
}`;
2626

27-
export default function Page(props: Lume.Data, _helpers: Lume.Helpers) {
27+
export default function Page(data: Lume.Data, _helpers: Lume.Helpers) {
2828
return (
2929
<main
3030
id="content"
@@ -43,11 +43,11 @@ export default function Page(props: Lume.Data, _helpers: Lume.Helpers) {
4343
</p>
4444
</div>
4545

46-
<props.comp.Sidebar
46+
<data.comp.Sidebar
4747
sidebar={sidebar}
48-
search={props.search}
49-
url={props.url}
50-
headerPath={props.headerPath!}
48+
search={data.search}
49+
url={data.url}
50+
headerPath={data.headerPath!}
5151
/>
5252
</main>
5353
);

‎_components/ExternalLink.css

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
.external {
2+
display: none;
3+
}
4+
@media (min-width: 650px) {
5+
.external {
6+
display: block;
7+
}
8+
}

‎_components/ExternalLink.tsx

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
export default function ExternalLink(
2+
{ href, children }: { href: string; children: string },
3+
) {
4+
return (
5+
<a
6+
href={href}
7+
className="external blocklink"
8+
target="_blank"
9+
>
10+
{children}
11+
</a>
12+
);
13+
}
14+
15+
export const css = "@import './_components/ExternalLink.css';";

‎_components/Footer.css

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
footer {
2+
padding: 3rem;
3+
border-top: 1px solid hsl(var(--foreground-tertiary));
4+
}
5+
6+
.footer-nav {
7+
display: grid;
8+
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
9+
gap: 1rem;
10+
}
11+
12+
.footer-section-heading {
13+
margin-bottom: 1rem;
14+
font-size: 1rem;
15+
font-weight: bold;
16+
color: hsl(var(--foreground-secondary));
17+
}
18+
19+
.footer-list {
20+
margin: 0;
21+
padding: 0;
22+
list-style: none;
23+
}
24+
25+
.footer-link {
26+
display: block;
27+
margin-bottom: 0.5rem;
28+
color: hsl(var(--foreground-secondary));
29+
&:hover {
30+
color: var(--primary);
31+
}
32+
}
33+
34+
.copyright {
35+
margin: 4rem auto 0;
36+
text-align: center;
37+
font-size: 0.9rem;
38+
color: hsl(var(--foreground-secondary));
39+
}
40+
41+
@media screen and (min-width: 1240px) {
42+
footer {
43+
padding: 2vw 3vw;
44+
}
45+
.footer-nav {
46+
max-width: 1240px;
47+
margin: 0 auto;
48+
}
49+
}

‎_components/Footer.tsx

Lines changed: 31 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,34 @@
1+
export default function Footer_new() {
2+
return (
3+
<footer>
4+
<nav aria-labelledby="footer-navigation" className="footer-nav">
5+
{data.map((category) => (
6+
<section className="footer-section">
7+
<h3 class="footer-section-heading">{category.title}</h3>
8+
<ul class="footer-list">
9+
{category.items.map((item) => (
10+
<li>
11+
<a
12+
class="footer-link"
13+
href={item.to ?? item.href}
14+
>
15+
{item.label}
16+
</a>
17+
</li>
18+
))}
19+
</ul>
20+
</section>
21+
))}
22+
</nav>
23+
<p class="copyright">
24+
Copyright © {new Date().getFullYear()} the Deno authors.
25+
</p>
26+
</footer>
27+
);
28+
}
29+
30+
export const css = "@import './_components/Footer.css';";
31+
132
interface FooterCategory {
233
title: string;
334
items: FooterItem[];
@@ -105,34 +136,3 @@ const data = [
105136
],
106137
},
107138
] satisfies FooterCategory[];
108-
109-
export default function Footer() {
110-
return (
111-
<footer class="w-full border-t border-foreground-secondary/20 pt-12">
112-
<div class="max-w-screen-xl mx-auto pb-16 px-4 sm:px-8 md:px-16">
113-
<div class="grid md:grid-cols-2 lg:grid-cols-4 md:-mx-8">
114-
{data.map((category) => (
115-
<div class="md:mx-4 mb-12">
116-
<h3 class="font-bold mb-4">{category.title}</h3>
117-
<ul>
118-
{category.items.map((item) => (
119-
<li>
120-
<a
121-
class="block items-center py-1 text-foreground-secondary hover:text-primary hover:underline"
122-
href={item.to ?? item.href}
123-
>
124-
{item.label}
125-
</a>
126-
</li>
127-
))}
128-
</ul>
129-
</div>
130-
))}
131-
</div>
132-
<p class="text-center mt-12 text-sm col-span-4">
133-
Copyright © {new Date().getFullYear()} the Deno authors.
134-
</p>
135-
</div>
136-
</footer>
137-
);
138-
}

‎_components/Hamburger.css

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
.hamburger-checkbox {
2+
display: none;
3+
}
4+
5+
.hamburger-label {
6+
position: fixed;
7+
top: 0rem;
8+
left: 0rem;
9+
height: 4rem;
10+
width: 3rem;
11+
}
12+
13+
.hamburger-icon {
14+
:focus {
15+
border: 2px solid var(--foreground-primary);
16+
}
17+
}
18+
19+
.hamburger-bar {
20+
display: block;
21+
position: absolute;
22+
top: 50%;
23+
margin-top: -1px;
24+
left: 1rem;
25+
width: 1.3rem;
26+
height: 2px;
27+
background-color: var(--foreground-primary);
28+
transition: all 0.3s ease;
29+
}
30+
31+
.hamburger-bar--top {
32+
transform: translate(0, -7px);
33+
}
34+
.hamburger-bar--bottom {
35+
transform: translate(0, 7px);
36+
}
37+
38+
.hamburger-label:has(+ .hamburger-checkbox:checked) {
39+
.hamburger-bar--top {
40+
transform: translate(0, 0) rotate(45deg);
41+
}
42+
.hamburger-bar--middle {
43+
opacity: 0;
44+
}
45+
.hamburger-bar--bottom {
46+
transform: translate(0, 0) rotate(-45deg);
47+
}
48+
}
49+
50+
@media screen and (min-width: 1240px) {
51+
.hamburger-label {
52+
display: none;
53+
}
54+
}

‎_components/Hamburger.tsx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
export default function (data: Lume.Data) {
2+
return (
3+
<>
4+
<label htmlFor="hamburger" className="hamburger-label">
5+
<span class="hamburger-bar hamburger-bar--top"></span>
6+
<span class="hamburger-bar hamburger-bar--middle"></span>
7+
<span class="hamburger-bar hamburger-bar--bottom"></span>
8+
</label>
9+
<input type="checkbox" id="hamburger" className="hamburger-checkbox" />
10+
</>
11+
);
12+
}
13+
14+
export const css = "@import './_components/Hamburger.css';";

‎_components/Header.css

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
header {
2+
position: sticky;
3+
top: 0;
4+
display: flex;
5+
gap: 1rem;
6+
align-items: center;
7+
justify-content: space-between;
8+
padding: 0.75rem;
9+
padding-left: 3rem;
10+
border-bottom: 1px solid hsl(var(--foreground-tertiary));
11+
background-color: hsl(var(--background-primary));
12+
13+
nav {
14+
display: none;
15+
}
16+
17+
.external {
18+
margin-left: auto;
19+
}
20+
21+
.logo-link {
22+
display: flex;
23+
height: 2.3rem;
24+
}
25+
26+
.logo {
27+
width: 100%;
28+
max-height: 2.5rem;
29+
}
30+
}
31+
32+
@media (min-width: 1240px) {
33+
header {
34+
padding-left: 1rem;
35+
nav {
36+
display: flex;
37+
}
38+
}
39+
.header-nav-link[data-active="true"] {
40+
color: hsl(var(--primary));
41+
}
42+
}

‎_components/Header.tsx

Lines changed: 4 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import Logo from "./Logo.tsx";
2-
import SearchInput from "./SearchInput.tsx";
32
export default function Header({
3+
data,
44
url,
55
hasSidebar,
66
}: {
7+
data: Lume.Data;
78
url: string;
89
hasSidebar?: boolean;
910
}) {
@@ -89,38 +90,8 @@ export default function Header({
8990
external
9091
hideOnMobile
9192
/>
92-
<div class="min-w-[150px] md:w-32 xl:w-64">
93-
<SearchInput />
94-
</div>
95-
<div class="dark-mode-toggle">
96-
<button class="dark-mode-toggle button p-1 rounded bg-background-primary ring ring-transparent hover:ring-foreground-tertiary">
97-
<span class="dark:hidden">
98-
<svg
99-
class="fill-foreground-primary w-6 h-6"
100-
viewBox="0 0 20 20"
101-
xmlns="http://www.w3.org/2000/svg"
102-
>
103-
<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z">
104-
</path>
105-
</svg>
106-
</span>
107-
<span class="hidden dark:block">
108-
<svg
109-
class="fill-foreground-primary w-6 h-6"
110-
viewBox="0 0 20 20"
111-
xmlns="http://www.w3.org/2000/svg"
112-
>
113-
<path
114-
d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1
115-
0 100-2H3a1 1 0 000 2h1z"
116-
fill-rule="evenodd"
117-
clip-rule="evenodd"
118-
>
119-
</path>
120-
</svg>
121-
</span>
122-
</button>
123-
</div>
93+
<data.comp.SearchInput />
94+
<data.comp.ThemeToggle />
12495
</div>
12596
</nav>
12697

0 commit comments

Comments
 (0)