@primer/doctocat-nextjs 0.0.2 → 0.0.3-rc.4828245
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/components/layout/index-cards/IndexCards.module.css +11 -4
- package/components/layout/index-cards/IndexCards.tsx +15 -15
- package/components/layout/table-of-contents/TableOfContents.module.css +1 -0
- package/components/layout/table-of-contents/TableOfContents.tsx +2 -0
- package/css/prose.module.css +4 -0
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @primer/doctocat-nextjs
|
|
2
2
|
|
|
3
|
+
## 0.0.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`937f773`](https://github.com/primer/doctocat-nextjs/commit/937f77385bc6c4d2c6289d0a6f12122373789f73) Thanks [@rezrah](https://github.com/rezrah)! - Redesign index pages to match current Doctocat styles
|
|
8
|
+
|
|
9
|
+
- [`7703a7b`](https://github.com/primer/doctocat-nextjs/commit/7703a7b86bc906ff981a7f864a9916c963a35087) Thanks [@rezrah](https://github.com/rezrah)! - Fixed code bg in dark mode and applied fixed width to toc to prevent layout shift
|
|
10
|
+
|
|
3
11
|
## 0.0.2
|
|
4
12
|
|
|
5
13
|
### Patch Changes
|
|
@@ -1,5 +1,12 @@
|
|
|
1
|
-
.
|
|
2
|
-
--brand-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
.heading a {
|
|
2
|
+
color: var(--brand-InlineLink-color-rest);
|
|
3
|
+
text-decoration: none;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.heading a:hover {
|
|
7
|
+
text-decoration: underline;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.heading a:active {
|
|
11
|
+
color: var(--brand-InlineLink-color-pressed);
|
|
5
12
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react'
|
|
2
|
-
import {
|
|
2
|
+
import {Heading, Stack, Text} from '@primer/react-brand'
|
|
3
3
|
import {Folder, MdxFile} from 'nextra'
|
|
4
4
|
|
|
5
|
-
import styles from './IndexCards.module.css'
|
|
6
5
|
import Link from 'next/link'
|
|
6
|
+
import styles from './IndexCards.module.css'
|
|
7
7
|
|
|
8
8
|
type IndexCardsProps = {
|
|
9
9
|
route: string
|
|
@@ -25,22 +25,22 @@ export function IndexCards({route, folderData}: IndexCardsProps) {
|
|
|
25
25
|
const filteredData = folderData.filter(item => item.kind === 'MdxPage' && item.route.includes(`${route}/`))
|
|
26
26
|
|
|
27
27
|
return (
|
|
28
|
-
<
|
|
28
|
+
<Stack direction="vertical" padding="none" gap="spacious">
|
|
29
29
|
{filteredData.map((item: DocsItem) => {
|
|
30
|
-
if (item.kind !== 'MdxPage') return null
|
|
30
|
+
if (item.kind !== 'MdxPage' || !item.frontMatter) return null
|
|
31
|
+
|
|
31
32
|
return (
|
|
32
|
-
<
|
|
33
|
-
<
|
|
34
|
-
<
|
|
35
|
-
{item.frontMatter
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
</Grid.Column>
|
|
33
|
+
<Stack direction="vertical" padding="none" gap="condensed" key={item.frontMatter.title}>
|
|
34
|
+
<Heading as="h2" size="6" className={styles.heading}>
|
|
35
|
+
<Link href={item.route} legacyBehavior passHref>
|
|
36
|
+
{item.frontMatter.title}
|
|
37
|
+
</Link>
|
|
38
|
+
</Heading>
|
|
39
|
+
|
|
40
|
+
{item.frontMatter.description && <Text as="p">{item.frontMatter.description}</Text>}
|
|
41
|
+
</Stack>
|
|
42
42
|
)
|
|
43
43
|
})}
|
|
44
|
-
</
|
|
44
|
+
</Stack>
|
|
45
45
|
)
|
|
46
46
|
}
|
|
@@ -54,6 +54,8 @@ export function TableOfContents({headings}: TableOfContentsProps) {
|
|
|
54
54
|
}
|
|
55
55
|
}, [depth2Headings])
|
|
56
56
|
|
|
57
|
+
if (!depth2Headings.length) return null
|
|
58
|
+
|
|
57
59
|
return (
|
|
58
60
|
<aside className={styles.wrapper}>
|
|
59
61
|
<Text as="p" size="100" variant="muted" weight="normal" className={styles.heading}>
|
package/css/prose.module.css
CHANGED
|
@@ -224,6 +224,10 @@
|
|
|
224
224
|
background-color: var(--base-color-scale-indigo-0);
|
|
225
225
|
}
|
|
226
226
|
|
|
227
|
+
[data-color-mode='dark'] .Prose code {
|
|
228
|
+
background-color: var(--base-color-scale-indigo-9);
|
|
229
|
+
}
|
|
230
|
+
|
|
227
231
|
/* ---------------------------------------------------------- */
|
|
228
232
|
/* 8. Images */
|
|
229
233
|
/* ---------------------------------------------------------- */
|