morten/morten-olsen.github.io
1
0
Fork 0
mirror of https://github.com/morten-olsen/morten-olsen.github.io.git synced 2026-02-08 01:46:28 +01:00
Code Issues Packages Projects Releases Wiki Activity

Background

Browse Source
This commit is contained in:
Morten Olsen
2021-08-25 23:58:42 +02:00
parent a1bad1750e
commit 6661a9c45c
4 changed files with 61 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
components/Social.tsx
View File

@@ -38,7 +38,6 @@ const ItemWrapper = styled.a`
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
background: #fff;
margin: 20px; margin: 20px;
width: 220px; width: 220px;
height: 100px; height: 100px;

1
package.json
View File

@@ -7,6 +7,7 @@
}, },
"dependencies": { "dependencies": {
"next": "^11.1.0", "next": "^11.1.0",
"particlesjs": "^2.2.3",
"react": "^17.0.2", "react": "^17.0.2",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
"styled-components": "^5.3.1" "styled-components": "^5.3.1"

83
pages/index.tsx
View File

@@ -1,34 +1,61 @@
import React from 'react'; import React, { useEffect } from 'react';
import styled from 'styled-components';
import Head from 'next/head'; import Head from 'next/head';
import Me from '../components/Me'; import Me from '../components/Me';
import Social from '../components/Social'; import Social from '../components/Social';
const Frontpage: React.FC<{}> = () => ( const Canvas = styled.canvas`
<> position: fixed;
<Head> top: 0;
<title>Morten Olsen</title> left: 0;
</Head> widht: 100%;
<Me /> height: 100%;
<Social z-index: -1;
sites={[{ `;
title: 'Github',
link: 'https://github.com/morten-olsen', const Frontpage: React.FC<{}> = () => {
logo: 'github.svg', useEffect(() => {
}, { const run = async () => {
title: 'HackTheBox', const { default: Particles } = await import('particlesjs');
link: 'https://app.hackthebox.eu/profile/174098', Particles.init({
logo: 'htb.svg', selector: '.background',
}, { connectParticles: true,
title: 'Stack Overflow', color: '#dddddd',
link: 'https://stackoverflow.com/users/1689055/morten-olsen', maxParticles: 200,
logo: 'stackoverflow.svg', });
}, { console.log(Particles);
title: 'Linkedin', };
link: 'https://www.linkedin.com/in/mortenolsendk', run();
logo: 'linkedin.svg', });
}]}
/> return (
</> <>
); <Head>
<title>Morten Olsen</title>
</Head>
<Me />
<Canvas className="background" />
<Social
sites={[{
title: 'Github',
link: 'https://github.com/morten-olsen',
logo: 'github.svg',
}, {
title: 'HackTheBox',
link: 'https://app.hackthebox.eu/profile/174098',
logo: 'htb.svg',
}, {
title: 'Stack Overflow',
link: 'https://stackoverflow.com/users/1689055/morten-olsen',
logo: 'stackoverflow.svg',
}, {
title: 'Linkedin',
link: 'https://www.linkedin.com/in/mortenolsendk',
logo: 'linkedin.svg',
}]}
/>
</>
);
};
export default Frontpage; export default Frontpage;

5
yarn.lock
View File

@@ -1501,6 +1501,11 @@ parse-asn1@^5.0.0, parse-asn1@^5.1.5:
pbkdf2 "^3.0.3" pbkdf2 "^3.0.3"
safe-buffer "^5.1.1" safe-buffer "^5.1.1"
particlesjs@^2.2.3:
version "2.2.3"
resolved "https://registry.yarnpkg.com/particlesjs/-/particlesjs-2.2.3.tgz#4d213ca740679fc1ccc772e8d864b884a091f37e"
integrity sha512-f0rL80Agqdsrnv/uhlLewv+LMdiXHu9MYPzMv0ZLPM06nLx3zmAXMH882fxqO6Uzb91csli8WlWaYd2XPN0d/Q==
path-browserify@0.0.1: path-browserify@0.0.1:
version "0.0.1" version "0.0.1"
resolved "https://registry.yarnpkg.com/path-browserify/-/path-browserify-0.0.1.tgz#e6c4ddd7ed3aa27c68a20cc4e50e1a4ee83bbc4a" resolved "https://registry.yarnpkg.com/path-browserify/-/path-browserify-0.0.1.tgz#e6c4ddd7ed3aa27c68a20cc4e50e1a4ee83bbc4a"