Compare commits

...

3 Commits

  1. 2
      components/iconlink.tsx
  2. 21
      components/scrollme.tsx
  3. 24
      pages/index.tsx
  4. BIN
      public/favicon.ico
  5. 25
      styles/globals.css

@ -3,7 +3,7 @@ import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
import styled from "styled-components"
const ILink = styled.a`
font-size: 24px;
font-size: 1.5rem;
margin: 0 .4rem;
`

@ -0,0 +1,21 @@
import * as React from "react"
import { SVGProps } from "react"
const ScrollMe = (props: SVGProps<SVGSVGElement>) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="1em"
height="1em"
stroke="currentColor"
{...props}
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2.8}
d="m2 2 15.77 17.369a2 2 0 0 0 2.96 0L36.5 2"
/>
</svg>
)
export default ScrollMe

@ -2,11 +2,10 @@ import type {NextPageWithLayout} from "./_app"
import type { ReactElement } from "react"
import Layout from "../components/layout"
import styled from "styled-components"
import Link from "next/link"
import IconLink from "components/iconlink"
import {faEnvelope, faFolderOpen} from "@fortawesome/free-solid-svg-icons"
//import ScrollMe from "components/scrollme"
import {faEnvelope} from "@fortawesome/free-solid-svg-icons"
import {faGit, faGithub} from "@fortawesome/free-brands-svg-icons"
import Footer, {Spacer} from "components/footer"
export const Section = styled.section`
display: flex;
@ -18,6 +17,7 @@ export const Section = styled.section`
min-height: 100vh;
h2, h3 {
font-size: 2rem;
margin: 8px 0;
}
@ -27,7 +27,7 @@ export const Section = styled.section`
}
.topmargin {
margin-top: 2rem;
margin-top: 1rem;
}
ul li {
@ -50,7 +50,9 @@ export const Section = styled.section`
`
export const Code = styled.code`
background-color: var(--bg-dark);
font-family: monospace;
font-size: .9rem;
background-color: var(--bg-emph);
color: var(--fg-code);
border-radius: .4rem;
padding: .1rem .4rem;
@ -66,7 +68,6 @@ export const CList = styled.ul`
export const Nem = styled.span`
color: var(--fg-faded);
opacity: .8;
`
export const LinkList = styled.div`
@ -104,10 +105,10 @@ const Page: NextPageWithLayout = () => {
return (
<>
<Section>
<h2 id="about">$ whoami</h2>
<p>&gt; I am a {secondsToYears(getAge())} year old <em>Computer Science & Engineering student</em> with a passion for <em>programming</em>, <em>physics</em>, <em>mathematics</em> and anything <em>*NIX</em> <Nem>(Linux, UNIX etc)</Nem> related.</p>
<h2 id="about">/almqv</h2>
<p>I am a {secondsToYears(getAge())} year old <em>Computer Science & Engineering student</em> with a passion for <em>physics</em>, <em>programming</em>, <em>mathematics</em> and anything <em>*NIX</em> <Nem>(Linux, UNIX etc)</Nem> related.</p>
{/*TODO: Add GitHub code frequency/contrib here*/}
<p className="topmargin">Most of my projects are open-source, and if you are interested, you can find all of my projects on my <a href="https://git.wych.dev" target="_blank" rel="noreferrer">git-server</a> or <a href="https://github.com/almqv" target="_blank" rel="noreferrer">GitHub</a>. You can also check out <Link href="/projects">/projects</Link> to view all of my projects (including hardware projects and so on).</p>
<p className="topmargin">Most of my projects are open-source, and if you are interested, you can find all of my projects on my <a href="https://git.wych.dev/elal" target="_blank" rel="noreferrer">git-server</a> or <a href="https://github.com/almqv" target="_blank" rel="noreferrer">GitHub</a>.</p>
{/*
<div className="topmargin" id="img-container">
@ -117,10 +118,11 @@ const Page: NextPageWithLayout = () => {
<LinkList className="topmargin">
<IconLink href="#contact" icon={ faEnvelope } target="_self" rel="noreferrer"/>
<IconLink href="/projects" icon={ faFolderOpen } target="_self" rel="noreferrer"/>
{/*<IconLink href="/projects" icon={ faFolderOpen } target="_self" rel="noreferrer"/>*/}
<IconLink href="https://github.com/almqv" icon={ faGithub } target="_blank" rel="noreferrer"/>
<IconLink href="https://git.wych.dev" icon={ faGit } target="_blank" rel="noreferrer"/>
<IconLink href="https://git.wych.dev/elal" icon={ faGit } target="_blank" rel="noreferrer"/>
</LinkList>
</Section>
<Section>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

@ -1,3 +1,5 @@
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');
:root {
font-size: 16px;
--border-type: solid;
@ -5,29 +7,29 @@
--border-color: var(--fg-faded);
--border-radius: 1rem;
--content-max-width: 60rem;
--content-max-width: 850px;
--h-uni-padding: .8rem;
--v-uni-padding: .2rem;
--fg: #ebdbb2;
--fg: #E1DCCE;
color: var(--fg);
--fg-emph: #fbebe2;
/* --fg-emph: #fbebe2; */
--fg-emph: #EFE8D7;
--fg-faded: #928373;
--fg-button: var(--fg-faded);
--fg-link: #88aaa3;
--fg-link: #8398AC;
--fg-code: #ffbe85;
--fg-gold: #fff190;
--emph-shadow: 0 0 2px;
--bg: #1d2021;
--bg-dark: #282828;
--trans-time: .2s;
--bg: #181818;
--bg-emph: #242424;
--trans-time: 200ms;
}
* {
box-sizing: border-box;
font-family: "IBM Plex Mono", monospace;
font-family: "Open Sans", sans-serif;
padding: 0;
margin: 0;
}
@ -61,6 +63,7 @@ a:hover {
}
h1, h2, h3, h4, h5, em {
font-weight: normal;
color: var(--fg-emph);
}
@ -69,8 +72,8 @@ p {
}
em {
font-weight: normal;
/* font-weight: normal; */
font-style: normal;
text-shadow: var(--emph-shadow) currentColor;
/* text-shadow: var(--emph-shadow) currentColor; */
}

Loading…
Cancel
Save