Skip to content

Commit 4637157

Browse files
nilbuildnilbuild
committed
Add changelog page and refine docs styling
1 parent e1b0039 commit 4637157

6 files changed

Lines changed: 126 additions & 2 deletions

File tree

‎docs/src/content.config.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ const guides = defineCollection({
88
title: z.string(),
99
sort: z.number(),
1010
description: z.string().optional(),
11+
// Keep the page routable but omit it from the sidebar listing.
12+
hidden: z.boolean().optional(),
1113
}),
1214
});
1315

‎docs/src/content/guides/changelog.mdx‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
---
2+
title: "Changelog"
3+
description: "Track what's new in Driver.js. See the latest features, changes, and fixes shipping in each release, plus what's currently in the works."
4+
groupTitle: "Introduction"
5+
sort: 7
6+
---
7+
8+
The _Unreleased_ section lists changes that are merged and will ship in the next
9+
release. Once a release is published, these entries move under a versioned
10+
heading.
11+
12+
## Unreleased
13+
14+
### Added
15+
16+
- `animationDuration` config to control how long the highlight transition takes.
17+
([#104](https://github.com/nilbuild/driver.js/issues/104))
18+
- `allowScroll` config to lock body scroll while a tour is active.
19+
- `onDoneClick` hook, fired when the done button on the final step is clicked.
20+
([#500](https://github.com/nilbuild/driver.js/issues/500))
21+
22+
### Changed
23+
24+
- <span class="breaking-badge">Breaking</span> Popover footer buttons are now styled
25+
through the `driver-popover-footer-btn` class instead of the
26+
`.driver-popover-footer button` selector. Buttons you add through `onPopoverRender`
27+
no longer inherit the default styling automatically. Add the
28+
`driver-popover-footer-btn` class to opt in, or leave it off to apply your own
29+
styles. The built-in next/previous buttons carry the class out of the box.
30+
([#555](https://github.com/nilbuild/driver.js/issues/555))
31+
- Custom buttons added through `onPopoverRender` now receive their own click
32+
events. Only the built-in next, previous, and close buttons have their default
33+
action intercepted by the library.
34+
- The popover exposes `driver-popover-side-*` and `driver-popover-align-*`
35+
classes so you can target its position from CSS, and the arrow positioning was
36+
rewritten for more accurate placement.
37+
- Dropped the CSS `:has()` selector for broader browser compatibility.
38+
([#586](https://github.com/nilbuild/driver.js/issues/586))
39+
40+
### Fixed
41+
42+
- Document event listener leak in `onDriverClick` that left handlers attached
43+
after the tour was destroyed.
44+
([#452](https://github.com/nilbuild/driver.js/issues/452))
45+
46+
## 1.5.0
47+
48+
### Added
49+
50+
- `getNextStep` method on the driver API.
51+
([#420](https://github.com/nilbuild/driver.js/issues/420))
52+
- `driver-popover-done-btn` class on the next button when it acts as the done
53+
button on the final step. ([#610](https://github.com/nilbuild/driver.js/issues/610))
54+
55+
### Changed
56+
57+
- The `onDestroyed` hook now receives the final tour state.
58+
([#553](https://github.com/nilbuild/driver.js/issues/553))
59+
- Removed the unicode characters from the default button labels.
60+
61+
### Fixed
62+
63+
- The tour no longer closes when pressing the left arrow on the first step.
64+
([#564](https://github.com/nilbuild/driver.js/issues/564))
65+
- Removed the button text-shadow that left ghost text behind.
66+
([#605](https://github.com/nilbuild/driver.js/issues/605))
67+
- `onNextClick` now fires when advancing the tour through an overlay click.
68+
([#576](https://github.com/nilbuild/driver.js/issues/576))
69+
70+
For the release notes of other versions, see the
71+
[GitHub releases](https://github.com/nilbuild/driver.js/releases) page.
72+
73+
## Migrating from 0.x to 1.x
74+
75+
Driver.js 1.x is a major release with a new API and architecture. See the
76+
[Migrate to 1.x](/docs/migrating-from-0x) guide for a step-by-step walkthrough
77+
of the import, configuration, and API changes.

‎docs/src/content/guides/migrating-from-0x.mdx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ title: "Migrate to 1.x"
33
description: "Upgrade from Driver.js 0.x to 1.x with this step-by-step migration guide covering the new API, imports, and architecture changes in the 1.0 rewrite."
44
groupTitle: "Introduction"
55
sort: 6
6+
hidden: true
67
---
78

89
Drivers 1.x is a major release that introduces a new API and a new architecture. This page will help you migrate your code from 0.x to 1.x.

‎docs/src/layouts/DocsLayout.astro‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,10 @@ const metaDescription =
3030
<div class="flex">
3131
<Sidebar activeGuideTitle={title} groupedGuides={groupedGuides} />
3232
<div
33-
class="min-w-0 max-w-[800px] py-6 md:py-12 prose px-6 md:px-14 prose-base md:proxe-xl mb-24 prose-blockquote:font-normal prose-blockquote:not-italic prose-blockquote:text-gray-500 prose-p:before:content-['']">
33+
class:list={[
34+
"min-w-0 max-w-[800px] py-6 md:py-12 prose px-6 md:px-14 prose-base md:proxe-xl mb-24 prose-blockquote:font-normal prose-blockquote:not-italic prose-blockquote:text-gray-500 prose-p:before:content-['']",
35+
{ "changelog-page": guide.id === "changelog" },
36+
]}>
3437
<slot />
3538
</div>
3639
</div>

‎docs/src/lib/guide.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@ import { type CollectionEntry, getCollection } from "astro:content";
22

33
export async function getAllGuides(): Promise<Record<string, CollectionEntry<"guides">[]>> {
44
const allGuides: CollectionEntry<"guides">[] = await getCollection("guides");
5-
const sortedGuides = allGuides.sort((a, b) => a.data.sort - b.data.sort);
5+
const visibleGuides = allGuides.filter(guide => !guide.data.hidden);
6+
const sortedGuides = visibleGuides.sort((a, b) => a.data.sort - b.data.sort);
67
return sortedGuides.reduce((acc: Record<string, CollectionEntry<"guides">[]>, curr: CollectionEntry<"guides">) => {
78
const { groupTitle } = curr.data;
89

‎docs/src/styles/tailwind.css‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,43 @@
33

44
/* Recreates the custom `sh` screen from the old tailwind.config.cjs. */
55
@custom-variant sh (@media (min-height: 750px));
6+
7+
/* Inline code — render as a soft pill instead of backtick-quoted bold text. */
8+
.prose :not(pre) > code {
9+
background-color: #f4f4f5;
10+
border: 1px solid #e4e4e7;
11+
border-radius: 0.375rem;
12+
padding: 0.125em 0.375em;
13+
font-weight: 500;
14+
font-size: 0.875em;
15+
color: #27272a;
16+
/* Keep an identifier on one line — move the whole token to the next line
17+
rather than slicing the pill across a line break. */
18+
white-space: nowrap;
19+
}
20+
21+
.prose :not(pre) > code::before,
22+
.prose :not(pre) > code::after {
23+
content: none;
24+
}
25+
26+
/* Changelog — underline each version/section heading to separate releases. */
27+
.changelog-page :where(h2) {
28+
border-bottom: 1px solid #e4e4e7;
29+
padding-bottom: 0.3em;
30+
}
31+
32+
/* Inline badge that flags a breaking change in the changelog. */
33+
.breaking-badge {
34+
display: inline-block;
35+
background-color: #dc2626;
36+
color: #ffffff;
37+
border-radius: 0.375rem;
38+
padding: 0.05em 0.5em;
39+
margin-right: 0.45em;
40+
font-size: 0.7em;
41+
font-weight: 500;
42+
text-transform: uppercase;
43+
letter-spacing: 0.04em;
44+
vertical-align: middle;
45+
}

0 commit comments

Comments
 (0)