Skip to content

Commit fb187da

Browse files
valebearzottivalebearzotti
committed
Add Prettier configuration and VSCode settings; update styles and layout components
1 parent 3303806 commit fb187da

File tree

13 files changed

+232
-38
lines changed

13 files changed

+232
-38
lines changed

‎.prettierrc‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"singleQuote": false,
3+
"arrowParens": "always",
4+
"tabWidth": 2,
5+
"printWidth": 80,
6+
"trailingComma": "none",
7+
"endOfLine": "auto"
8+
}

‎.vscode/extensions.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"recommendations": [
3+
"tailwindcss.tailwindcss-intellisense",
4+
"esbenp.prettier-vscode"
5+
]
6+
}

‎.vscode/settings.json‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"editor.formatOnSave": true,
3+
"editor.defaultFormatter": "esbenp.prettier-vscode",
4+
"editor.codeActionsOnSave": {
5+
"source.fixAll.eslint": "explicit",
6+
"source.fixAll.stylelint": "explicit",
7+
"source.removeUnusedImports": "explicit",
8+
"source.organizeImports": "explicit"
9+
},
10+
"css.validate": false,
11+
"[css]": {
12+
"editor.formatOnSave": false
13+
},
14+
"tailwindCSS.classAttributes": [
15+
"class",
16+
"className",
17+
".*ClassName",
18+
"ngClass",
19+
".*Styles"
20+
],
21+
"[scss]": {
22+
"editor.defaultFormatter": "esbenp.prettier-vscode"
23+
}
24+
}

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
"dependencies": {
1212
"next": "15.2.4",
1313
"ogl": "^1.0.11",
14+
"prettier": "^3.5.3",
1415
"react": "^19.0.0",
1516
"react-dom": "^19.0.0"
1617
},

‎pnpm-lock.yaml‎

Lines changed: 10 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/app/globals.css‎

Lines changed: 49 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,67 @@
11
@import "tailwindcss";
22

33
:root {
4-
--background: #ffffff;
5-
--foreground: #171717;
4+
--background: #000000;
65
}
76

87
@theme inline {
98
--color-background: var(--background);
10-
--color-foreground: var(--foreground);
119
--font-sans: var(--font-geist-sans);
1210
--font-mono: var(--font-geist-mono);
1311

1412
--color-grey: #D9D9D9;
13+
14+
/* Fonts */
15+
--font-funnel: "Funnel Display", sans-serif;
16+
--font-sans: "Geist", sans-serif;
17+
--font-mono: "Geist Mono", monospace;
18+
19+
/* Breakpoints */
20+
--breakpoint-2md: 57rem;
1521
}
1622

17-
@media (prefers-color-scheme: dark) {
18-
:root {
19-
--background: #0a0a0a;
20-
--foreground: #ededed;
21-
}
23+
html {
24+
scrollbar-width: thin;
25+
scrollbar-color: var(--color-spiral-black) var(--color-spiral-grey);
2226
}
2327

2428
body {
2529
background: var(--background);
26-
color: var(--foreground);
27-
font-family: Arial, Helvetica, sans-serif;
30+
font-family: theme("fontFamily.sans");
31+
text-wrap: balance;
32+
text-rendering: optimizeLegibility;
33+
34+
u {
35+
text-decoration: none;
36+
}
2837
}
38+
39+
@layer utilities {
40+
.dashed-all {
41+
@apply relative after:absolute after:inset-0;
42+
/* Bottom dash */
43+
@apply after:bg-[linear-gradient(to_right,white_12px,transparent_4px)] after:bg-bottom after:bg-[length:16px_1px] after:bg-repeat-x;
44+
/* Top dash */
45+
@apply after:bg-[linear-gradient(to_right,white_12px,transparent_4px)_top] after:bg-[length:16px_1px] after:bg-repeat-x;
46+
/* Right dash */
47+
@apply after:bg-[linear-gradient(to_bottom,white_12px,transparent_4px)_right] after:bg-[length:1px_16px] after:bg-repeat-y;
48+
/* Left dash */
49+
@apply after:bg-[linear-gradient(to_bottom,white_12px,transparent_4px)_left] after:bg-[length:1px_16px] after:bg-repeat-y;
50+
}
51+
52+
.dashed-bottom {
53+
@apply relative after:absolute after:left-0 after:right-0 after:bottom-0 after:h-px after:bg-[length:16px_1px] after:bg-repeat-x after:bg-[linear-gradient(to_right,white_12px,transparent_4px)];
54+
}
55+
56+
.dashed-top {
57+
@apply relative before:absolute before:left-0 before:right-0 before:top-0 before:h-px before:bg-[length:16px_1px] before:bg-repeat-x before:bg-[linear-gradient(to_right,white_12px,transparent_4px)];
58+
}
59+
60+
.dashed-right {
61+
@apply relative after:absolute after:top-0 after:bottom-0 after:right-0 after:w-px after:bg-[length:1px_16px] after:bg-repeat-y after:bg-[linear-gradient(to_bottom,white_12px,transparent_4px)];
62+
}
63+
64+
.dashed-left {
65+
@apply relative before:absolute before:top-0 before:bottom-0 before:left-0 before:w-px before:bg-[length:1px_16px] before:bg-repeat-y before:bg-[linear-gradient(to_bottom,white_12px,transparent_4px)];
66+
}
67+
}

‎src/app/layout.tsx‎

Lines changed: 20 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,41 @@
1-
import type { Metadata } from "next";
2-
import { Geist, Geist_Mono } from "next/font/google";
1+
import { Footer } from "@/components/layout/footer";
2+
import { Header } from "@/components/layout/header";
3+
import { Funnel_Display, Geist, Geist_Mono } from "next/font/google";
34
import "./globals.css";
45

56
const geistSans = Geist({
67
variable: "--font-geist-sans",
7-
subsets: ["latin"],
8+
subsets: ["latin"]
89
});
910

1011
const geistMono = Geist_Mono({
1112
variable: "--font-geist-mono",
12-
subsets: ["latin"],
13+
subsets: ["latin"]
1314
});
1415

15-
export const metadata: Metadata = {
16-
title: "Create Next App",
17-
description: "Generated by create next app",
18-
};
16+
const funnelDisplay = Funnel_Display({
17+
weight: ["300"],
18+
variable: "--font-funnel-display",
19+
subsets: ["latin"]
20+
});
1921

20-
export default function RootLayout({
21-
children,
22+
export default async function RootLayout({
23+
children
2224
}: Readonly<{
2325
children: React.ReactNode;
2426
}>) {
2527
return (
2628
<html lang="en">
2729
<body
28-
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
30+
className={`${geistSans.variable} ${geistMono.variable} ${funnelDisplay.variable} antialiased`}
2931
>
30-
{children}
32+
<Header />
33+
<main className="w-full h-auto mx-auto">
34+
<div className="flex flex-col mx-auto max-w-[1920px] relative justify-center items-center overflow-clip">
35+
{children}
36+
</div>
37+
</main>
38+
<Footer />
3139
</body>
3240
</html>
3341
);

‎src/app/page.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { HeroASCII } from "@/components/hero";
22

33
export default function Home() {
44
return (
5-
<div className="h-screen w-screen relative">
5+
<div className="h-full w-full relative">
66
<HeroASCII />
77
</div>
88
);

‎src/assets/logo.svg‎

Lines changed: 17 additions & 0 deletions
Loading

‎src/assets/spiral.svg‎

Lines changed: 5 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)