Skip to content

Commit ba89dc9

Browse files
sfredsfred
committed
Initial commit
0 parents  commit ba89dc9

15 files changed

+10256
-0
lines changed

‎.gitignore

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
.DS_Store
2+
node_modules/
3+
.cache/
4+
public
5+
src/gatsby-types.d.ts

‎README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# website
2+
3+
A personal website for @sfred

‎gatsby-browser.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import "./src/styles/global.css";

‎gatsby-config.ts

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import type { GatsbyConfig } from "gatsby";
2+
3+
const config: GatsbyConfig = {
4+
siteMetadata: {
5+
title: `sfr.io`,
6+
siteUrl: `https://sfr.io`,
7+
},
8+
graphqlTypegen: true,
9+
plugins: [
10+
"gatsby-plugin-postcss",
11+
{
12+
resolve: "gatsby-source-filesystem",
13+
options: {
14+
name: "pages",
15+
path: "./src/pages/",
16+
},
17+
__key: "pages",
18+
},
19+
],
20+
};
21+
22+
export default config;

‎package.json

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
{
2+
"name": "sfr.io",
3+
"version": "1.0.0",
4+
"private": true,
5+
"description": "sfr.io",
6+
"author": "Sam Frederick",
7+
"keywords": [
8+
"gatsby"
9+
],
10+
"scripts": {
11+
"develop": "gatsby develop",
12+
"start": "gatsby develop",
13+
"build": "gatsby build",
14+
"serve": "gatsby serve",
15+
"clean": "gatsby clean",
16+
"typecheck": "tsc --noEmit"
17+
},
18+
"dependencies": {
19+
"autoprefixer": "^10.4.8",
20+
"clsx": "^1.2.1",
21+
"gatsby": "^4.22.1",
22+
"gatsby-plugin-postcss": "^5.22.0",
23+
"gatsby-source-filesystem": "^4.22.0",
24+
"postcss": "^8.4.16",
25+
"react": "^18.1.0",
26+
"react-dom": "^18.1.0"
27+
},
28+
"devDependencies": {
29+
"@cloudflare/workers-types": "^3.16.0",
30+
"@types/node": "^17.0.45",
31+
"@types/react": "^18.0.17",
32+
"@types/react-dom": "^18.0.6",
33+
"prettier": "^2.7.1",
34+
"tailwindcss": "^3.1.8",
35+
"typescript": "^4.8.2",
36+
"wrangler": "2.0.29"
37+
}
38+
}

‎postcss.config.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
module.exports = {
2+
plugins: {
3+
tailwindcss: {},
4+
autoprefixer: {},
5+
},
6+
};

‎src/components/Container.tsx

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import React from "react";
2+
import clsx from "clsx";
3+
4+
interface ContainerProps {
5+
className?: string;
6+
children: React.ReactNode;
7+
}
8+
9+
const OuterContainer = React.forwardRef<HTMLInputElement, ContainerProps>(
10+
function OuterContainer(
11+
{ className, children, ...props }: ContainerProps,
12+
ref
13+
) {
14+
return (
15+
<div ref={ref} className={clsx("sm:px-8", className)} {...props}>
16+
<div className="mx-auto max-w-7xl lg:px-8">{children}</div>
17+
</div>
18+
);
19+
}
20+
);
21+
22+
const InnerContainer = React.forwardRef<HTMLInputElement, ContainerProps>(
23+
function InnerContainer(
24+
{ className, children, ...props }: ContainerProps,
25+
ref
26+
) {
27+
return (
28+
<div
29+
ref={ref}
30+
className={clsx("relative px-4 sm:px-8 lg:px-12", className)}
31+
{...props}
32+
>
33+
<div className="mx-auto max-w-2xl lg:max-w-5xl">{children}</div>
34+
</div>
35+
);
36+
}
37+
);
38+
39+
export const Container = React.forwardRef<HTMLInputElement, ContainerProps>(
40+
function Container({ children, ...props }: ContainerProps, ref) {
41+
return (
42+
<OuterContainer ref={ref} {...props}>
43+
<InnerContainer>{children}</InnerContainer>
44+
</OuterContainer>
45+
);
46+
}
47+
);

‎src/components/Layout.tsx

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import * as React from "react";
2+
import { Link } from "gatsby";
3+
4+
interface LayoutProps {
5+
children: React.ReactNode;
6+
}
7+
8+
const Layout = ({ children }: LayoutProps) => {
9+
return (
10+
<>
11+
<div className="fixed inset-0 flex justify-center sm:px-8">
12+
<div className="flex w-full max-w-7xl lg:px-8">
13+
<div className="w-full bg-white ring-1 ring-zinc-100 dark:bg-zinc-900 dark:ring-zinc-300/20" />
14+
</div>
15+
</div>
16+
<div className="relative">
17+
<main>{children}</main>
18+
</div>
19+
</>
20+
);
21+
};
22+
export default Layout;

‎src/components/SocialIcons.tsx

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import React from "react";
2+
3+
interface SocialIconProps {
4+
href: string;
5+
}
6+
export function GitHubIcon({ href }: SocialIconProps) {
7+
return (
8+
<a href={href} className="group -m-1 p-1">
9+
<svg
10+
className="h-6 w-6 fill-zinc-500 transition group-hover:fill-zinc-600 dark:fill-zinc-400 dark:group-hover:fill-zinc-300"
11+
viewBox="0 0 24 24"
12+
aria-hidden="true"
13+
>
14+
<path
15+
fillRule="evenodd"
16+
clipRule="evenodd"
17+
d="M12 2C6.475 2 2 6.588 2 12.253c0 4.537 2.862 8.369 6.838 9.727.5.09.687-.218.687-.487 0-.243-.013-1.05-.013-1.91C7 20.059 6.35 18.957 6.15 18.38c-.113-.295-.6-1.205-1.025-1.448-.35-.192-.85-.667-.013-.68.788-.012 1.35.744 1.538 1.051.9 1.551 2.338 1.116 2.912.846.088-.666.35-1.115.638-1.371-2.225-.256-4.55-1.14-4.55-5.062 0-1.115.387-2.038 1.025-2.756-.1-.256-.45-1.307.1-2.717 0 0 .837-.269 2.75 1.051.8-.23 1.65-.346 2.5-.346.85 0 1.7.115 2.5.346 1.912-1.333 2.75-1.05 2.75-1.05.55 1.409.2 2.46.1 2.716.637.718 1.025 1.628 1.025 2.756 0 3.934-2.337 4.806-4.562 5.062.362.32.675.936.675 1.897 0 1.371-.013 2.473-.013 2.82 0 .268.188.589.688.486a10.039 10.039 0 0 0 4.932-3.74A10.447 10.447 0 0 0 22 12.253C22 6.588 17.525 2 12 2Z"
18+
/>
19+
</svg>
20+
</a>
21+
);
22+
}
23+
24+
export function LinkedInIcon({ href }: SocialIconProps) {
25+
return (
26+
<a href={href} className="group -m-1 p-1">
27+
<svg
28+
className="h-6 w-6 fill-zinc-500 transition group-hover:fill-zinc-600 dark:fill-zinc-400 dark:group-hover:fill-zinc-300"
29+
viewBox="0 0 24 24"
30+
>
31+
<path d="M18.335 18.339H15.67v-4.177c0-.996-.02-2.278-1.39-2.278-1.389 0-1.601 1.084-1.601 2.205v4.25h-2.666V9.75h2.56v1.17h.035c.358-.674 1.228-1.387 2.528-1.387 2.7 0 3.2 1.778 3.2 4.091v4.715zM7.003 8.575a1.546 1.546 0 01-1.548-1.549 1.548 1.548 0 111.547 1.549zm1.336 9.764H5.666V9.75H8.34v8.589zM19.67 3H4.329C3.593 3 3 3.58 3 4.297v15.406C3 20.42 3.594 21 4.328 21h15.338C20.4 21 21 20.42 21 19.703V4.297C21 3.58 20.4 3 19.666 3h.003z" />
32+
</svg>
33+
</a>
34+
);
35+
}
36+
37+
export function MailIcon({ href }: SocialIconProps) {
38+
return (
39+
<a href={href} className="group -m-1 p-1">
40+
<svg
41+
viewBox="0 0 24 24"
42+
aria-hidden="true"
43+
className="h-6 w-6 fill-zinc-500 transition group-hover:fill-zinc-600 dark:fill-zinc-400 dark:group-hover:fill-zinc-300"
44+
>
45+
<path
46+
fillRule="evenodd"
47+
d="M6 5a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h12a3 3 0 0 0 3-3V8a3 3 0 0 0-3-3H6Zm.245 2.187a.75.75 0 0 0-.99 1.126l6.25 5.5a.75.75 0 0 0 .99 0l6.25-5.5a.75.75 0 0 0-.99-1.126L12 12.251 6.245 7.187Z"
48+
/>
49+
</svg>
50+
</a>
51+
);
52+
}

‎src/pages/index.tsx

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import * as React from "react";
2+
import { Container } from "../components/Container";
3+
import Layout from "../components/Layout";
4+
import { GitHubIcon, LinkedInIcon, MailIcon } from "../components/SocialIcons";
5+
6+
export const Head = () => (
7+
<>
8+
<title>Sam Frederick | sfred@</title>
9+
<meta
10+
name="description"
11+
content="I'm Sam Fredreick. Solutions architect and software architect based out of Boston, MA."
12+
/>
13+
</>
14+
);
15+
16+
const IndexPage = () => {
17+
return (
18+
<Layout>
19+
<Container className="mt-16">
20+
<div className="max-w-2xl">
21+
<h1 className="text-4xl font-bold tracking-tight text-zinc-800 dark:text-zinc-100 sm:text-5xl">
22+
Hi 👋, I'm sfred@
23+
</h1>
24+
<div className="mt-6 flex gap-6"></div>
25+
26+
<p className="mt-6 text-base text-zinc-600 dark:text-zinc-400">
27+
Solutions architect, software designer, and founder based in Boston,
28+
currently working for AWS. Always on the lookout for new cocktail
29+
bars, music venues, and places to explore in the great outdoors.
30+
Feel free to reach out below.
31+
</p>
32+
</div>
33+
<div className="mt-6 flex gap-6">
34+
<GitHubIcon href="https://github.com/sfred" />
35+
<LinkedInIcon href="https://linkedin.com/in/sfredd" />
36+
<MailIcon href="mailto:[email protected]" />
37+
</div>
38+
</Container>
39+
</Layout>
40+
);
41+
};
42+
43+
export default IndexPage;

0 commit comments

Comments
 (0)