1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
import {
AdjustmentsIcon,
ArchiveIcon,
DesktopComputerIcon,
DownloadIcon,
ServerIcon,
} from "@heroicons/react/outline";
import { DetailedFeatureLink } from "./Feature";
import { CSSIcon, JSIcon, TSIcon } from "./Icons";
export const HydroRollTRPGFeatures = () => {
return (
<div className="grid grid-cols-1 mt-12 gap-x-6 gap-y-12 sm:grid-cols-2 lg:mt-16 lg:gap-x-8 lg:gap-y-12">
<DetailedFeatureLink
feature={{
Icon: JSIcon,
description: `Supports all ESNext features, Browserslist and top-level await.`,
name: "JavaScript",
}}
href="/TRPG/docs/features/javascript"
></DetailedFeatureLink>
<DetailedFeatureLink
feature={{
Icon: TSIcon,
description: (
<>
Supports TypeScript out of the box, including resolving{" "}
<code>paths</code> and <code>baseUrl</code>.
</>
),
name: "TypeScript",
}}
href="/TRPG/docs/features/typescript"
></DetailedFeatureLink>
<DetailedFeatureLink
feature={{
Icon: DownloadIcon,
description: (
<>
Supports <code>require</code>, <code>import</code>, dynamic
imports and more.
</>
),
name: "Imports",
}}
href="/TRPG/docs/features/imports"
></DetailedFeatureLink>
<DetailedFeatureLink
feature={{
Icon: DesktopComputerIcon,
description: `Our optimized dev server supports Hot Module Reloading (HMR) and Fast Refresh.`,
name: "Dev Server",
}}
href="/pack/docs/features/dev-server"
></DetailedFeatureLink>
<DetailedFeatureLink
feature={{
Icon: CSSIcon,
description: (
<>
Supports Global CSS, CSS Modules, postcss-nested and{" "}
<code>@import</code>.
</>
),
name: "CSS",
}}
href="/TRPG/docs/features/css"
></DetailedFeatureLink>
<DetailedFeatureLink
feature={{
Icon: ArchiveIcon,
description:
"Learn about Next.js, Svelte, Vue and React Server Components support.",
name: "Frameworks",
}}
href="/TRPG/docs/features/frameworks"
></DetailedFeatureLink>
<DetailedFeatureLink
feature={{
Icon: ServerIcon,
description: (
<>
Supports the <code>/public</code> directory, JSON imports, and
importing assets via ESM.
</>
),
name: "Static Assets",
}}
href="/TRPG/docs/features/static-assets"
></DetailedFeatureLink>
<DetailedFeatureLink
feature={{
Icon: AdjustmentsIcon,
description: (
<>
Supports environment variables via <code>.env</code>,{" "}
<code>.env.local</code>, and more.
</>
),
name: "Environment Variables",
}}
href="/TRPG/docs/features/environment-variables"
></DetailedFeatureLink>
</div>
);
};
|