diff --git a/public/logo.svg b/public/logo.svg deleted file mode 100644 index 9dfc1c0..0000000 --- a/public/logo.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/app/app-content.styles.ts b/src/app/app-content.styles.ts index d250271..7b72ae0 100644 --- a/src/app/app-content.styles.ts +++ b/src/app/app-content.styles.ts @@ -30,11 +30,6 @@ export const HeroWrapper = styled.div` } ` -export const HeroImageWrapper = styled.img` - width: 200px; - height: 200px; -` - export const SocialsWrapper = styled.div` display: flex; margin: 4px; diff --git a/src/app/app-content.tsx b/src/app/app-content.tsx deleted file mode 100644 index 81cb923..0000000 --- a/src/app/app-content.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import { useTheme } from 'styled-components'; -import { MarkdownPage, Pages } from '../components/page'; -import { Socials } from '../components/socials'; -import { socials } from '../config'; -import { Divider, HeroImageWrapper, HeroWrapper, HomeWrapper, SocialsWrapper } from './app-content.styles'; - -export const AppContent = () => { - const heroImageUrl = `${process.env.PUBLIC_URL}/logo192.png` - const theme = useTheme(); - - return ( - - - - - - - - - - - - - - - - - - ); -} diff --git a/src/app/app.tsx b/src/app/app.tsx index 4ce194d..47008d3 100644 --- a/src/app/app.tsx +++ b/src/app/app.tsx @@ -1,8 +1,40 @@ -import { ThemeProvider } from "styled-components"; +import { ThemeProvider, useTheme } from "styled-components"; import { GlobalReset, GlobalStyle } from "../components/global-style"; import { createTheme } from "../theme/theme"; -import { AppContent } from "./app-content"; +import { Pages, MarkdownPage } from "../components/page"; +import { Socials } from "../components/socials"; +import { config } from "../config"; +import { HomeWrapper, HeroWrapper, Divider, SocialsWrapper } from "./app-content.styles"; +const AppContent = () => { + const theme = useTheme(); + + const { logo: Logo, socials } = config; + + return ( + + + + + + + + + + + + + + + + + + ); +} + export const App = () => { const mode = 'dark'; const theme = createTheme(mode); diff --git a/public/github.svg b/src/assets/github.svg similarity index 100% rename from public/github.svg rename to src/assets/github.svg diff --git a/public/linkedin.svg b/src/assets/linkedin.svg similarity index 100% rename from public/linkedin.svg rename to src/assets/linkedin.svg diff --git a/src/assets/logo.mini.svg b/src/assets/logo.mini.svg new file mode 100644 index 0000000..cdd5166 --- /dev/null +++ b/src/assets/logo.mini.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/src/assets/logo.svg b/src/assets/logo.svg new file mode 100644 index 0000000..94901c2 --- /dev/null +++ b/src/assets/logo.svg @@ -0,0 +1,43 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/components/socials/socials.tsx b/src/components/socials/socials.tsx index 308921e..35eff5c 100644 --- a/src/components/socials/socials.tsx +++ b/src/components/socials/socials.tsx @@ -1,6 +1,6 @@ import { useMemo } from 'react'; import styled from 'styled-components'; -import { Social } from '../../config/types'; +import { Social } from '../../types'; /** * The socials links take an array of socials and renders them as links diff --git a/src/config.ts b/src/config.ts new file mode 100644 index 0000000..d3fd1b9 --- /dev/null +++ b/src/config.ts @@ -0,0 +1,22 @@ +import { ReactComponent as GithubIcon } from './assets/github.svg'; +import { ReactComponent as LinkedInIcon } from './assets/linkedin.svg'; +import { ReactComponent as Logo } from './assets/logo.svg'; + +const config = { + logo: Logo, + socials: [ + { + name: 'GitHub', + url: 'https://github.com/petertonysmith94/', + icon: GithubIcon + }, + { + name: 'LinkedIn', + url: 'https://www.linkedin.com/in/petertonysmith/', + icon: LinkedInIcon + }, + ] +}; + + +export { config }; \ No newline at end of file diff --git a/src/config/index.ts b/src/config/index.ts deleted file mode 100644 index b46c1da..0000000 --- a/src/config/index.ts +++ /dev/null @@ -1,5 +0,0 @@ -import { socials } from './socials'; - -export { - socials -}; diff --git a/src/config/socials.ts b/src/config/socials.ts deleted file mode 100644 index 9b28495..0000000 --- a/src/config/socials.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { ReactComponent as GithubIcon } from '../assets/github.svg'; -import { ReactComponent as LinkedInIcon } from '../assets/linkedin.svg'; -import { Social } from './types'; - -export const socials: Array = [ - { - name: 'GitHub', - url: 'https://github.com/petertonysmith94/', - icon: GithubIcon - }, - { - name: 'LinkedIn', - url: 'https://www.linkedin.com/in/petertonysmith/', - icon: LinkedInIcon - }, -] \ No newline at end of file diff --git a/styled.d.ts b/src/styled.d.ts similarity index 55% rename from styled.d.ts rename to src/styled.d.ts index 6298e7d..1f13cfe 100644 --- a/styled.d.ts +++ b/src/styled.d.ts @@ -1,5 +1,5 @@ import type { CSSProp } from "styled-components"; -import type { Theme } from './src/theme/types'; +import type { Theme } from './theme/types'; declare module "styled-components" { export interface DefaultTheme extends Theme {} @@ -9,4 +9,9 @@ declare module "react" { interface DOMAttributes { css?: CSSProp; } +} + +declare module "*.svg" { + const content: React.FunctionComponent>; + export default content; } \ No newline at end of file diff --git a/src/config/types.ts b/src/types.ts similarity index 100% rename from src/config/types.ts rename to src/types.ts