diff options
Diffstat (limited to 'subprojects/docs/src/pages/index.tsx')
-rw-r--r-- | subprojects/docs/src/pages/index.tsx | 92 |
1 files changed, 49 insertions, 43 deletions
diff --git a/subprojects/docs/src/pages/index.tsx b/subprojects/docs/src/pages/index.tsx index 5190b88b..25884336 100644 --- a/subprojects/docs/src/pages/index.tsx +++ b/subprojects/docs/src/pages/index.tsx | |||
@@ -13,6 +13,54 @@ import { useState } from 'react'; | |||
13 | import styles from './index.module.css'; | 13 | import styles from './index.module.css'; |
14 | import videoCover from './video-cover.webp?url'; | 14 | import videoCover from './video-cover.webp?url'; |
15 | 15 | ||
16 | function Hero() { | ||
17 | return ( | ||
18 | <header className={clsx('hero', 'hero--dark', styles['hero'])}> | ||
19 | <div className="container"> | ||
20 | <h1 className="hero__title">Refinery</h1> | ||
21 | <p className="hero__subtitle"> | ||
22 | An efficient graph solver for generating well-formed models | ||
23 | </p> | ||
24 | <div className={styles['buttons']}> | ||
25 | <Link | ||
26 | href="https://refinery.services/" | ||
27 | className={clsx( | ||
28 | 'button', | ||
29 | 'button--lg', | ||
30 | 'button--primary', | ||
31 | styles['button'], | ||
32 | )} | ||
33 | > | ||
34 | Try online | ||
35 | </Link> | ||
36 | <Link | ||
37 | to="/docs/docker" | ||
38 | className={clsx( | ||
39 | 'button', | ||
40 | 'button--lg', | ||
41 | 'button--secondary', | ||
42 | styles['button'], | ||
43 | )} | ||
44 | > | ||
45 | Try in Docker | ||
46 | </Link> | ||
47 | <Link | ||
48 | to="/docs/tutorials/file-system" | ||
49 | className={clsx( | ||
50 | 'button', | ||
51 | 'button--lg', | ||
52 | 'button--secondary', | ||
53 | styles['button'], | ||
54 | )} | ||
55 | > | ||
56 | Tutorial | ||
57 | </Link> | ||
58 | </div> | ||
59 | </div> | ||
60 | </header> | ||
61 | ); | ||
62 | } | ||
63 | |||
16 | function Video() { | 64 | function Video() { |
17 | const [started, setStarted] = useState(false); | 65 | const [started, setStarted] = useState(false); |
18 | return ( | 66 | return ( |
@@ -61,49 +109,7 @@ function Video() { | |||
61 | export default function Home() { | 109 | export default function Home() { |
62 | return ( | 110 | return ( |
63 | <Layout> | 111 | <Layout> |
64 | <header className={clsx('hero', 'hero--dark', styles['hero'])}> | 112 | <Hero /> |
65 | <div className="container"> | ||
66 | <h1 className="hero__title">Refinery</h1> | ||
67 | <p className="hero__subtitle"> | ||
68 | An efficient graph solver for generating well-formed models | ||
69 | </p> | ||
70 | <div className={styles['buttons']}> | ||
71 | <Link | ||
72 | href="https://refinery.services/" | ||
73 | className={clsx( | ||
74 | 'button', | ||
75 | 'button--lg', | ||
76 | 'button--primary', | ||
77 | styles['button'], | ||
78 | )} | ||
79 | > | ||
80 | Try online | ||
81 | </Link> | ||
82 | <Link | ||
83 | to="/docs/docker" | ||
84 | className={clsx( | ||
85 | 'button', | ||
86 | 'button--lg', | ||
87 | 'button--secondary', | ||
88 | styles['button'], | ||
89 | )} | ||
90 | > | ||
91 | Try in Docker | ||
92 | </Link> | ||
93 | <Link | ||
94 | to="/docs/tutorials/file-system" | ||
95 | className={clsx( | ||
96 | 'button', | ||
97 | 'button--lg', | ||
98 | 'button--secondary', | ||
99 | styles['button'], | ||
100 | )} | ||
101 | > | ||
102 | Tutorial | ||
103 | </Link> | ||
104 | </div> | ||
105 | </div> | ||
106 | </header> | ||
107 | <Video /> | 113 | <Video /> |
108 | </Layout> | 114 | </Layout> |
109 | ); | 115 | ); |