create-murasaki 0.1.0 → 0.2.0
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/package.json +1 -1
- package/templates/default/package.json +1 -1
- package/templates/default/src/app/about/page.tsx +18 -0
- package/templates/default/src/{globals.css → app/globals.css} +21 -3
- package/templates/default/src/{layout.tsx → app/layout.tsx} +4 -4
- package/templates/default/src/app/page.tsx +18 -0
- package/templates/default/src/app.tsx +0 -11
package/package.json
CHANGED
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
// src/app/about/page.tsx — the "/about" route.
|
|
2
|
+
|
|
3
|
+
import { Link } from 'murasaki'
|
|
4
|
+
|
|
5
|
+
export default function AboutPage() {
|
|
6
|
+
return (
|
|
7
|
+
<main>
|
|
8
|
+
<h1>About 🦋</h1>
|
|
9
|
+
<p>
|
|
10
|
+
File-based routing: add <code>src/app/<name>/page.tsx</code> and
|
|
11
|
+
link to it with <code><Link href="/<name>" /></code>.
|
|
12
|
+
</p>
|
|
13
|
+
<nav className="links">
|
|
14
|
+
<Link href="/">← Back home</Link>
|
|
15
|
+
</nav>
|
|
16
|
+
</main>
|
|
17
|
+
)
|
|
18
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* src/globals.css — global styles. Edit me. */
|
|
1
|
+
/* src/app/globals.css — global styles. Edit me. */
|
|
2
2
|
|
|
3
3
|
:root { color-scheme: light dark; }
|
|
4
4
|
* { box-sizing: border-box; }
|
|
@@ -20,10 +20,10 @@ body {
|
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
22
|
|
|
23
|
-
main { text-align: center; padding: 40px; }
|
|
23
|
+
main { text-align: center; padding: 40px; max-width: 720px; }
|
|
24
24
|
|
|
25
25
|
h1 {
|
|
26
|
-
font-size:
|
|
26
|
+
font-size: 72px;
|
|
27
27
|
margin: 0;
|
|
28
28
|
background: linear-gradient(135deg, #5B21B6 0%, #A855F7 100%);
|
|
29
29
|
-webkit-background-clip: text;
|
|
@@ -43,3 +43,21 @@ code {
|
|
|
43
43
|
border-radius: 4px;
|
|
44
44
|
font-size: 0.9em;
|
|
45
45
|
}
|
|
46
|
+
|
|
47
|
+
.links {
|
|
48
|
+
margin-top: 32px;
|
|
49
|
+
display: flex;
|
|
50
|
+
gap: 16px;
|
|
51
|
+
justify-content: center;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.links a {
|
|
55
|
+
color: #A855F7;
|
|
56
|
+
text-decoration: none;
|
|
57
|
+
font-weight: 600;
|
|
58
|
+
border-bottom: 2px solid transparent;
|
|
59
|
+
padding: 4px 0;
|
|
60
|
+
transition: border-color 0.15s;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.links a:hover { border-bottom-color: #A855F7; }
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
// src/layout.tsx —
|
|
2
|
-
// Global styles live in src/globals.css (auto-injected by murasaki).
|
|
1
|
+
// src/app/layout.tsx — root layout. Wraps every route.
|
|
2
|
+
// Global styles live in src/app/globals.css (auto-injected by murasaki).
|
|
3
3
|
|
|
4
|
-
import type { Child } from 'murasaki/jsx'
|
|
5
4
|
import type { Metadata } from 'murasaki'
|
|
5
|
+
import type { Child } from 'murasaki/jsx'
|
|
6
6
|
|
|
7
7
|
export const metadata: Metadata = {
|
|
8
8
|
title: 'My Murasaki App',
|
|
@@ -13,7 +13,7 @@ export const metadata: Metadata = {
|
|
|
13
13
|
},
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
export default function
|
|
16
|
+
export default function RootLayout({ children }: { children?: Child }) {
|
|
17
17
|
return (
|
|
18
18
|
<html lang="en">
|
|
19
19
|
<head>
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
// src/app/page.tsx — the "/" route.
|
|
2
|
+
|
|
3
|
+
import { Link } from 'murasaki'
|
|
4
|
+
|
|
5
|
+
export default function HomePage() {
|
|
6
|
+
return (
|
|
7
|
+
<main>
|
|
8
|
+
<h1>Hello, Murasaki 🦋</h1>
|
|
9
|
+
<p>
|
|
10
|
+
This view lives in <code>src/app/page.tsx</code>.
|
|
11
|
+
</p>
|
|
12
|
+
<p className="hint">Edit the file and the window reloads instantly.</p>
|
|
13
|
+
<nav className="links">
|
|
14
|
+
<Link href="/about">About →</Link>
|
|
15
|
+
</nav>
|
|
16
|
+
</main>
|
|
17
|
+
)
|
|
18
|
+
}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
// src/app.tsx — your app. Edit me and the window reloads in place.
|
|
2
|
-
|
|
3
|
-
export default function App() {
|
|
4
|
-
return (
|
|
5
|
-
<main>
|
|
6
|
-
<h1>Hello, Murasaki 🦋</h1>
|
|
7
|
-
<p>This view lives in <code>src/app.tsx</code>.</p>
|
|
8
|
-
<p className="hint">Edit the file and the window reloads instantly.</p>
|
|
9
|
-
</main>
|
|
10
|
-
)
|
|
11
|
-
}
|