Skip to content

Commit 738cccf

Browse files
balloobclaude
andauthored
Cleanup (#12)
* Render index.html always statically * Rename permalinks to use full product names - Rename /vpe/ to /home-assistant-voice-preview-edition/ - Rename /zbt1/ to /home-assistant-connect-zbt-1/ - Add redirects from old URLs to new ones - Update vite.config.ts to use new paths - Add slug field to tools.js for better organization - Update product descriptions 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * Update description --------- Co-authored-by: Claude <[email protected]>
1 parent 41c5806 commit 738cccf

File tree

15 files changed

+225
-301
lines changed

15 files changed

+225
-301
lines changed

.eleventy.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,14 @@ import { env } from 'process';
22

33
import { minify } from 'html-minifier-terser';
44

5+
import { tools } from './tools.js';
6+
57
export default function (eleventyConfig) {
8+
// Add tools collection
9+
eleventyConfig.addCollection('tools', function () {
10+
return tools;
11+
});
12+
613
// Copy static assets
714
eleventyConfig.addPassthroughCopy('public');
815

public/_redirects

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# Redirect old product URLs to new ones
2+
3+
# Voice Preview Edition redirects
4+
/vpe/* /home-assistant-voice-preview-edition/:splat 301
5+
/vpe /home-assistant-voice-preview-edition/ 301
6+
7+
# ZBT-1 redirects
8+
/zbt1/* /home-assistant-connect-zbt-1/:splat 301
9+
/zbt1 /home-assistant-connect-zbt-1/ 301

src-11ty/_includes/base.html

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,6 @@
1212
rel="stylesheet"
1313
href="https://early.webawesome.com/[email protected]/dist/styles/webawesome.css"
1414
/>
15-
<script type="module" src="/src/utils/dark-mode.ts"></script>
16-
1715
<link rel="stylesheet" href="/src/styles/main.css" />
1816
</head>
1917
<body class="wa-palette-shoelace wa-theme-shoelace">
@@ -52,5 +50,22 @@
5250
</header>
5351
</div>
5452
{{ content }}
53+
<script>
54+
(function () {
55+
const updateTheme = () => {
56+
const prefersDark = window.matchMedia(
57+
'(prefers-color-scheme: dark)'
58+
).matches;
59+
document.documentElement.classList.toggle('wa-dark', prefersDark);
60+
document.body.classList.toggle('wa-dark', prefersDark);
61+
document.body.classList.toggle('wa-light', !prefersDark);
62+
};
63+
64+
updateTheme();
65+
window
66+
.matchMedia('(prefers-color-scheme: dark)')
67+
.addEventListener('change', updateTheme);
68+
})();
69+
</script>
5570
</body>
5671
</html>

src-11ty/index.njk

Lines changed: 153 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,160 @@ permalink: /index.html
66
---
77

88
<style>
9-
.container {
10-
display: block;
11-
min-height: 100vh;
12-
background: var(--app-bg-primary);
13-
color: var(--app-text-primary);
9+
.home-container {
10+
display: block;
11+
min-height: 100vh;
12+
background: var(--app-bg-primary);
13+
color: var(--app-text-primary);
14+
max-width: 1200px;
15+
margin: 0 auto;
16+
padding: 20px;
17+
}
18+
19+
.hero {
20+
text-align: center;
21+
padding: 40px 20px;
22+
margin-bottom: 40px;
23+
}
24+
25+
.hero .title {
26+
font-size: 2.5rem;
27+
margin-bottom: 10px;
28+
font-weight: 600;
29+
color: var(--app-text-primary);
30+
}
31+
32+
.hero p {
33+
font-size: 1.1rem;
34+
color: var(--app-text-secondary);
35+
margin: 0;
36+
max-width: 600px;
37+
margin: 0 auto;
38+
line-height: 1.6;
39+
}
40+
41+
.tools-grid {
42+
display: grid;
43+
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
44+
gap: 20px;
45+
margin-bottom: 40px;
46+
}
47+
48+
/* Tool card styles */
49+
.tool-card {
50+
display: block;
51+
background: var(--app-bg-card);
52+
border-radius: 12px;
53+
overflow: hidden;
54+
box-shadow: 0 2px 8px var(--app-shadow);
55+
transition: all 0.3s ease;
56+
height: 100%;
57+
text-decoration: none;
58+
color: inherit;
59+
cursor: pointer;
60+
}
61+
62+
.tool-card:hover {
63+
box-shadow: 0 4px 16px var(--app-shadow-hover);
64+
transform: translateY(-2px);
65+
}
66+
67+
.tool-card .card-image {
68+
width: 100%;
69+
height: 200px;
70+
object-fit: cover;
71+
background: #f0f0f0;
72+
display: block;
73+
}
74+
75+
.tool-card.wled .card-image {
76+
object-fit: contain;
77+
}
78+
79+
.tool-card .card-content {
80+
padding: 20px;
81+
display: flex;
82+
flex-direction: column;
83+
min-height: 180px;
84+
}
85+
86+
.tool-card .card-header {
87+
margin-bottom: 12px;
88+
}
89+
90+
.tool-card .card-title {
91+
font-size: 1.25rem;
92+
font-weight: 600;
93+
color: var(--app-text-primary);
94+
margin: 0 0 8px 0;
95+
line-height: 1.3;
96+
}
97+
98+
.tool-card .card-category {
99+
display: inline-block;
100+
background: var(--app-category-bg);
101+
color: var(--app-category-text);
102+
padding: 2px 8px;
103+
border-radius: 12px;
104+
font-size: 0.75rem;
105+
font-weight: 500;
106+
margin-bottom: 8px;
107+
}
108+
109+
.tool-card .card-description {
110+
color: var(--app-text-secondary);
111+
line-height: 1.5;
112+
margin: 0;
113+
flex: 1;
114+
}
115+
116+
@media (max-width: 768px) {
117+
.hero .title {
118+
font-size: 2rem;
119+
}
120+
121+
.tools-grid {
122+
grid-template-columns: 1fr;
123+
gap: 16px;
124+
}
125+
126+
.home-container {
127+
padding: 16px;
14128
}
129+
}
130+
131+
@media (max-width: 480px) {
132+
.tool-card .card-content {
133+
padding: 16px;
134+
}
135+
}
15136
</style>
16137

17-
<div class="container">
18-
<home-page></home-page>
19-
</div>
138+
<div class="home-container">
139+
<div class="hero">
140+
<div class="title">Device Toolbox</div>
141+
<p>
142+
Flash firmware, configure devices, and manage your smart home hardware
143+
directly from your browser. No installation required.
144+
</p>
145+
</div>
20146

21-
<script type="module" src="/src/pages/home-page.ts"></script>
147+
<div class="tools-grid">
148+
{%- for tool in collections.tools -%}
149+
<a href="{{ tool.url }}" class="tool-card {{ tool.slug }}" {% if tool.url.startsWith('http') and not tool.url.includes('#') %}target="_blank" rel="noopener noreferrer"{% endif %}>
150+
<img src="{{ tool.image }}" alt="{{ tool.title }}" class="card-image" />
151+
152+
<div class="card-content">
153+
<div class="card-header">
154+
{%- if tool.category -%}
155+
<div class="card-category">{{ tool.category }}</div>
156+
{%- endif -%}
157+
<h3 class="card-title">{{ tool.title }}</h3>
158+
</div>
159+
160+
<p class="card-description">{{ tool.description }}</p>
161+
</div>
162+
</a>
163+
{%- endfor -%}
164+
</div>
165+
</div>

src-11ty/vpe/index.njk

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
layout: base.html
33
title: VPE
44
description: Home Assistant Voice Preview Edition - Local voice control for your smart home
5-
permalink: /vpe/index.html
5+
permalink: /home-assistant-voice-preview-edition/index.html
66
---
77

88
<div class="details-page">
@@ -26,7 +26,7 @@ permalink: /vpe/index.html
2626
</div>
2727

2828
<div class="details-actions">
29-
<a href="/vpe/install" class="action-item">
29+
<a href="/home-assistant-voice-preview-edition/install" class="action-item">
3030
<div class="action-icon">
3131
<div class="icon-mask" style="--icon-url: url('/svgs/install.svg')"></div>
3232
</div>

src-11ty/vpe/install.njk

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
layout: base.html
33
title: Install Firmware - VPE
44
description: Flash the latest Voice PE firmware directly to your device
5-
permalink: /vpe/install/index.html
5+
permalink: /home-assistant-voice-preview-edition/install/index.html
66
---
77

88
<script type="module" src="/src/pages/vpe-install.ts"></script>

src-11ty/zbt1/index.njk

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
layout: base.html
33
title: ZBT1
44
description: Update firmware for your Connect ZBT-1 adapter
5-
permalink: /zbt1/index.html
5+
permalink: /home-assistant-connect-zbt-1/index.html
66
---
77

88
<div class="details-page">
@@ -26,7 +26,7 @@ permalink: /zbt1/index.html
2626
</div>
2727

2828
<div class="details-actions">
29-
<a href="/zbt1/install" class="action-item">
29+
<a href="/home-assistant-connect-zbt-1/install" class="action-item">
3030
<div class="action-icon">
3131
<div class="icon-mask" style="--icon-url: url('/svgs/install.svg')"></div>
3232
</div>

src-11ty/zbt1/install.njk

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
layout: base.html
33
title: Install Firmware - ZBT-1
44
description: Install the latest Zigbee or Thread firmware on your ZBT-1
5-
permalink: /zbt1/install/index.html
5+
permalink: /home-assistant-connect-zbt-1/install/index.html
66
---
77

88
<script type="module" src="/src/pages/zbt1-install.ts"></script>

0 commit comments

Comments
 (0)