Skip to content

Commit bfac725

Browse files
KiteniteKitenite
committed
Initial commit
0 parents  commit bfac725

18 files changed

+4959
-0
lines changed

‎.eslintrc.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "next/core-web-vitals"
3+
}

‎.gitignore

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
.yarn/install-state.gz
8+
9+
# testing
10+
/coverage
11+
12+
# next.js
13+
/.next/
14+
/out/
15+
16+
# production
17+
/build
18+
19+
# misc
20+
.DS_Store
21+
*.pem
22+
23+
# debug
24+
npm-debug.log*
25+
yarn-debug.log*
26+
yarn-error.log*
27+
28+
# local env files
29+
.env*.local
30+
31+
# vercel
32+
.vercel
33+
34+
# typescript
35+
*.tsbuildinfo
36+
next-env.d.ts
37+
38+
# vscode
39+
.vscode

‎README.md

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
# Onlook Starter Template
2+
3+
<p align="center">
4+
<img src="app/favicon.ico" />
5+
</p>
6+
7+
This is an [Onlook](https://onlook.dev/) project set up with [Next.js](https://nextjs.org/), [TailwindCSS](https://tailwindcss.com/) and [ShadCN](https://ui.shadcn.com).
8+
9+
## Getting Started
10+
11+
First, run the development server:
12+
13+
```bash
14+
npm run dev
15+
# or
16+
yarn dev
17+
# or
18+
pnpm dev
19+
# or
20+
bun dev
21+
```
22+
23+
Open [http://localhost:3000](http://localhost:3000) in Onlook to see the result.

‎app/favicon.ico

175 KB
Binary file not shown.

‎app/globals.css

+88
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;
4+
5+
:root {
6+
--foreground-rgb: 0, 0, 0;
7+
--background-start-rgb: 214, 219, 220;
8+
--background-end-rgb: 255, 255, 255;
9+
}
10+
11+
@media (prefers-color-scheme: dark) {
12+
:root {
13+
--foreground-rgb: 255, 255, 255;
14+
--background-start-rgb: 0, 0, 0;
15+
--background-end-rgb: 0, 0, 0;
16+
}
17+
}
18+
19+
@layer utilities {
20+
.text-balance {
21+
text-wrap: balance;
22+
}
23+
}
24+
25+
@layer base {
26+
:root {
27+
--background: 0 0% 100%;
28+
--foreground: 0 0% 3.9%;
29+
--card: 0 0% 100%;
30+
--card-foreground: 0 0% 3.9%;
31+
--popover: 0 0% 100%;
32+
--popover-foreground: 0 0% 3.9%;
33+
--primary: 0 0% 9%;
34+
--primary-foreground: 0 0% 98%;
35+
--secondary: 0 0% 96.1%;
36+
--secondary-foreground: 0 0% 9%;
37+
--muted: 0 0% 96.1%;
38+
--muted-foreground: 0 0% 45.1%;
39+
--accent: 0 0% 96.1%;
40+
--accent-foreground: 0 0% 9%;
41+
--destructive: 0 84.2% 60.2%;
42+
--destructive-foreground: 0 0% 98%;
43+
--border: 0 0% 89.8%;
44+
--input: 0 0% 89.8%;
45+
--ring: 0 0% 3.9%;
46+
--chart-1: 12 76% 61%;
47+
--chart-2: 173 58% 39%;
48+
--chart-3: 197 37% 24%;
49+
--chart-4: 43 74% 66%;
50+
--chart-5: 27 87% 67%;
51+
--radius: 0.5rem;
52+
}
53+
.dark {
54+
--background: 0 0% 3.9%;
55+
--foreground: 0 0% 98%;
56+
--card: 0 0% 3.9%;
57+
--card-foreground: 0 0% 98%;
58+
--popover: 0 0% 3.9%;
59+
--popover-foreground: 0 0% 98%;
60+
--primary: 0 0% 98%;
61+
--primary-foreground: 0 0% 9%;
62+
--secondary: 0 0% 14.9%;
63+
--secondary-foreground: 0 0% 98%;
64+
--muted: 0 0% 14.9%;
65+
--muted-foreground: 0 0% 63.9%;
66+
--accent: 0 0% 14.9%;
67+
--accent-foreground: 0 0% 98%;
68+
--destructive: 0 62.8% 30.6%;
69+
--destructive-foreground: 0 0% 98%;
70+
--border: 0 0% 14.9%;
71+
--input: 0 0% 14.9%;
72+
--ring: 0 0% 83.1%;
73+
--chart-1: 220 70% 50%;
74+
--chart-2: 160 60% 45%;
75+
--chart-3: 30 80% 55%;
76+
--chart-4: 280 65% 60%;
77+
--chart-5: 340 75% 55%;
78+
}
79+
}
80+
81+
@layer base {
82+
* {
83+
@apply border-border;
84+
}
85+
body {
86+
@apply bg-background text-foreground;
87+
}
88+
}

‎app/layout.tsx

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import type { Metadata } from "next";
2+
import { Inter } from "next/font/google";
3+
import "./globals.css";
4+
5+
const inter = Inter({ subsets: ["latin"] });
6+
7+
export const metadata: Metadata = {
8+
title: "My New App",
9+
description: "Generated by Onlook",
10+
};
11+
12+
export default function RootLayout({
13+
children,
14+
}: Readonly<{
15+
children: React.ReactNode;
16+
}>) {
17+
return (
18+
<html lang="en">
19+
<body className={inter.className}>{children}</body>
20+
</html>
21+
);
22+
}

‎app/page.tsx

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
2+
const NoiseOverlay = () => (
3+
<div
4+
className="fixed inset-0 pointer-events-none z-50 mix-blend-multiply"
5+
style={{
6+
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 1000 1000' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`,
7+
filter: 'contrast(120%) brightness(120%)',
8+
}}
9+
/>
10+
);
11+
12+
export default function Page() {
13+
return (
14+
<div className="w-full min-h-screen flex items-center justify-center bg-white relative overflow-hidden">
15+
<NoiseOverlay />
16+
<div className="text-center text-gray-900 p-8 relative z-10">
17+
<h1 className="text-5xl font-semibold mb-4 tracking-tight">
18+
Welcome to your app
19+
</h1>
20+
<p className="text-2xl text-gray-800 mb-8">
21+
Open this page in Onlook to start
22+
</p>
23+
</div>
24+
</div>
25+
);
26+
}

‎bun.lockb

146 KB
Binary file not shown.

‎components.json

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema.json",
3+
"style": "default",
4+
"rsc": true,
5+
"tsx": true,
6+
"tailwind": {
7+
"config": "tailwind.config.ts",
8+
"css": "app/globals.css",
9+
"baseColor": "neutral",
10+
"cssVariables": true,
11+
"prefix": ""
12+
},
13+
"aliases": {
14+
"components": "@/components",
15+
"utils": "@/lib/utils",
16+
"ui": "@/components/ui",
17+
"lib": "@/lib",
18+
"hooks": "@/hooks"
19+
}
20+
}

‎lib/utils.ts

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { clsx, type ClassValue } from "clsx"
2+
import { twMerge } from "tailwind-merge"
3+
4+
export function cn(...inputs: ClassValue[]) {
5+
return twMerge(clsx(inputs))
6+
}

‎next.config.mjs

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import path from "path";
2+
/** @type {import('next').NextConfig} */
3+
const nextConfig = {
4+
experimental: {
5+
swcPlugins: [["@onlook/nextjs", {
6+
root: path.resolve(".")
7+
}]]
8+
}
9+
};
10+
export default nextConfig;

0 commit comments

Comments
 (0)