diff --git a/package-lock.json b/package-lock.json index f22b23d..d9e6ed4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,8 @@ "name": "blog", "version": "0.1.0", "dependencies": { + "@fontsource/inter": "^5.2.8", + "@fontsource/neuton": "^5.2.7", "@fortawesome/fontawesome-svg-core": "^7.2.0", "@fortawesome/free-brands-svg-icons": "^7.2.0", "@fortawesome/free-regular-svg-icons": "^7.2.0", @@ -2480,6 +2482,24 @@ "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, + "node_modules/@fontsource/inter": { + "version": "5.2.8", + "resolved": "https://registry.npmjs.org/@fontsource/inter/-/inter-5.2.8.tgz", + "integrity": "sha512-P6r5WnJoKiNVV+zvW2xM13gNdFhAEpQ9dQJHt3naLvfg+LkF2ldgSLiF4T41lf1SQCM9QmkqPTn4TH568IRagg==", + "license": "OFL-1.1", + "funding": { + "url": "https://github.com/sponsors/ayuhito" + } + }, + "node_modules/@fontsource/neuton": { + "version": "5.2.7", + "resolved": "https://registry.npmjs.org/@fontsource/neuton/-/neuton-5.2.7.tgz", + "integrity": "sha512-5XYm0eAoFFxdTmVpyWNnnLu/tW2h6jkhnx8MjGSpNgCcDBxKbc025pZXNPeqrXIJMM8khyQmpzQ1s3522V0BTQ==", + "license": "OFL-1.1", + "funding": { + "url": "https://github.com/sponsors/ayuhito" + } + }, "node_modules/@fortawesome/fontawesome-common-types": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-7.2.0.tgz", diff --git a/package.json b/package.json index d0a1c39..f31c59d 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,8 @@ "version": "0.1.0", "private": true, "dependencies": { + "@fontsource/inter": "^5.2.8", + "@fontsource/neuton": "^5.2.7", "@fortawesome/fontawesome-svg-core": "^7.2.0", "@fortawesome/free-brands-svg-icons": "^7.2.0", "@fortawesome/free-regular-svg-icons": "^7.2.0", diff --git a/src/about/AboutPage.tsx b/src/about/AboutPage.tsx index 3b1da95..5de3589 100644 --- a/src/about/AboutPage.tsx +++ b/src/about/AboutPage.tsx @@ -1,5 +1,51 @@ +import "./about.scss"; +import openingImage from "../img/IMG_20240725_175449_803.jpg"; +import rainbow from "../img/IMG-0186.jpg"; +import japanese from "../img/IMG_20230531_000224_01.jpg"; +import {PropsWithChildren} from "react"; + export default function AboutPage() { - return <> - Hello - + return
+
+ +
+
+ Tymur Arsentiev +

Welcome to my blog and personal website!

+

+ For the longest time, I never had a personal website to show my skills. + I'm a longtime coder, project after project, but have never considered making a place to share my thoughts. + After a while, I was inspired by my Medium and +  Substack account to begin journaling my thoughts on my own. +

+

+ I like to take pride in my uniqueness as a web developer. + I don't go for trends, I consider myself the trendsetter.  + My website design was definitely influenced by my fashion sense. +

+

Fashion Rebel

+
+ Rainbow colored clothing + Purple shirt with Japanese text +
+

+ Clothes shopping is a great knack of mine. I'm skilled in finding all kinds of weird clothes to wear. + I like doing stuff that makes me stand out, as you can see from the gallery. +

+

+ My store of choice is Ebay, where I love thrifting out-of-this-world outfits for a low price. + EBay is a place for me to liquidate my assets, which is random items around the house. + My favorite thing about Ebay is that they have almost every clothing brand, typically at reduced prices due to use. +

+
+
+ +
+
+} + +function ExternalLink(props: PropsWithChildren & { href: string }) { + return ( + {props.children} + ) } \ No newline at end of file diff --git a/src/about/about.scss b/src/about/about.scss new file mode 100644 index 0000000..d578d20 --- /dev/null +++ b/src/about/about.scss @@ -0,0 +1,66 @@ +@import "../nav/nav.scss"; + +main { + color: white; + display: flex; + justify-content: center; +} + +.title { + text-align: center; + margin: $padding; +} + +.self { + width: 100%; + border-bottom: white 4px solid; +} + +.about-container { + margin-top: 2 * $padding; + flex-shrink: 1; + max-width: 75%; + display: flex; + flex-direction: column; + align-items: center; + font-family: Neuton; + + img:not(.self) { + border: 2px white solid; + } + + p { + text-indent: 2 * $padding; + margin: 10px; + max-width: 600px; + line-height: 40px; + font-size: 20px; + } + + h1 { + font-size: 40px; + } + h2 { + font-size: 30px; + } +} + +.edge { + background:#27213C; + flex-grow: 1; +} + +.clothing { + margin: 15px 0; + display: flex; + flex-direction: row; + justify-content: center; +} + +.clothing>img { + width: 33%; +} + +.external-link { + text-decoration: underline !important; +} \ No newline at end of file diff --git a/src/img/1689114993528.jpeg b/src/img/1689114993528.jpeg new file mode 100755 index 0000000..633abe6 Binary files /dev/null and b/src/img/1689114993528.jpeg differ diff --git a/src/img/2026-02-16-09-42-04-033.jpg b/src/img/2026-02-16-09-42-04-033.jpg new file mode 100644 index 0000000..240a5c8 Binary files /dev/null and b/src/img/2026-02-16-09-42-04-033.jpg differ diff --git a/src/img/DSC_5633.JPG b/src/img/DSC_5633.JPG new file mode 100755 index 0000000..244ffe4 Binary files /dev/null and b/src/img/DSC_5633.JPG differ diff --git a/src/img/IMG-0186.jpg b/src/img/IMG-0186.jpg new file mode 100755 index 0000000..1628b89 Binary files /dev/null and b/src/img/IMG-0186.jpg differ diff --git a/src/img/IMG-0350.jpg b/src/img/IMG-0350.jpg new file mode 100755 index 0000000..6d284b5 Binary files /dev/null and b/src/img/IMG-0350.jpg differ diff --git a/src/img/IMG_20230531_000224_01.jpg b/src/img/IMG_20230531_000224_01.jpg new file mode 100755 index 0000000..f045475 Binary files /dev/null and b/src/img/IMG_20230531_000224_01.jpg differ diff --git a/src/img/IMG_20240725_175449_803.jpg b/src/img/IMG_20240725_175449_803.jpg new file mode 100755 index 0000000..36eaa27 Binary files /dev/null and b/src/img/IMG_20240725_175449_803.jpg differ diff --git a/src/img/MOSHED-2024-7-25-20-14-55.jpg b/src/img/MOSHED-2024-7-25-20-14-55.jpg new file mode 100755 index 0000000..4a65232 Binary files /dev/null and b/src/img/MOSHED-2024-7-25-20-14-55.jpg differ diff --git a/src/img/Snapchat-877674815.jpg b/src/img/Snapchat-877674815.jpg new file mode 100644 index 0000000..1167a95 Binary files /dev/null and b/src/img/Snapchat-877674815.jpg differ diff --git a/src/index.scss b/src/index.scss index 7613969..24915d5 100644 --- a/src/index.scss +++ b/src/index.scss @@ -3,12 +3,12 @@ body { width: 100%; height: 100%; background: black; - overflow: hidden; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; + color: white; } code { diff --git a/src/index.tsx b/src/index.tsx index fdf7519..b521a39 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -3,6 +3,12 @@ import ReactDOM from 'react-dom/client'; import './index.scss'; import {RouterProvider} from "./router/RouterContext"; import {Route} from "./router/Route"; +import "@fontsource/inter"; // Defaults to weight 400 +import "@fontsource/inter/400.css"; // Specify weight +import "@fontsource/inter/400-italic.css"; // Specify weight and style +import "@fontsource/neuton"; // Defaults to weight 400 +import "@fontsource/neuton/400.css"; // Specify weight +import "@fontsource/neuton/400-italic.css"; // Specify weight and style const Canvas = React.lazy(() => import("./index/Canvas")); const About = React.lazy(() => import("./about/AboutPage")); diff --git a/src/index/canvas.scss b/src/index/canvas.scss index 49b0f75..8037b05 100644 --- a/src/index/canvas.scss +++ b/src/index/canvas.scss @@ -7,10 +7,13 @@ main { background: black; color: white; z-index: -999; + overflow: hidden; } .welcome { text-align: center; position: absolute; top: calc(50% + 50px); + font-family: Neuton; + font-size: 30px; } \ No newline at end of file diff --git a/src/nav/nav.scss b/src/nav/nav.scss index 1c3910a..7911f91 100644 --- a/src/nav/nav.scss +++ b/src/nav/nav.scss @@ -50,4 +50,8 @@ nav>a{ display: flex; flex-grow: 1; gap: 15px; +} + +.nav { + font-family: Inter; } \ No newline at end of file diff --git a/src/router/Link.tsx b/src/router/Link.tsx index 3dedff8..117b3bb 100644 --- a/src/router/Link.tsx +++ b/src/router/Link.tsx @@ -9,7 +9,7 @@ export function Link(props: {className?: string, href: Path, replace?: boolean } const router = useRouter(); function onClick(event: React.MouseEvent) { - event.preventDefault(); +// event.preventDefault(); if(replace) { router.replacePage(props.href); } else {