srizan/mainwebsite
1
0
Fork 0
mirror of https://github.com/SrIzan10/mainwebsite.git synced 2026-06-06 00:56:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: urls

Browse Source
This commit is contained in:
SrIzan10
2023-07-17 12:57:22 +00:00
parent 5c713ae2a2
commit 2e63760d14
4 changed files with 24 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title>
<title>Sr Izan's front page for the web:tm:</title>
</head>
<body>
<div id="root"></div>

14
src/App.css
View File

@@ -18,7 +18,13 @@ body {
}
.icons {
display: inline;
position: absolute;
bottom: 0;
}
align-self: flex-end;
}
.icons * {
margin-right: 20px;
}
.icons *:last-child {
margin-right: 0;
}

17
src/App.tsx
View File

@@ -1,20 +1,25 @@
import './App.css'
import * as React from 'react'
import React from 'react'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faGithub } from '@fortawesome/free-brands-svg-icons'
import { faDiscord, faGithub, faMastodon, faTwitter } from '@fortawesome/free-brands-svg-icons'
import { faBlog, faCircle } from '@fortawesome/free-solid-svg-icons'
function App() {
// OsuBeat :weary:
// sorry peppy for naming the variable Osu instead of osu! you know camel case stuff please don't kill me or ban me but at lease give me a plushie or something the taikonator one is really nice actually but who can't pass the offer of getting pippi lol she's so fucking cute
const [osuBeat, setOsuBeat] = React.useState(false)
return (
<div>
<div className='aboutMeBox'>
<img src='https://github.com/SrIzan10.png' height='200px' />
<p>I'm a hobbyist developer and <a href='https://osu.ppy.sh/users/SrIzan10'>osu! player</a> based on Spain who loves to open-source and to work on teams.</p>
<p>I'm a hobbyist developer and osu! player based on Spain who loves to open-source and to work on teams.</p>
<p>Stalk me on social media:</p>
<div className='icons'>
<FontAwesomeIcon icon={faGithub} onDragOver={() => setOsuBeat(true)} beatFade={osuBeat} />
<FontAwesomeIcon icon={faGithub} />
<a href='https://github.com/SrIzan10'><FontAwesomeIcon icon={faGithub} /></a>
<a href='https://social.srizan.dev'><FontAwesomeIcon icon={faMastodon} /></a>
<a href='https://twitter.com/itssrizan'><FontAwesomeIcon icon={faTwitter} /></a>
<a href='https://srizan.dev/blog'><FontAwesomeIcon icon={faBlog} /></a>
<a href='https://discord.com/users/703974042700611634'><FontAwesomeIcon icon={faDiscord} /></a>
<a href='https://osu.ppy.sh/users/25350735'><FontAwesomeIcon icon={faCircle} onMouseEnter={() => setOsuBeat(true)} onMouseLeave={() => setOsuBeat(false)} beatFade={osuBeat} /></a>
</div>
</div>
</div>

4
src/osuIcon.ts
View File

@@ -4,7 +4,7 @@ import {
IconPrefix
} from "@fortawesome/fontawesome-svg-core";
export const simpleIconsMicrosoftOutlook: IconDefinition = {
export const osuIcon: IconDefinition = {
icon: [
// SVG viewbox width (in pixels)
24,
@@ -19,7 +19,7 @@ import {
"",
// SVG path data
"M7.88 12.04q0 .45-.11.87-.1.41-.33.74-.22.33-.58.52-.37.2-.87.2t-.85-.2q-.35-.21-.57-.55-.22-.33-.33-.75-.1-.42-.1-.86t.1-.87q.1-.43.34-.76.22-.34.59-.54.36-.2.87-.2t.86.2q.35.21.57.55.22.34.31.77.1.43.1.88zM24 12v9.38q0 .46-.33.8-.33.32-.8.32H7.13q-.46 0-.8-.33-.32-.33-.32-.8V18H1q-.41 0-.7-.3-.3-.29-.3-.7V7q0-.41.3-.7Q.58 6 1 6h6.5V2.55q0-.44.3-.75.3-.3.75-.3h12.9q.44 0 .75.3.3.3.3.75V10.85l1.24.72h.01q.1.07.18.18.07.12.07.25zm-6-8.25v3h3v-3zm0 4.5v3h3v-3zm0 4.5v1.83l3.05-1.83zm-5.25-9v3h3.75v-3zm0 4.5v3h3.75v-3zm0 4.5v2.03l2.41 1.5 1.34-.8v-2.73zM9 3.75V6h2l.13.01.12.04v-2.3zM5.98 15.98q.9 0 1.6-.3.7-.32 1.19-.86.48-.55.73-1.28.25-.74.25-1.61 0-.83-.25-1.55-.24-.71-.71-1.24t-1.15-.83q-.68-.3-1.55-.3-.92 0-1.64.3-.71.3-1.2.85-.5.54-.75 1.3-.25.74-.25 1.63 0 .85.26 1.56.26.72.74 1.23.48.52 1.17.81.69.3 1.56.3zM7.5 21h12.39L12 16.08V17q0 .41-.3.7-.29.3-.7.3H7.5zm15-.13v-7.24l-5.9 3.54Z"
``
],
iconName: "simple-icons-microsoft-outlook" as IconName,
prefix: "simple-icons" as IconPrefix