Skip to content

Commit 16f08f1

Browse files
committed
initialize portfolio website with Next.js and Tailwind CSS
1 parent c98b694 commit 16f08f1

18 files changed

Lines changed: 6429 additions & 1 deletion

.gitignore

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.*
7+
.yarn/*
8+
!.yarn/patches
9+
!.yarn/plugins
10+
!.yarn/releases
11+
!.yarn/versions
12+
13+
# testing
14+
/coverage
15+
16+
# next.js
17+
/.next/
18+
/out/
19+
20+
# production
21+
/build
22+
23+
# misc
24+
.DS_Store
25+
*.pem
26+
27+
# debug
28+
npm-debug.log*
29+
yarn-debug.log*
30+
yarn-error.log*
31+
.pnpm-debug.log*
32+
33+
# env files (can opt-in for committing if needed)
34+
.env*
35+
36+
# vercel
37+
.vercel
38+
39+
# typescript
40+
*.tsbuildinfo
41+
next-env.d.ts
42+
43+
# IDE & editors
44+
.idea
45+
.vscode

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11
# suwe.github.io
2-
suwe.github.io A GitHub Pages repository for hosting my portfolio website. This repo contains the static front-end code, assets, and configuration needed to publish and maintain the site directly through GitHub Pages.
2+
suwe.github.io A GitHub Pages repository for hosting my portfolio website. This repo contains the static front-end code, assets, and configuration needed to publish and maintain the site directly through GitHub Pages.

app/globals.css

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
@import "tailwindcss";
2+
3+
:root {
4+
--background: #ffffff;
5+
--foreground: #171717;
6+
}
7+
8+
@media (prefers-color-scheme: dark) {
9+
:root {
10+
--background: #0a0a0a;
11+
--foreground: #ededed;
12+
}
13+
}
14+
15+
html,
16+
body {
17+
max-width: 100vw;
18+
overflow-x: hidden;
19+
}
20+
21+
body {
22+
color: var(--foreground);
23+
background: var(--background);
24+
font-family: Arial, Helvetica, sans-serif;
25+
-webkit-font-smoothing: antialiased;
26+
-moz-osx-font-smoothing: grayscale;
27+
}
28+
29+
* {
30+
box-sizing: border-box;
31+
padding: 0;
32+
margin: 0;
33+
}
34+
35+
a {
36+
color: inherit;
37+
text-decoration: none;
38+
}
39+
40+
@media (prefers-color-scheme: dark) {
41+
html {
42+
color-scheme: dark;
43+
}
44+
}

app/layout.js

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import "./globals.css";
2+
3+
export const metadata = {
4+
title: "Suwethan M | Software Engineer",
5+
description: "Portfolio of Suwethan M, software engineer \
6+
with 2 years of expertise in software development Java, Spring Boot, \
7+
React, and Node.js. Passionate about building scalable applications and \
8+
solving complex problems. Explore my projects and experience.",
9+
keywords: "Suwethan M, Software Engineer, Portfolio, Java, Spring Boot, React, Node.js, Software Development, \
10+
Scalable Applications, Problem Solving, Projects, Experience",
11+
icons: {
12+
icon: "/favicon.png",
13+
}
14+
};
15+
16+
export default function RootLayout({ children }) {
17+
return (
18+
<html lang="en">
19+
<body>
20+
{children}
21+
</body>
22+
</html>
23+
);
24+
}

app/page.js

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
export default function Home() {
2+
return (
3+
<>
4+
<header className="text-black">
5+
<div className="flex flex-col items-center justify-center min-h-screen bg-gray-100">
6+
<h1 className="text-3xl font-bold">Suwethan M</h1>
7+
<p className="text-lg text-gray-700">Software Engineer</p>
8+
<p className="mt-2 text-center max-w-md">
9+
Passionate about building scalable applications and solving complex problems.
10+
</p>
11+
</div>
12+
</header>
13+
</>
14+
);
15+
}

app/page.module.css

Lines changed: 167 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,167 @@
1+
.page {
2+
--gray-rgb: 0, 0, 0;
3+
--gray-alpha-200: rgba(var(--gray-rgb), 0.08);
4+
--gray-alpha-100: rgba(var(--gray-rgb), 0.05);
5+
6+
--button-primary-hover: #383838;
7+
--button-secondary-hover: #f2f2f2;
8+
9+
display: grid;
10+
grid-template-rows: 20px 1fr 20px;
11+
align-items: center;
12+
justify-items: center;
13+
min-height: 100svh;
14+
padding: 80px;
15+
gap: 64px;
16+
font-family: var(--font-geist-sans);
17+
}
18+
19+
@media (prefers-color-scheme: dark) {
20+
.page {
21+
--gray-rgb: 255, 255, 255;
22+
--gray-alpha-200: rgba(var(--gray-rgb), 0.145);
23+
--gray-alpha-100: rgba(var(--gray-rgb), 0.06);
24+
25+
--button-primary-hover: #ccc;
26+
--button-secondary-hover: #1a1a1a;
27+
}
28+
}
29+
30+
.main {
31+
display: flex;
32+
flex-direction: column;
33+
gap: 32px;
34+
grid-row-start: 2;
35+
}
36+
37+
.main ol {
38+
font-family: var(--font-geist-mono);
39+
padding-left: 0;
40+
margin: 0;
41+
font-size: 14px;
42+
line-height: 24px;
43+
letter-spacing: -0.01em;
44+
list-style-position: inside;
45+
}
46+
47+
.main li:not(:last-of-type) {
48+
margin-bottom: 8px;
49+
}
50+
51+
.main code {
52+
font-family: inherit;
53+
background: var(--gray-alpha-100);
54+
padding: 2px 4px;
55+
border-radius: 4px;
56+
font-weight: 600;
57+
}
58+
59+
.ctas {
60+
display: flex;
61+
gap: 16px;
62+
}
63+
64+
.ctas a {
65+
appearance: none;
66+
border-radius: 128px;
67+
height: 48px;
68+
padding: 0 20px;
69+
border: 1px solid transparent;
70+
transition:
71+
background 0.2s,
72+
color 0.2s,
73+
border-color 0.2s;
74+
cursor: pointer;
75+
display: flex;
76+
align-items: center;
77+
justify-content: center;
78+
font-size: 16px;
79+
line-height: 20px;
80+
font-weight: 500;
81+
}
82+
83+
a.primary {
84+
background: var(--foreground);
85+
color: var(--background);
86+
gap: 8px;
87+
}
88+
89+
a.secondary {
90+
border-color: var(--gray-alpha-200);
91+
min-width: 158px;
92+
}
93+
94+
.footer {
95+
grid-row-start: 3;
96+
display: flex;
97+
gap: 24px;
98+
}
99+
100+
.footer a {
101+
display: flex;
102+
align-items: center;
103+
gap: 8px;
104+
}
105+
106+
.footer img {
107+
flex-shrink: 0;
108+
}
109+
110+
/* Enable hover only on non-touch devices */
111+
@media (hover: hover) and (pointer: fine) {
112+
a.primary:hover {
113+
background: var(--button-primary-hover);
114+
border-color: transparent;
115+
}
116+
117+
a.secondary:hover {
118+
background: var(--button-secondary-hover);
119+
border-color: transparent;
120+
}
121+
122+
.footer a:hover {
123+
text-decoration: underline;
124+
text-underline-offset: 4px;
125+
}
126+
}
127+
128+
@media (max-width: 600px) {
129+
.page {
130+
padding: 32px;
131+
padding-bottom: 80px;
132+
}
133+
134+
.main {
135+
align-items: center;
136+
}
137+
138+
.main ol {
139+
text-align: center;
140+
}
141+
142+
.ctas {
143+
flex-direction: column;
144+
}
145+
146+
.ctas a {
147+
font-size: 14px;
148+
height: 40px;
149+
padding: 0 16px;
150+
}
151+
152+
a.secondary {
153+
min-width: auto;
154+
}
155+
156+
.footer {
157+
flex-wrap: wrap;
158+
align-items: center;
159+
justify-content: center;
160+
}
161+
}
162+
163+
@media (prefers-color-scheme: dark) {
164+
.logo {
165+
filter: invert();
166+
}
167+
}

eslint.config.mjs

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { dirname } from "path";
2+
import { fileURLToPath } from "url";
3+
import { FlatCompat } from "@eslint/eslintrc";
4+
5+
const __filename = fileURLToPath(import.meta.url);
6+
const __dirname = dirname(__filename);
7+
8+
const compat = new FlatCompat({
9+
baseDirectory: __dirname,
10+
});
11+
12+
const eslintConfig = [
13+
...compat.extends("next/core-web-vitals"),
14+
{
15+
ignores: [
16+
"node_modules/**",
17+
".next/**",
18+
"out/**",
19+
"build/**",
20+
"next-env.d.ts",
21+
],
22+
},
23+
];
24+
25+
export default eslintConfig;

jsconfig.json

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"compilerOptions": {
3+
"paths": {
4+
"@/*": ["./*"]
5+
}
6+
}
7+
}

next.config.mjs

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
/** @type {import('next').NextConfig} */
2+
const nextConfig = {};
3+
4+
export default nextConfig;

0 commit comments

Comments
 (0)