From d85095095dae2e1ca743d55dea0f25643faa85c0 Mon Sep 17 00:00:00 2001 From: Guusvanmeerveld Date: Thu, 28 Jul 2022 01:30:44 +0200 Subject: [PATCH] Completely reworked website --- .dockerignore | 9 - .env | 6 +- .eslintrc.json | 7 - .github/workflows/deploy.yml | 90 +- .gitignore | 52 +- .prettierignore | 12 - .prettierrc | 34 +- .vscode/settings.json | 4 +- Dockerfile | 34 - LICENSE | 21 - README.md | 11 +- docker-compose.yml | 7 - index.html | 20 + next-env.d.ts | 6 - next.config.js | 18 - package.json | 71 +- public/favicon.ico | Bin 3726 -> 0 bytes public/logo-dark.png | Bin 0 -> 4271 bytes public/logo-light.png | Bin 0 -> 7168 bytes public/manifest.json | 16 - public/robots.txt | 2 - public/topography.svg | 3 + src/components/CssBaseline.tsx | 24 + src/components/Dots.tsx | 290 + src/components/Footer.module.scss | 28 - src/components/Footer.tsx | 93 +- src/components/Header.tsx | 10 + src/components/Image.tsx | 11 + src/components/Layout.tsx | 20 +- src/components/Link.tsx | 7 + src/components/Navbar.module.scss | 65 - src/components/Navbar.tsx | 50 - src/components/Page.tsx | 25 - src/components/PageBuilder.module.scss | 21 - src/components/PageBuilder.tsx | 25 - src/components/Paragraph.tsx | 9 + src/components/Project.module.scss | 53 - src/components/Project.tsx | 38 - src/components/Project/Item.tsx | 153 + src/components/Project/List.tsx | 76 + src/interfaces/pinnedRepo.d.ts | 12 + src/interfaces/repo.d.ts | 112 + src/main.tsx | 10 + src/models/project.ts | 11 - src/models/svg.d.ts | 5 - src/pages/404.tsx | 21 +- src/pages/Index.module.scss | 29 - src/pages/_app.tsx | 19 - src/pages/app.tsx | 40 + src/pages/index.tsx | 222 +- src/preact.d.ts | 1 + src/styled.d.ts | 21 + src/styles/colors.scss | 5 - src/styles/fonts/montserrat.woff2 | Bin 19844 -> 0 bytes src/styles/global/body.scss | 7 - src/styles/global/button.scss | 4 - src/styles/global/input.scss | 18 - src/styles/global/link.scss | 3 - src/styles/global/table.scss | 4 - src/styles/globals.scss | 27 - src/styles/montserrat.css | 10 - src/svg/index.ts | 1 - src/svg/profile.svg | 1 - src/utils/socials.tsx | 34 + src/utils/theme.ts | 33 + src/vite-env.d.ts | 11 + tsconfig.json | 42 +- tsconfig.node.json | 9 + vite.config.ts | 48 + yarn.lock | 6900 ++++++++++-------------- 70 files changed, 3991 insertions(+), 5090 deletions(-) delete mode 100644 .dockerignore delete mode 100644 .eslintrc.json delete mode 100644 .prettierignore delete mode 100644 Dockerfile delete mode 100644 LICENSE delete mode 100644 docker-compose.yml create mode 100644 index.html delete mode 100644 next-env.d.ts delete mode 100644 next.config.js delete mode 100644 public/favicon.ico create mode 100644 public/logo-dark.png create mode 100644 public/logo-light.png delete mode 100644 public/manifest.json delete mode 100644 public/robots.txt create mode 100644 public/topography.svg create mode 100644 src/components/CssBaseline.tsx create mode 100644 src/components/Dots.tsx delete mode 100644 src/components/Footer.module.scss create mode 100644 src/components/Header.tsx create mode 100644 src/components/Image.tsx create mode 100644 src/components/Link.tsx delete mode 100644 src/components/Navbar.module.scss delete mode 100644 src/components/Navbar.tsx delete mode 100644 src/components/Page.tsx delete mode 100644 src/components/PageBuilder.module.scss delete mode 100644 src/components/PageBuilder.tsx create mode 100644 src/components/Paragraph.tsx delete mode 100644 src/components/Project.module.scss delete mode 100644 src/components/Project.tsx create mode 100644 src/components/Project/Item.tsx create mode 100644 src/components/Project/List.tsx create mode 100644 src/interfaces/pinnedRepo.d.ts create mode 100644 src/interfaces/repo.d.ts create mode 100644 src/main.tsx delete mode 100644 src/models/project.ts delete mode 100644 src/models/svg.d.ts delete mode 100644 src/pages/Index.module.scss delete mode 100644 src/pages/_app.tsx create mode 100644 src/pages/app.tsx create mode 100644 src/preact.d.ts create mode 100644 src/styled.d.ts delete mode 100644 src/styles/colors.scss delete mode 100644 src/styles/fonts/montserrat.woff2 delete mode 100644 src/styles/global/body.scss delete mode 100644 src/styles/global/button.scss delete mode 100644 src/styles/global/input.scss delete mode 100644 src/styles/global/link.scss delete mode 100644 src/styles/global/table.scss delete mode 100644 src/styles/globals.scss delete mode 100644 src/styles/montserrat.css delete mode 100644 src/svg/index.ts delete mode 100644 src/svg/profile.svg create mode 100644 src/utils/socials.tsx create mode 100644 src/utils/theme.ts create mode 100644 src/vite-env.d.ts create mode 100644 tsconfig.node.json create mode 100644 vite.config.ts diff --git a/.dockerignore b/.dockerignore deleted file mode 100644 index df04c1a..0000000 --- a/.dockerignore +++ /dev/null @@ -1,9 +0,0 @@ -** - -!next-i18next.config.js -!next.config.js -!tsconfig.json -!package.json -!yarn.lock -!public -!src \ No newline at end of file diff --git a/.env b/.env index 2c63e65..50e1332 100644 --- a/.env +++ b/.env @@ -1 +1,5 @@ -CDN_ENDPOINT=cdn.guusvanmeerveld.dev \ No newline at end of file +VITE_GITHUB_USERNAME=Guusvanmeerveld +VITE_TWITTER_USERNAME=Guusvanmeerveld +VITE_KOFI_USERNAME=Guusvanmeerveld +VITE_YOUTUBE_CHANNEL_ID=UCYuqpoMay5SezCBrA_HKVWQ +VITE_MASTODON_URL=https://c.im/web/@guusvanmeerveld \ No newline at end of file diff --git a/.eslintrc.json b/.eslintrc.json deleted file mode 100644 index bcc104d..0000000 --- a/.eslintrc.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "plugins": ["prettier"], - "extends": "next/core-web-vitals", - "rules": { - "prettier/prettier": "error" - } -} diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index 6f19dde..9707178 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -1,88 +1,42 @@ -name: Build / test application and deploy to Docker hub & Github Pages +name: "Deploy website" on: push: branches: - main + paths: + - src/** + - package.json + - yarn.lock + - tsconfig.* + - vite.config.ts + - .env + - index.html + - public jobs: - check: + deploy_to_pages: + name: Build pages runs-on: ubuntu-latest steps: - - name: Setup checkout + - name: Setup uses: actions/checkout@v2 - - name: Setup NodeJS v12 + - name: Setup Node.js uses: actions/setup-node@v2 with: - node-version: '12.x' + node-version: "16.x" + cache: "yarn" - - name: Install Dependencies + - name: Install NPM dependencies run: yarn install - - name: ESlint check - run: yarn lint + - name: Build client + run: yarn run build - pages: - needs: check - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v2 - - - name: Use Node.js - uses: actions/setup-node@v2 - with: - node-version: '12.x' - - - name: Install dependencies - run: yarn install - - - name: Export website - run: yarn export - env: - GITHUB_USERNAME: ${{ GITHUB_REPOSITORY_OWNER }} - - - name: Create .nojekyll file - run: touch out/.nojekyll - - - name: Deploy + - name: Deploy to pages uses: peaceiris/actions-gh-pages@v3 with: github_token: ${{ secrets.GITHUB_TOKEN }} - publish_dir: out - - docker: - needs: check - runs-on: ubuntu-latest - steps: - - name: Setup checkout - uses: actions/checkout@v2 - - - name: Login to Docker Hub - uses: docker/login-action@v1.10.0 - with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} - - - name: Set up Docker Buildx - uses: docker/setup-buildx-action@v1 - - - name: Cache Docker layers - uses: actions/cache@v2 - with: - path: /tmp/.buildx-cache - key: ${{ runner.os }}-buildx-${{ github.sha }} - restore-keys: | - ${{ runner.os }}-buildx- - - - name: Build and push - uses: docker/build-push-action@v2 - with: - push: true - tags: guusvanmeerveld/portfolio:latest - cache-from: type=local,src=/tmp/.buildx-cache - cache-to: type=local,dest=/tmp/.buildx-cache - builder: ${{ steps.buildx.outputs.name }} - - - name: Image digest - run: echo ${{ steps.docker_build.outputs.digest }} + publish_dir: ./dist + cname: guusvanmeerveld.dev diff --git a/.gitignore b/.gitignore index e3b3fe7..a547bf3 100644 --- a/.gitignore +++ b/.gitignore @@ -1,34 +1,24 @@ -# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. - -# dependencies -/node_modules -/.pnp -.pnp.js - -# testing -/coverage - -# next.js -/.next/ -/out/ - -# production -/build - -# misc -.DS_Store -*.pem - -# debug +# Logs +logs +*.log npm-debug.log* yarn-debug.log* yarn-error.log* - -# local env files -.env.local -.env.development.local -.env.test.local -.env.production.local - -# vercel -.vercel \ No newline at end of file +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/.prettierignore b/.prettierignore deleted file mode 100644 index c12154c..0000000 --- a/.prettierignore +++ /dev/null @@ -1,12 +0,0 @@ -dist -node_modules -README.md -.vscode -yarn.lock -package-lock.json -LICENSE -.env -.prettierrc -.next -next-env.d.ts -out \ No newline at end of file diff --git a/.prettierrc b/.prettierrc index 8e97d94..de0f127 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,9 +1,27 @@ { - "trailingComma": "es5", - "useTabs": true, - "semi": true, - "singleQuote": true, - "tabWidth": 2, - "printWidth": 100, - "arrowParens": "always" -} \ No newline at end of file + "trailingComma": "none", + "useTabs": true, + "semi": true, + "printWidth": 80, + "arrowParens": "always", + "importOrderSeparation": true, + "importOrder": [ + "@rollup/.*", + "rollup-.*", + "^..?/.*", + "^use-local-storage-state$", + "^styled-components$", + "^react.*", + "^preact$", + "^preact.*", + "^axios.*", + "^@src/.*", + "^@models/.*", + "^@interfaces/.*", + "^@styles/.*", + "^@shared/.*", + "^@utils/.*", + "^@components/.*", + "^@svg/.*" + ] +} diff --git a/.vscode/settings.json b/.vscode/settings.json index f9287c4..ff24a05 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,3 +1,3 @@ { - "prettier.configPath": ".prettierrc" -} \ No newline at end of file + "prettier.configPath": ".prettierrc" +} diff --git a/Dockerfile b/Dockerfile deleted file mode 100644 index a43bc57..0000000 --- a/Dockerfile +++ /dev/null @@ -1,34 +0,0 @@ - -FROM node:12-alpine AS deps - -WORKDIR /app -COPY package.json yarn.lock ./ -RUN yarn install --frozen-lockfile - -FROM node:12-alpine AS builder -WORKDIR /app -COPY . . -COPY --from=deps /app/node_modules ./node_modules -ENV NEXT_TELEMETRY_DISABLED 1; -RUN yarn build && yarn install --production --ignore-scripts --prefer-offline - -FROM node:12-alpine AS runner -WORKDIR /app - -ENV NODE_ENV production - -RUN addgroup -g 1001 -S nodejs -RUN adduser -S nextjs -u 1001 - -COPY --from=builder /app/next.config.js ./ -COPY --from=builder /app/next-i18next.config.js ./ -COPY --from=builder /app/public ./public -COPY --from=builder --chown=nextjs:nodejs /app/.next ./.next -COPY --from=builder /app/node_modules ./node_modules -COPY --from=builder /app/package.json ./package.json - -USER nextjs - -EXPOSE 3000 - -CMD ["yarn", "start"] diff --git a/LICENSE b/LICENSE deleted file mode 100644 index 3f8d60a..0000000 --- a/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -MIT License - -Copyright (c) 2021 Guus van Meerveld - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. diff --git a/README.md b/README.md index 2fe0b3e..fa6cf43 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,5 @@ -

Portfolio

-

- - - -

\ No newline at end of file +# Portfolio + +This is my portfolio website to show off all of my projects and provide my socials. + +It's build using Preact and Styled-Components and uses Vite as its build tool. diff --git a/docker-compose.yml b/docker-compose.yml deleted file mode 100644 index e10d2ca..0000000 --- a/docker-compose.yml +++ /dev/null @@ -1,7 +0,0 @@ -version: '3' - -services: - app: - container_name: portfolio - build: . - env_file: .env diff --git a/index.html b/index.html new file mode 100644 index 0000000..b2597d9 --- /dev/null +++ b/index.html @@ -0,0 +1,20 @@ + + + + + + + Guus' Portfolio + + + +
+ + + + diff --git a/next-env.d.ts b/next-env.d.ts deleted file mode 100644 index 9bc3dd4..0000000 --- a/next-env.d.ts +++ /dev/null @@ -1,6 +0,0 @@ -/// -/// -/// - -// NOTE: This file should not be edited -// see https://nextjs.org/docs/basic-features/typescript for more information. diff --git a/next.config.js b/next.config.js deleted file mode 100644 index c737472..0000000 --- a/next.config.js +++ /dev/null @@ -1,18 +0,0 @@ -// @ts-check - -/** - * @type {import('next').NextConfig} - */ -module.exports = { - images: { - loader: 'imgix', - path: process.env.IMGIX_PATH || 'https://guusvanmeerveld.imgix.net', - }, - env: { - CDN_ENDPOINT: process.env.CDN_ENDPOINT, - }, - webpack: (config) => { - config.module.rules.push({ test: /\.svg$/, use: ['@svgr/webpack'] }); - return config; - }, -}; diff --git a/package.json b/package.json index 88ddaf5..42033f4 100644 --- a/package.json +++ b/package.json @@ -1,36 +1,39 @@ { - "name": "portfolio", - "version": "0.1.0", - "private": true, - "scripts": { - "dev": "next dev", - "build": "next build", - "export": "next build && next export", - "start": "next start", - "prettify": "prettier --write .", - "lint": "next lint" - }, - "dependencies": { - "axios": "^0.21.4", - "chalk": "^4.1.2", - "milligram": "^1.4.1", - "next": "^11.1.2", - "next-themes": "^0.0.15", - "react": "^17.0.2", - "react-dom": "^17.0.2", - "react-icons": "^4.2.0", - "sass": "^1.42.1", - "sharp": "^0.29.1", - "swr": "^1.0.1" - }, - "devDependencies": { - "@svgr/webpack": "^5.5.0", - "@types/node": "^15.6.1", - "@types/react": "^17.0.6", - "eslint": "^7.27.0", - "eslint-config-next": "11.1.2", - "eslint-plugin-prettier": "^3.4.0", - "prettier": "^2.3.0", - "typescript": "^4.4.3" - } + "name": "portfolio", + "private": true, + "version": "0.1.0", + "type": "module", + "scripts": { + "format": "prettier src --write", + "dev": "vite", + "build": "tsc && vite build", + "preview": "vite preview" + }, + "dependencies": { + "@fontsource/montserrat": "^4.5.11", + "@fontsource/prompt": "^4.5.8", + "@tanstack/react-query": "^4.0.10", + "@tanstack/react-query-devtools": "^4.0.10", + "axios": "^0.27.2", + "bootstrap": "^5.2.0", + "preact": "^10.9.0", + "react-bootstrap": "^2.4.0", + "react-icons": "^4.4.0", + "react-router-dom": "6", + "react-spring": "^9.5.2", + "reset-css": "^5.0.1", + "styled-components": "^5.3.5", + "use-local-storage-state": "^18.1.0", + "vite-plugin-imagemin": "^0.6.1" + }, + "devDependencies": { + "@preact/preset-vite": "^2.3.0", + "@rollup/plugin-alias": "^3.1.9", + "@trivago/prettier-plugin-sort-imports": "^3.3.0", + "@types/styled-components": "^5.1.25", + "prettier": "^2.7.1", + "typescript": "^4.6.4", + "vite": "^3.0.0", + "vite-tsconfig-paths": "^3.5.0" + } } diff --git a/public/favicon.ico b/public/favicon.ico deleted file mode 100644 index 5fae4327885e09929712c390e78e9337742a7f16..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 3726 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 diff --git a/public/logo-dark.png b/public/logo-dark.png new file mode 100644 index 0000000000000000000000000000000000000000..3d02b3449865acbd8cd4d2f22e0940e17bb302e2 GIT binary patch literal 4271 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 literal 0 HcmV?d00001 diff --git a/public/logo-light.png b/public/logo-light.png new file mode 100644 index 0000000000000000000000000000000000000000..e18529505984d686f1763ce1ddba7487fd5e60d3 GIT binary patch literal 7168 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 J%$9QQe*mlBuu1>` literal 0 HcmV?d00001 diff --git a/public/manifest.json b/public/manifest.json deleted file mode 100644 index 3faf295..0000000 --- a/public/manifest.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "short_name": "Porfolio", - "name": "Guus van Meerveld's portfolio", - "icons": [ - { - "src": "/favicon.ico", - "type": "image/png", - "sizes": "192x192" - } - ], - "background_color": "#FFFFFF", - "display": "standalone", - "scope": "/", - "theme_color": "#388e3c", - "description": "A simple portfolio website to display my projects." -} diff --git a/public/robots.txt b/public/robots.txt deleted file mode 100644 index 6f27bb6..0000000 --- a/public/robots.txt +++ /dev/null @@ -1,2 +0,0 @@ -User-agent: * -Disallow: \ No newline at end of file diff --git a/public/topography.svg b/public/topography.svg new file mode 100644 index 0000000..dbaa571 --- /dev/null +++ b/public/topography.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/src/components/CssBaseline.tsx b/src/components/CssBaseline.tsx new file mode 100644 index 0000000..9175c6c --- /dev/null +++ b/src/components/CssBaseline.tsx @@ -0,0 +1,24 @@ +import { createGlobalStyle } from "styled-components"; + +const Baseline = createGlobalStyle` + body { + color: ${({ theme }) => theme.palette.text.primary}; + background-color: ${({ theme }) => theme.palette.background.primary}; + font-family: "Montserrat", sans-serif; + + background-image: url("/topography.svg"); + background-repeat: repeat; + } + + a { + color: ${({ theme }) => theme.palette.text.primary}; + text-decoration: none; + :hover { + color: ${({ theme }) => theme.palette.text.secondary}; + } + } +`; + +const CssBaseline = Baseline as () => JSX.Element; + +export default CssBaseline; diff --git a/src/components/Dots.tsx b/src/components/Dots.tsx new file mode 100644 index 0000000..b49129d --- /dev/null +++ b/src/components/Dots.tsx @@ -0,0 +1,290 @@ +import styled, { useTheme } from "styled-components"; + +import { FunctionalComponent } from "preact"; + +const Container = styled.div` + width: 100%; + transform: ${(props) => (props.left ? "scale(-1, -1)" : "none")}; +`; + +const Dots: FunctionalComponent<{ + left?: boolean; +}> = ({ left }) => { + const theme = useTheme(); + + return ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +}; + +export default Dots; diff --git a/src/components/Footer.module.scss b/src/components/Footer.module.scss deleted file mode 100644 index d371e2b..0000000 --- a/src/components/Footer.module.scss +++ /dev/null @@ -1,28 +0,0 @@ -@import '../styles/colors.scss'; - -.body { - background-color: $bg-secondary; - border-top: 0.1rem solid $borders; - - padding: 3rem; -} - -.branding { - display: inline-block; - font-size: 2rem; - margin-left: 1rem; - vertical-align: top; -} - -.socials { - margin-left: 4rem; - display: inline-block; - height: 100%; - padding: 1rem 0; -} - -.socialLink { - height: 3rem; - width: 3rem; - margin-right: 2rem; -} diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx index 9d54e95..c067a9d 100644 --- a/src/components/Footer.tsx +++ b/src/components/Footer.tsx @@ -1,50 +1,61 @@ -import Link from 'next/link'; +import styled, { DefaultTheme } from "styled-components"; -import { FaTwitter, FaYoutube, FaCoffee, FaGithub } from 'react-icons/fa'; +import Col from "react-bootstrap/Col"; +import Container from "react-bootstrap/Container"; +import Row from "react-bootstrap/Row"; -import { FC } from 'react'; +import { FunctionalComponent } from "preact"; -import { ProfileImage } from '@svg/index'; +import socials from "@utils/socials"; -import styles from './Footer.module.scss'; +import Header from "@components/Header"; -const Footer: FC = () => { +const Body = styled.div` + background-color: ${({ theme }: { theme: DefaultTheme }) => + theme.palette.background.secondary}; + + border-top: 2px solid + ${({ theme }: { theme: DefaultTheme }) => theme.palette.border}; + padding: 2rem; +`; + +const ListHeader = styled(Header)` + font-size: 2rem; +`; + +const ListItem = styled.li` + font-size: 1.25rem; + margin-top: 1rem; +`; + +const ListItemIcon = styled.span` + margin-right: 1rem; +`; + +const Footer: FunctionalComponent = () => { return ( -
-
- -
- Guus van Meerveld
- © 2017 - {new Date().getFullYear()} -
-
- - - - - - - - - - - - - - - - - - - - -
-
-
+ + + + +
Guus van Meerveld
+ + + + + + + ); }; diff --git a/src/components/Header.tsx b/src/components/Header.tsx new file mode 100644 index 0000000..7c800ab --- /dev/null +++ b/src/components/Header.tsx @@ -0,0 +1,10 @@ +import styled from "styled-components"; + +const Header = styled.h1` + font-family: "Prompt", sans-serif; + margin-bottom: 1rem; + font-size: 3rem; + margin-bottom: ${(props) => (props.gutter ? "1rem" : "0")}; +`; + +export default Header; diff --git a/src/components/Image.tsx b/src/components/Image.tsx new file mode 100644 index 0000000..5e20208 --- /dev/null +++ b/src/components/Image.tsx @@ -0,0 +1,11 @@ +import styled from "styled-components"; + +const Image = styled.img.attrs(() => ({ draggable: false }))` + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -o-user-select: none; + user-select: none; +`; + +export default Image; diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index 3f46e59..931869e 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -1,14 +1,14 @@ -import { FC } from 'react'; +import { FunctionalComponent } from "preact"; -import Navbar from '@components/Navbar'; -import Footer from '@components/Footer'; +import Footer from "@components/Footer"; -const Layout: FC<{ children: JSX.Element | JSX.Element[] }> = ({ children }) => ( - <> - - {children} -