@primer/doctocat-nextjs 0.0.3-rc.4b671a6 → 0.0.3
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
CHANGED
|
@@ -4,6 +4,8 @@
|
|
|
4
4
|
|
|
5
5
|
### Patch Changes
|
|
6
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
|
+
|
|
7
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
|
|
8
10
|
|
|
9
11
|
## 0.0.2
|
|
@@ -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
|
}
|