An experimental TypeSpec syntax for Lexicon
bla
+1
-64
-63
packages/website/src/components/Playground.tsx
-63
packages/website/src/components/Playground.tsx
···
1
-
export default function Playground() {
2
-
return (
3
-
<div
4
-
style={{
5
-
background: "white",
6
-
borderRadius: "12px",
7
-
boxShadow: "0 4px 6px rgba(0, 0, 0, 0.05)",
8
-
overflow: "hidden",
9
-
minHeight: "500px",
10
-
display: "flex",
11
-
alignItems: "center",
12
-
justifyContent: "center",
13
-
padding: "2rem",
14
-
color: "#64748b",
15
-
fontFamily: "system-ui, sans-serif",
16
-
}}
17
-
>
18
-
<div style={{ textAlign: "center", maxWidth: "600px" }}>
19
-
<h3
20
-
style={{
21
-
fontSize: "1.5rem",
22
-
marginBottom: "1rem",
23
-
color: "#1e293b",
24
-
fontWeight: 700,
25
-
}}
26
-
>
27
-
Try it in the Playground
28
-
</h3>
29
-
<p
30
-
style={{
31
-
fontSize: "1.125rem",
32
-
marginBottom: "2rem",
33
-
lineHeight: "1.6",
34
-
}}
35
-
>
36
-
Experience typelex with syntax highlighting, live compilation, and
37
-
instant Lexicon output.
38
-
</p>
39
-
<a
40
-
href="http://localhost:5174"
41
-
target="_blank"
42
-
rel="noopener noreferrer"
43
-
style={{
44
-
display: "inline-block",
45
-
padding: "0.875rem 2rem",
46
-
background:
47
-
"linear-gradient(135deg, #7a8ef7 0%, #9483f7 70%, #b87ed8 100%)",
48
-
color: "white",
49
-
textDecoration: "none",
50
-
borderRadius: "8px",
51
-
fontWeight: 700,
52
-
fontSize: "1.125rem",
53
-
boxShadow:
54
-
"0 2px 4px rgba(122, 142, 247, 0.35), 0 3px 6px rgba(0, 0, 0, 0.1)",
55
-
transition: "all 0.2s",
56
-
}}
57
-
>
58
-
Open Playground →
59
-
</a>
60
-
</div>
61
-
</div>
62
-
);
63
-
}
+1
-1
packages/website/src/pages/index.astro
+1
-1
packages/website/src/pages/index.astro
···
269
269
<div class="step-content">
270
270
<h3>Try the playground</h3>
271
271
<p class="step-description">Experiment with typelex in your browser before installing.</p>
272
-
<a href="http://localhost:5174" target="_blank" rel="noopener noreferrer" class="playground-button">
272
+
<a href="https://playground.typelex.org" target="_blank" rel="noopener noreferrer" class="playground-button">
273
273
Open Playground
274
274
</a>
275
275
</div>