mirror of https://github.com/MedzikUser/portfolio
rewrite to svelte
This commit is contained in:
parent
a35188e9b4
commit
f13432a250
|
|
@ -1,18 +0,0 @@
|
|||
{
|
||||
"extends": [
|
||||
"eslint:recommended",
|
||||
"next/core-web-vitals"
|
||||
],
|
||||
"rules": {
|
||||
"semi": [
|
||||
"warn",
|
||||
"never"
|
||||
],
|
||||
"no-unused-vars": [
|
||||
"warn"
|
||||
],
|
||||
"no-unused-expressions": [
|
||||
"warn"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -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*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# vercel
|
||||
.vercel
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"recommendations": ["svelte.svelte-vscode"]
|
||||
}
|
||||
21
LICENSE
21
LICENSE
|
|
@ -1,21 +0,0 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2022 Medzik
|
||||
|
||||
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.
|
||||
51
README.md
51
README.md
|
|
@ -1,11 +1,48 @@
|
|||
# [Medzik's website](https://medzik.xyz)
|
||||
# Svelte + TS + Vite
|
||||
|
||||
[![total-lines]](https://github.com/MedzikUser/portfolio)
|
||||
[![code-size]](https://github.com/MedzikUser/portfolio)
|
||||
This template should help get you started developing with Svelte and TypeScript in Vite.
|
||||
|
||||
[total-lines]: https://img.shields.io/tokei/lines/github/MedzikUser/portfolio?style=for-the-badge&logo=github&color=fede00
|
||||
[code-size]: https://img.shields.io/github/languages/code-size/MedzikUser/portfolio?style=for-the-badge&color=c8df52&logo=github
|
||||
## Recommended IDE Setup
|
||||
|
||||
|
||||
[VS Code](https://code.visualstudio.com/) + [Svelte](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode).
|
||||
|
||||
License: MIT
|
||||
## Need an official Svelte framework?
|
||||
|
||||
Check out [SvelteKit](https://github.com/sveltejs/kit#readme), which is also powered by Vite. Deploy anywhere with its serverless-first approach and adapt to various platforms, with out of the box support for TypeScript, SCSS, and Less, and easily-added support for mdsvex, GraphQL, PostCSS, Tailwind CSS, and more.
|
||||
|
||||
## Technical considerations
|
||||
|
||||
**Why use this over SvelteKit?**
|
||||
|
||||
- It brings its own routing solution which might not be preferable for some users.
|
||||
- It is first and foremost a framework that just happens to use Vite under the hood, not a Vite app.
|
||||
`vite dev` and `vite build` wouldn't work in a SvelteKit environment, for example.
|
||||
|
||||
This template contains as little as possible to get started with Vite + TypeScript + Svelte, while taking into account the developer experience with regards to HMR and intellisense. It demonstrates capabilities on par with the other `create-vite` templates and is a good starting point for beginners dipping their toes into a Vite + Svelte project.
|
||||
|
||||
Should you later need the extended capabilities and extensibility provided by SvelteKit, the template has been structured similarly to SvelteKit so that it is easy to migrate.
|
||||
|
||||
**Why `global.d.ts` instead of `compilerOptions.types` inside `jsconfig.json` or `tsconfig.json`?**
|
||||
|
||||
Setting `compilerOptions.types` shuts out all other types not explicitly listed in the configuration. Using triple-slash references keeps the default TypeScript setting of accepting type information from the entire workspace, while also adding `svelte` and `vite/client` type information.
|
||||
|
||||
**Why include `.vscode/extensions.json`?**
|
||||
|
||||
Other templates indirectly recommend extensions via the README, but this file allows VS Code to prompt the user to install the recommended extension upon opening the project.
|
||||
|
||||
**Why enable `allowJs` in the TS template?**
|
||||
|
||||
While `allowJs: false` would indeed prevent the use of `.js` files in the project, it does not prevent the use of JavaScript syntax in `.svelte` files. In addition, it would force `checkJs: false`, bringing the worst of both worlds: not being able to guarantee the entire codebase is TypeScript, and also having worse typechecking for the existing JavaScript. In addition, there are valid use cases in which a mixed codebase may be relevant.
|
||||
|
||||
**Why is HMR not preserving my local component state?**
|
||||
|
||||
HMR state preservation comes with a number of gotchas! It has been disabled by default in both `svelte-hmr` and `@sveltejs/vite-plugin-svelte` due to its often surprising behavior. You can read the details [here](https://github.com/rixo/svelte-hmr#svelte-hmr).
|
||||
|
||||
If you have state that's important to retain within a component, consider creating an external store which would not be replaced by HMR.
|
||||
|
||||
```ts
|
||||
// store.ts
|
||||
// An extremely simple external store
|
||||
import { writable } from 'svelte/store'
|
||||
export default writable(0)
|
||||
```
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
const colors = {
|
||||
primary: '#f2f0ed',
|
||||
background: '#080a0b',
|
||||
title: '#79A9F5',
|
||||
description: '#FBE698',
|
||||
}
|
||||
|
||||
export default colors
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
import styled from "styled-components"
|
||||
|
||||
export default styled.div`
|
||||
background-color: ${({ theme }) => theme.colors.background};
|
||||
color: ${({ theme }) => theme.colors.primary};
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
`
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
import styled from "styled-components"
|
||||
|
||||
export default styled.p`
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
text-align: center;
|
||||
`
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
import styled from "styled-components"
|
||||
|
||||
export default styled.footer``
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
import { createSvgIcon } from "@mui/material"
|
||||
|
||||
export default createSvgIcon(
|
||||
<path d="M19.229,6.012c-0.903-0.73-2.015-1.246-2.872-1.572c-0.307-0.117-0.653-0.076-0.923,0.111C15.162,4.737,15,5.045,15,5.374 C15,5.72,14.72,6,14.374,6c-1.573,0-3.176,0-4.749,0C9.28,6,9,5.72,9,5.375c0-0.329-0.162-0.638-0.433-0.824 C8.296,4.364,7.95,4.323,7.643,4.441c-0.86,0.329-1.978,0.85-2.894,1.59C3.831,6.882,2,11.861,2,16.165 c0,0.076,0.019,0.15,0.057,0.216c1.265,2.233,4.714,2.817,5.499,2.842c0.005,0.001,0.009,0.001,0.014,0.001 c0.139,0,0.286-0.056,0.351-0.18l0.783-1.485c-0.646-0.164-1.313-0.359-2.04-0.617c-0.521-0.185-0.792-0.757-0.607-1.277 s0.758-0.791,1.277-0.607c3.526,1.254,5.624,1.253,9.345-0.005c0.525-0.175,1.092,0.104,1.268,0.627 c0.177,0.523-0.104,1.091-0.627,1.268c-0.728,0.246-1.392,0.434-2.035,0.594l0.793,1.503c0.065,0.124,0.213,0.18,0.351,0.18 c0.005,0,0.009,0,0.014-0.001c0.786-0.025,4.235-0.61,5.499-2.843C21.981,16.315,22,16.241,22,16.164 C22,11.861,20.169,6.882,19.229,6.012z M9.04,13.988c-0.829,0-1.5-0.893-1.5-1.996c0-1.102,0.671-1.996,1.5-1.996 c0.832-0.11,1.482,0.893,1.5,1.996C10.54,13.095,9.869,13.988,9.04,13.988z M14.996,14.012c-0.829,0-1.5-0.895-1.5-2s0.671-2,1.5-2 s1.5,0.895,1.5,2S15.825,14.012,14.996,14.012z" />,
|
||||
'Discord',
|
||||
)
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
import { createSvgIcon } from "@mui/material"
|
||||
|
||||
export default createSvgIcon(
|
||||
<svg viewBox="0 0 50 50"><path d="M 38.011719 4 C 37.574219 3.996094 37.183594 4.273438 37.046875 4.691406 L 32.074219 20 L 17.925781 20 L 12.953125 4.691406 C 12.820313 4.289063 12.449219 4.011719 12.023438 4 C 11.597656 3.992188 11.214844 4.25 11.0625 4.648438 L 5.070313 20.640625 C 5.066406 20.640625 5.066406 20.644531 5.0625 20.648438 L 2.0625 28.648438 C 1.90625 29.070313 2.046875 29.542969 2.414063 29.808594 L 24.40625 45.800781 L 24.410156 45.808594 C 24.414063 45.808594 24.414063 45.808594 24.414063 45.8125 C 24.425781 45.820313 24.441406 45.828125 24.453125 45.835938 C 24.46875 45.84375 24.480469 45.855469 24.496094 45.863281 C 24.5 45.863281 24.5 45.867188 24.503906 45.867188 C 24.503906 45.867188 24.507813 45.871094 24.511719 45.871094 C 24.515625 45.875 24.519531 45.878906 24.527344 45.878906 C 24.53125 45.882813 24.539063 45.886719 24.542969 45.890625 C 24.5625 45.898438 24.585938 45.910156 24.609375 45.917969 C 24.609375 45.917969 24.609375 45.917969 24.609375 45.921875 C 24.632813 45.929688 24.65625 45.9375 24.675781 45.945313 C 24.679688 45.945313 24.679688 45.945313 24.683594 45.949219 C 24.699219 45.953125 24.714844 45.957031 24.734375 45.964844 C 24.742188 45.964844 24.75 45.96875 24.761719 45.96875 C 24.761719 45.972656 24.761719 45.972656 24.761719 45.96875 C 24.78125 45.976563 24.800781 45.980469 24.820313 45.984375 C 24.847656 45.988281 24.871094 45.992188 24.898438 45.996094 C 24.9375 45.996094 24.980469 46 25.019531 46 C 25.058594 45.996094 25.09375 45.996094 25.128906 45.988281 C 25.144531 45.988281 25.15625 45.988281 25.171875 45.984375 C 25.171875 45.984375 25.175781 45.984375 25.179688 45.984375 C 25.1875 45.980469 25.191406 45.980469 25.199219 45.980469 C 25.203125 45.980469 25.207031 45.976563 25.214844 45.976563 C 25.222656 45.972656 25.234375 45.972656 25.242188 45.96875 C 25.257813 45.964844 25.269531 45.960938 25.28125 45.957031 C 25.289063 45.957031 25.292969 45.957031 25.296875 45.953125 C 25.300781 45.953125 25.304688 45.953125 25.308594 45.953125 C 25.324219 45.945313 25.34375 45.9375 25.359375 45.933594 C 25.378906 45.925781 25.394531 45.917969 25.410156 45.910156 C 25.414063 45.910156 25.414063 45.910156 25.417969 45.90625 C 25.421875 45.90625 25.425781 45.90625 25.429688 45.902344 C 25.4375 45.898438 25.445313 45.894531 25.453125 45.890625 C 25.476563 45.878906 25.496094 45.867188 25.515625 45.855469 C 25.523438 45.851563 25.527344 45.847656 25.53125 45.84375 C 25.535156 45.84375 25.539063 45.839844 25.542969 45.839844 C 25.558594 45.828125 25.574219 45.820313 25.589844 45.808594 L 25.597656 45.796875 L 47.589844 29.808594 C 47.953125 29.542969 48.09375 29.070313 47.9375 28.648438 L 44.945313 20.675781 C 44.941406 20.667969 44.9375 20.65625 44.9375 20.648438 L 38.9375 4.648438 C 38.789063 4.261719 38.425781 4.003906 38.011719 4 Z M 11.933594 8.027344 L 15.824219 20 L 7.445313 20 Z M 38.066406 8.027344 L 42.558594 20 L 34.175781 20 Z M 8.066406 22 L 16.472656 22 L 22.328125 40.015625 Z M 18.578125 22 L 31.421875 22 L 25 41.765625 Z M 33.527344 22 L 41.933594 22 L 27.671875 40.015625 Z M 6.3125 23.007813 L 19.6875 39.902344 L 4.203125 28.640625 Z M 43.6875 23.007813 L 45.796875 28.640625 L 30.3125 39.902344 Z" /></svg>,
|
||||
'GitLab',
|
||||
)
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
import Image from "next/image"
|
||||
import styled from "styled-components"
|
||||
|
||||
export default styled(Image)`
|
||||
border-radius: 50%;
|
||||
`
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
import styled from "styled-components"
|
||||
|
||||
export default styled.h1`
|
||||
margin-bottom: 0px;
|
||||
`
|
||||
18
config.ts
18
config.ts
|
|
@ -1,18 +0,0 @@
|
|||
const links = {
|
||||
github: "https://github.com/MedzikUser",
|
||||
gitlab: "https://gitlab.com/Medzik",
|
||||
googleDevelopers: "https://g.dev/medzik",
|
||||
discord: "https://dsc.bio/medzik",
|
||||
reddit: "https://www.reddit.com/user/MedzikUser"
|
||||
}
|
||||
|
||||
const config = {
|
||||
title: "Medzik",
|
||||
description: "Hi! I'm Oskar, I'm a self-taught programmer, a Linux and FOSS enthusiast.",
|
||||
url: "https://medzik.xyz",
|
||||
thumbnail: "https://cdn.medzik.xyz/Id5w0av.png",
|
||||
links,
|
||||
}
|
||||
|
||||
export default config
|
||||
export { links }
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" href="/favicon.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Medzik</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/basic-features/typescript for more information.
|
||||
38
package.json
38
package.json
|
|
@ -1,28 +1,22 @@
|
|||
{
|
||||
"name": "portfolio",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "next",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/core": "7.18.6",
|
||||
"@emotion/react": "11.9.3",
|
||||
"@emotion/styled": "11.9.3",
|
||||
"@mui/icons-material": "5.8.4",
|
||||
"@mui/material": "5.8.6",
|
||||
"next": "12.2.0",
|
||||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0",
|
||||
"react-is": "18.2.0",
|
||||
"styled-components": "5.3.5"
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview",
|
||||
"check": "svelte-check --tsconfig ./tsconfig.json"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "17.0.24",
|
||||
"@types/react": "18.0.14",
|
||||
"@types/styled-components": "5.1.25",
|
||||
"eslint": "8.18.0",
|
||||
"eslint-config-next": "12.2.0",
|
||||
"typescript": "4.7.4"
|
||||
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.30",
|
||||
"@tsconfig/svelte": "^2.0.1",
|
||||
"svelte": "^3.44.0",
|
||||
"svelte-check": "^2.2.7",
|
||||
"svelte-preprocess": "^4.10.7",
|
||||
"tslib": "^2.3.1",
|
||||
"typescript": "^4.5.4",
|
||||
"vite": "^2.9.9"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,23 +0,0 @@
|
|||
import Head from 'next/head'
|
||||
import { Home } from '@mui/icons-material'
|
||||
import { IconButton } from '@mui/material'
|
||||
import config from '../config'
|
||||
import Title from '../components/title'
|
||||
import Container from '../components/container'
|
||||
|
||||
export default function NotFoundPage() {
|
||||
return (
|
||||
<Container>
|
||||
<Head>
|
||||
<title>404 | {config.title}</title>
|
||||
</Head>
|
||||
|
||||
<Title>404 | This page could not be found</Title>
|
||||
|
||||
<IconButton color="inherit" href="/">
|
||||
<Home />
|
||||
</IconButton>
|
||||
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import Head from 'next/head'
|
||||
import config from '../config'
|
||||
import Title from '../components/title'
|
||||
import Container from '../components/container'
|
||||
|
||||
export default function NotFoundPage() {
|
||||
return (
|
||||
<Container>
|
||||
<Head>
|
||||
<title>500 | {config.title}</title>
|
||||
</Head>
|
||||
|
||||
<Title>500 | Server-side error occurred</Title>
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
import { createGlobalStyle, ThemeProvider } from 'styled-components'
|
||||
|
||||
const GlobalStyle = createGlobalStyle`
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Open Sans';
|
||||
}
|
||||
`
|
||||
|
||||
const theme = {
|
||||
colors: {
|
||||
primary: '#f2f0ed',
|
||||
background: '#080a0b'
|
||||
},
|
||||
}
|
||||
|
||||
export default function App({ Component, pageProps }) {
|
||||
return (
|
||||
<>
|
||||
<GlobalStyle />
|
||||
<ThemeProvider theme={theme}>
|
||||
<Component {...pageProps} />
|
||||
</ThemeProvider>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,60 +0,0 @@
|
|||
import Document, { DocumentContext, DocumentInitialProps, Head, Html, Main, NextScript } from 'next/document'
|
||||
import { ServerStyleSheet } from 'styled-components'
|
||||
import config from '../config'
|
||||
|
||||
export default class MyDocument extends Document {
|
||||
static async getInitialProps(
|
||||
ctx: DocumentContext
|
||||
): Promise<DocumentInitialProps> {
|
||||
const sheet = new ServerStyleSheet()
|
||||
const originalRenderPage = ctx.renderPage
|
||||
|
||||
try {
|
||||
ctx.renderPage = () =>
|
||||
originalRenderPage({
|
||||
enhanceApp: (App) => (props) =>
|
||||
sheet.collectStyles(<App {...props} />),
|
||||
})
|
||||
|
||||
const initialProps = await Document.getInitialProps(ctx)
|
||||
return {
|
||||
...initialProps,
|
||||
styles: [initialProps.styles, sheet.getStyleElement()],
|
||||
}
|
||||
} finally {
|
||||
sheet.seal()
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Html>
|
||||
<Head>
|
||||
{/* Add the favicon */}
|
||||
<link rel="shortcut icon" href="/favicon.svg" />
|
||||
|
||||
{/* Add `Open Sans` font */}
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Open+Sans&display=optional"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
{/* HTML Meta tags */}
|
||||
<meta name="description" content={config.description} />
|
||||
|
||||
{/* OpenGraph card */}
|
||||
<meta property="og:url" content={config.url} />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:title" content={config.title} />
|
||||
<meta property="og:description" content={config.description} />
|
||||
<meta property="og:image" content={config.thumbnail} />
|
||||
</Head>
|
||||
|
||||
<body>
|
||||
<Main />
|
||||
<NextScript />
|
||||
</body>
|
||||
</Html>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -1,61 +0,0 @@
|
|||
import Head from 'next/head'
|
||||
import { GitHub, Google, Reddit } from '@mui/icons-material'
|
||||
import { IconButton } from '@mui/material'
|
||||
import config, { links } from '../config'
|
||||
import AvatarSvg from '../public/avatar.svg'
|
||||
import Discord from '../components/icons/discord'
|
||||
import GitLab from '../components/icons/gitlab'
|
||||
import RoundImage from '../components/round-image'
|
||||
import Footer from '../components/footer'
|
||||
import Avatar from '../components/avatar'
|
||||
import Description from '../components/description'
|
||||
import Title from '../components/title'
|
||||
import Container from '../components/container'
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<Container>
|
||||
<Head>
|
||||
<title>{config.title}</title>
|
||||
</Head>
|
||||
|
||||
<Avatar>
|
||||
<RoundImage src={AvatarSvg} alt="my profile picture" />
|
||||
</Avatar>
|
||||
|
||||
<Title>Hello, I'm Oskar</Title>
|
||||
|
||||
<Description>
|
||||
I'm a self-taught programmer. I use Arch Linux and I like open source software.
|
||||
</Description>
|
||||
|
||||
<Footer>
|
||||
{/* GitHub */}
|
||||
<IconButton color="inherit" href={links.github} target="_blank">
|
||||
<GitHub />
|
||||
</IconButton>
|
||||
|
||||
{/* GitLab */}
|
||||
<IconButton color="inherit" href={links.gitlab} target="_blank">
|
||||
<GitLab />
|
||||
</IconButton>
|
||||
|
||||
{/* Google Developers */}
|
||||
<IconButton color="inherit" href={links.googleDevelopers} target="_blank">
|
||||
<Google />
|
||||
</IconButton>
|
||||
|
||||
{/* Discord */}
|
||||
<IconButton color="inherit" href={links.discord} target="_blank">
|
||||
<Discord />
|
||||
</IconButton>
|
||||
|
||||
{/* Reddit */}
|
||||
<IconButton color="inherit" href={links.reddit} target="_blank">
|
||||
<Reddit />
|
||||
</IconButton>
|
||||
</Footer>
|
||||
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
2767
pnpm-lock.yaml
2767
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
|
|
@ -1 +1 @@
|
|||
avatar.svg
|
||||
/home/medzik/git/MedzikUser/portfolio/src/assets/avatar.svg
|
||||
|
|
@ -1,18 +1,17 @@
|
|||
{
|
||||
"$schema": "https://docs.renovatebot.com/renovate-schema.json",
|
||||
"extends": [
|
||||
"config:base"
|
||||
"config:base",
|
||||
"schedule:weekly", // each monday
|
||||
"group:allNonMajor", // batch non-majors into one PR
|
||||
":semanticCommits" // nicer commit messages
|
||||
],
|
||||
"prHourlyLimit": 0,
|
||||
"labels": ["dependencies"],
|
||||
"automergeType": "pr",
|
||||
"prCreation": "immediate",
|
||||
"packageRules": [
|
||||
{
|
||||
"matchUpdateTypes": [
|
||||
"minor",
|
||||
"patch",
|
||||
"pin",
|
||||
"digest"
|
||||
],
|
||||
"matchUpdateTypes": ["minor", "patch", "pin", "digest"],
|
||||
"automerge": true
|
||||
}
|
||||
]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,82 @@
|
|||
<script lang="ts">
|
||||
import { links } from './config';
|
||||
import Avatar from './lib/Avatar.svelte';
|
||||
import Discord from './lib/icons/Discord.svelte';
|
||||
import GitHub from './lib/icons/GitHub.svelte';
|
||||
import GitLab from './lib/icons/GitLab.svelte';
|
||||
import Google from './lib/icons/Google.svelte';
|
||||
import Reddit from './lib/icons/Reddit.svelte';
|
||||
</script>
|
||||
|
||||
<!-- <div>
|
||||
s
|
||||
</div> -->
|
||||
|
||||
<div>
|
||||
<Avatar />
|
||||
|
||||
<h1>Hello, I'm Oskar</h1>
|
||||
|
||||
<p>I'm a self-taught programmer. I use Arch Linux and I like open source software.</p>
|
||||
|
||||
<footer>
|
||||
<a href={links.github}>
|
||||
<GitHub />
|
||||
</a>
|
||||
|
||||
<a href={links.gitlab}>
|
||||
<GitLab />
|
||||
</a>
|
||||
|
||||
<a href={links.googleDevelopers}>
|
||||
<Google />
|
||||
</a>
|
||||
|
||||
<a href={links.discord}>
|
||||
<Discord />
|
||||
</a>
|
||||
|
||||
<a href={links.reddit}>
|
||||
<Reddit />
|
||||
</a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
:root {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: #F2F0ED;
|
||||
background-color: #080a0b;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
|
||||
Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
}
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
footer {
|
||||
padding-top: 0.5em;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #F2F0ED;
|
||||
text-decoration: none;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,5 +1,4 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
|
Before Width: | Height: | Size: 8.5 KiB After Width: | Height: | Size: 8.4 KiB |
|
|
@ -0,0 +1,13 @@
|
|||
export const links = {
|
||||
github: "https://github.com/MedzikUser",
|
||||
gitlab: "https://gitlab.com/Medzik",
|
||||
googleDevelopers: "https://g.dev/medzik",
|
||||
discord: "https://dsc.bio/medzik",
|
||||
reddit: "https://www.reddit.com/user/MedzikUser"
|
||||
}
|
||||
|
||||
const config = {
|
||||
links
|
||||
}
|
||||
|
||||
export default config;
|
||||
|
|
@ -1,13 +1,25 @@
|
|||
import styled from "styled-components"
|
||||
<script lang="ts">
|
||||
import avatar from "../assets/avatar.svg"
|
||||
</script>
|
||||
|
||||
export default styled.div`
|
||||
<div>
|
||||
<img src={avatar} alt="Profile Icon" />
|
||||
</div>
|
||||
|
||||
<style>
|
||||
div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
width: 3.5cm;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-bottom: 15px;
|
||||
`
|
||||
}
|
||||
|
||||
img {
|
||||
width: 3.5cm;
|
||||
border-radius: 50%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" width="24px" height="24px">
|
||||
<path d="M19.229,6.012c-0.903-0.73-2.015-1.246-2.872-1.572c-0.307-0.117-0.653-0.076-0.923,0.111C15.162,4.737,15,5.045,15,5.374 C15,5.72,14.72,6,14.374,6c-1.573,0-3.176,0-4.749,0C9.28,6,9,5.72,9,5.375c0-0.329-0.162-0.638-0.433-0.824 C8.296,4.364,7.95,4.323,7.643,4.441c-0.86,0.329-1.978,0.85-2.894,1.59C3.831,6.882,2,11.861,2,16.165 c0,0.076,0.019,0.15,0.057,0.216c1.265,2.233,4.714,2.817,5.499,2.842c0.005,0.001,0.009,0.001,0.014,0.001 c0.139,0,0.286-0.056,0.351-0.18l0.783-1.485c-0.646-0.164-1.313-0.359-2.04-0.617c-0.521-0.185-0.792-0.757-0.607-1.277 s0.758-0.791,1.277-0.607c3.526,1.254,5.624,1.253,9.345-0.005c0.525-0.175,1.092,0.104,1.268,0.627 c0.177,0.523-0.104,1.091-0.627,1.268c-0.728,0.246-1.392,0.434-2.035,0.594l0.793,1.503c0.065,0.124,0.213,0.18,0.351,0.18 c0.005,0,0.009,0,0.014-0.001c0.786-0.025,4.235-0.61,5.499-2.843C21.981,16.315,22,16.241,22,16.164 C22,11.861,20.169,6.882,19.229,6.012z M9.04,13.988c-0.829,0-1.5-0.893-1.5-1.996c0-1.102,0.671-1.996,1.5-1.996 c0.832-0.11,1.482,0.893,1.5,1.996C10.54,13.095,9.869,13.988,9.04,13.988z M14.996,14.012c-0.829,0-1.5-0.895-1.5-2s0.671-2,1.5-2 s1.5,0.895,1.5,2S15.825,14.012,14.996,14.012z" />
|
||||
</svg>
|
||||
|
||||
<style>
|
||||
svg {
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" width="24px" height="24px">
|
||||
<path d="M10.9,2.1c-4.6,0.5-8.3,4.2-8.8,8.7c-0.5,4.7,2.2,8.9,6.3,10.5C8.7,21.4,9,21.2,9,20.8v-1.6c0,0-0.4,0.1-0.9,0.1 c-1.4,0-2-1.2-2.1-1.9c-0.1-0.4-0.3-0.7-0.6-1C5.1,16.3,5,16.3,5,16.2C5,16,5.3,16,5.4,16c0.6,0,1.1,0.7,1.3,1c0.5,0.8,1.1,1,1.4,1 c0.4,0,0.7-0.1,0.9-0.2c0.1-0.7,0.4-1.4,1-1.8c-2.3-0.5-4-1.8-4-4c0-1.1,0.5-2.2,1.2-3C7.1,8.8,7,8.3,7,7.6C7,7.2,7,6.6,7.3,6 c0,0,1.4,0,2.8,1.3C10.6,7.1,11.3,7,12,7s1.4,0.1,2,0.3C15.3,6,16.8,6,16.8,6C17,6.6,17,7.2,17,7.6c0,0.8-0.1,1.2-0.2,1.4 c0.7,0.8,1.2,1.8,1.2,3c0,2.2-1.7,3.5-4,4c0.6,0.5,1,1.4,1,2.3v2.6c0,0.3,0.3,0.6,0.7,0.5c3.7-1.5,6.3-5.1,6.3-9.3 C22,6.1,16.9,1.4,10.9,2.1z" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 746 B |
|
|
@ -0,0 +1,9 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 50 50" width="24px" height="24px">
|
||||
<path d="M 38.011719 4 C 37.574219 3.996094 37.183594 4.273438 37.046875 4.691406 L 32.074219 20 L 17.925781 20 L 12.953125 4.691406 C 12.820313 4.289063 12.449219 4.011719 12.023438 4 C 11.597656 3.992188 11.214844 4.25 11.0625 4.648438 L 5.070313 20.640625 C 5.066406 20.640625 5.066406 20.644531 5.0625 20.648438 L 2.0625 28.648438 C 1.90625 29.070313 2.046875 29.542969 2.414063 29.808594 L 24.40625 45.800781 L 24.410156 45.808594 C 24.414063 45.808594 24.414063 45.808594 24.414063 45.8125 C 24.425781 45.820313 24.441406 45.828125 24.453125 45.835938 C 24.46875 45.84375 24.480469 45.855469 24.496094 45.863281 C 24.5 45.863281 24.5 45.867188 24.503906 45.867188 C 24.503906 45.867188 24.507813 45.871094 24.511719 45.871094 C 24.515625 45.875 24.519531 45.878906 24.527344 45.878906 C 24.53125 45.882813 24.539063 45.886719 24.542969 45.890625 C 24.5625 45.898438 24.585938 45.910156 24.609375 45.917969 C 24.609375 45.917969 24.609375 45.917969 24.609375 45.921875 C 24.632813 45.929688 24.65625 45.9375 24.675781 45.945313 C 24.679688 45.945313 24.679688 45.945313 24.683594 45.949219 C 24.699219 45.953125 24.714844 45.957031 24.734375 45.964844 C 24.742188 45.964844 24.75 45.96875 24.761719 45.96875 C 24.761719 45.972656 24.761719 45.972656 24.761719 45.96875 C 24.78125 45.976563 24.800781 45.980469 24.820313 45.984375 C 24.847656 45.988281 24.871094 45.992188 24.898438 45.996094 C 24.9375 45.996094 24.980469 46 25.019531 46 C 25.058594 45.996094 25.09375 45.996094 25.128906 45.988281 C 25.144531 45.988281 25.15625 45.988281 25.171875 45.984375 C 25.171875 45.984375 25.175781 45.984375 25.179688 45.984375 C 25.1875 45.980469 25.191406 45.980469 25.199219 45.980469 C 25.203125 45.980469 25.207031 45.976563 25.214844 45.976563 C 25.222656 45.972656 25.234375 45.972656 25.242188 45.96875 C 25.257813 45.964844 25.269531 45.960938 25.28125 45.957031 C 25.289063 45.957031 25.292969 45.957031 25.296875 45.953125 C 25.300781 45.953125 25.304688 45.953125 25.308594 45.953125 C 25.324219 45.945313 25.34375 45.9375 25.359375 45.933594 C 25.378906 45.925781 25.394531 45.917969 25.410156 45.910156 C 25.414063 45.910156 25.414063 45.910156 25.417969 45.90625 C 25.421875 45.90625 25.425781 45.90625 25.429688 45.902344 C 25.4375 45.898438 25.445313 45.894531 25.453125 45.890625 C 25.476563 45.878906 25.496094 45.867188 25.515625 45.855469 C 25.523438 45.851563 25.527344 45.847656 25.53125 45.84375 C 25.535156 45.84375 25.539063 45.839844 25.542969 45.839844 C 25.558594 45.828125 25.574219 45.820313 25.589844 45.808594 L 25.597656 45.796875 L 47.589844 29.808594 C 47.953125 29.542969 48.09375 29.070313 47.9375 28.648438 L 44.945313 20.675781 C 44.941406 20.667969 44.9375 20.65625 44.9375 20.648438 L 38.9375 4.648438 C 38.789063 4.261719 38.425781 4.003906 38.011719 4 Z M 11.933594 8.027344 L 15.824219 20 L 7.445313 20 Z M 38.066406 8.027344 L 42.558594 20 L 34.175781 20 Z M 8.066406 22 L 16.472656 22 L 22.328125 40.015625 Z M 18.578125 22 L 31.421875 22 L 25 41.765625 Z M 33.527344 22 L 41.933594 22 L 27.671875 40.015625 Z M 6.3125 23.007813 L 19.6875 39.902344 L 4.203125 28.640625 Z M 43.6875 23.007813 L 45.796875 28.640625 L 30.3125 39.902344 Z" />
|
||||
</svg>
|
||||
|
||||
<style>
|
||||
svg {
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
||||
|
After Width: | Height: | Size: 3.3 KiB |
|
|
@ -0,0 +1,9 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" width="24px" height="24px">
|
||||
<path d="M12.545,10.239v3.821h5.445c-0.712,2.315-2.647,3.972-5.445,3.972c-3.332,0-6.033-2.701-6.033-6.032 s2.701-6.032,6.033-6.032c1.498,0,2.866,0.549,3.921,1.453l2.814-2.814C17.503,2.988,15.139,2,12.545,2 C7.021,2,2.543,6.477,2.543,12s4.478,10,10.002,10c8.396,0,10.249-7.85,9.426-11.748L12.545,10.239z" />
|
||||
</svg>
|
||||
|
||||
<style>
|
||||
svg {
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
||||
|
After Width: | Height: | Size: 487 B |
|
|
@ -0,0 +1,9 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" width="24px" height="24px">
|
||||
<path d="M 14 3 C 12.300781 3 11 4.414063 11 6 L 11 8.03125 C 8.882813 8.175781 6.976563 8.785156 5.4375 9.71875 C 4.878906 9.28125 4.21875 9.03125 3.5625 9.03125 C 2.835938 9.03125 2.128906 9.308594 1.625 9.875 C 0.667969 11.070313 0.753906 13.023438 2.09375 14.03125 C 2.03125 14.347656 2 14.667969 2 15 C 2 17.054688 3.242188 18.84375 5.0625 20.0625 C 6.882813 21.28125 9.320313 22 12 22 C 14.679688 22 17.117188 21.28125 18.9375 20.0625 C 20.757813 18.84375 22 17.054688 22 15 C 22 14.667969 21.9375 14.347656 21.875 14.03125 C 23.238281 12.945313 23.378906 11.003906 22.375 9.875 C 21.871094 9.308594 21.164063 9.03125 20.4375 9.03125 C 19.78125 9.03125 19.121094 9.28125 18.5625 9.71875 C 17.023438 8.785156 15.117188 8.175781 13 8.03125 L 13 6 C 13 5.386719 13.300781 5 14 5 C 14.320313 5 14.773438 5.171875 15.53125 5.4375 C 16.203125 5.671875 17.09375 5.914063 18.25 5.96875 C 18.589844 6.585938 19.25 7 20 7 C 21.101563 7 22 6.101563 22 5 C 22 3.898438 21.101563 3 20 3 C 19.273438 3 18.632813 3.382813 18.28125 3.96875 C 17.394531 3.925781 16.769531 3.765625 16.1875 3.5625 C 15.519531 3.328125 14.878906 3 14 3 Z M 20 4 C 20.601563 4 21 4.398438 21 5 C 21 5.601563 20.601563 6 20 6 C 19.398438 6 19 5.601563 19 5 C 19 4.398438 19.398438 4 20 4 Z M 12 10 C 14.320313 10 16.382813 10.636719 17.8125 11.59375 C 19.242188 12.550781 20 13.753906 20 15 C 20 16.246094 19.242188 17.449219 17.8125 18.40625 C 16.382813 19.363281 14.320313 20 12 20 C 9.679688 20 7.617188 19.363281 6.1875 18.40625 C 4.757813 17.449219 4 16.246094 4 15 C 4 13.753906 4.757813 12.550781 6.1875 11.59375 C 7.617188 10.636719 9.679688 10 12 10 Z M 3.59375 10.03125 C 3.925781 10.03125 4.277344 10.101563 4.59375 10.28125 C 3.628906 11.023438 2.878906 11.9375 2.4375 12.96875 C 1.855469 12.28125 1.867188 11.191406 2.375 10.53125 C 2.671875 10.195313 3.121094 10.03125 3.59375 10.03125 Z M 20.40625 10.03125 C 20.878906 10.03125 21.328125 10.195313 21.625 10.53125 C 22.117188 11.085938 22.15625 12.175781 21.5625 12.9375 C 21.121094 11.914063 20.363281 11.019531 19.40625 10.28125 C 19.722656 10.101563 20.074219 10.03125 20.40625 10.03125 Z M 9 12 C 8.171875 12 7.5 12.671875 7.5 13.5 C 7.5 14.328125 8.171875 15 9 15 C 9.828125 15 10.5 14.328125 10.5 13.5 C 10.5 12.671875 9.828125 12 9 12 Z M 15 12 C 14.171875 12 13.5 12.671875 13.5 13.5 C 13.5 14.328125 14.171875 15 15 15 C 15.828125 15 16.5 14.328125 16.5 13.5 C 16.5 12.671875 15.828125 12 15 12 Z M 16.09375 16.40625 C 15.195313 17.207031 13.699219 17.6875 12 17.6875 C 10.300781 17.6875 8.804688 17.199219 7.90625 16.5 C 8.40625 17.800781 10 19 12 19 C 14 19 15.59375 17.804688 16.09375 16.40625 Z" />
|
||||
</svg>
|
||||
|
||||
<style>
|
||||
svg {
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
||||
|
After Width: | Height: | Size: 2.8 KiB |
|
|
@ -0,0 +1,7 @@
|
|||
import App from './App.svelte'
|
||||
|
||||
const app = new App({
|
||||
target: document.getElementById('app')
|
||||
})
|
||||
|
||||
export default app
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
/// <reference types="svelte" />
|
||||
/// <reference types="vite/client" />
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import sveltePreprocess from 'svelte-preprocess'
|
||||
|
||||
export default {
|
||||
// Consult https://github.com/sveltejs/svelte-preprocess
|
||||
// for more information about preprocessors
|
||||
preprocess: sveltePreprocess()
|
||||
}
|
||||
|
|
@ -1,20 +1,21 @@
|
|||
{
|
||||
"extends": "@tsconfig/svelte/tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"target": "esnext",
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"strict": false,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"noEmit": true,
|
||||
"incremental": true,
|
||||
"esModuleInterop": true,
|
||||
"useDefineForClassFields": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "node",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"jsx": "preserve"
|
||||
"baseUrl": ".",
|
||||
/**
|
||||
* Typecheck JS in `.svelte` and `.js` files by default.
|
||||
* Disable checkJs if you'd like to use dynamic types in JS.
|
||||
* Note that setting allowJs false does not prevent the use
|
||||
* of JS in `.svelte` files.
|
||||
*/
|
||||
"allowJs": true,
|
||||
"checkJs": true,
|
||||
"isolatedModules": true
|
||||
},
|
||||
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
|
||||
"exclude": ["node_modules"]
|
||||
"include": ["src/**/*.d.ts", "src/**/*.ts", "src/**/*.js", "src/**/*.svelte"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,8 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "node"
|
||||
},
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import { defineConfig } from 'vite'
|
||||
import { svelte } from '@sveltejs/vite-plugin-svelte'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [svelte()]
|
||||
})
|
||||
Loading…
Reference in New Issue