Compare commits
3 commits
c870c2c7fc
...
b99bd58b70
| Author | SHA1 | Date | |
|---|---|---|---|
 Akemi Izuko
|
b99bd58b70
|
||
|
Akemi Izuko
|
390d9d27f5
|
||
|
Akemi Izuko
|
88033edd24
|
|
|
@ -6,29 +6,9 @@ import { SITE_TITLE } from '../consts';
|
||||||
<header style="width: 100%" class="font-sans sticky top-0 md:static bg-white underline-offset-4 z-40">
|
<header style="width: 100%" class="font-sans sticky top-0 md:static bg-white underline-offset-4 z-40">
|
||||||
<nav>
|
<nav>
|
||||||
<div class="flex items-center space-x-8">
|
<div class="flex items-center space-x-8">
|
||||||
<a href="https://git.mami2.moe/akemi/noway.moe" target="_blank">
|
<HeaderLink href="/"><img src="/akemi_silly_transparent.png" /></HeaderLink>
|
||||||
<span class="sr-only">Forgejo</span>
|
|
||||||
<svg class="forgejo-logo" viewBox="0 0 212 212" aria-hidden="true" width="32" height="32">
|
|
||||||
<style>
|
|
||||||
svg.forgejo-logo path{stroke-width: 25}
|
|
||||||
svg.forgejo-logo circle{stroke-width: 15}
|
|
||||||
svg.forgejo-logo .light{fill: none; stroke: #aaa;}
|
|
||||||
svg.forgejo-logo .dark{fill: none; stroke: #000;}
|
|
||||||
svg.forgejo-logo:hover .light{stroke: var(--accent-color);}
|
|
||||||
</style>
|
|
||||||
<g transform="translate(6,6)">
|
|
||||||
<path class="light" d="M58 168 v-98 a50 50 0 0 1 50-50 h20" />
|
|
||||||
<path class="dark" d="M58 168 v-30 a50 50 0 0 1 50-50 h20" />
|
|
||||||
<circle class="light" cx="142" cy="20" r="18" />
|
|
||||||
<circle class="dark" cx="142" cy="88" r="18" />
|
|
||||||
<circle class="dark" cx="58" cy="180" r="18" />
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
<HeaderLink href="/">Home</HeaderLink>
|
|
||||||
<HeaderLink href="/blog">Blog</HeaderLink>
|
<HeaderLink href="/blog">Blog</HeaderLink>
|
||||||
<HeaderLink href="/unix">Unix</HeaderLink>
|
<HeaderLink href="/unix">Unix</HeaderLink>
|
||||||
<HeaderLink href="/about">About</HeaderLink>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="fun-quote" style="margin: 0">
|
<div class="fun-quote" style="margin: 0">
|
||||||
<span style="font-family: var(--font-title);" class="text-2xl">ReLUwU activated</span>
|
<span style="font-family: var(--font-title);" class="text-2xl">ReLUwU activated</span>
|
||||||
|
|
@ -71,4 +51,7 @@ import { SITE_TITLE } from '../consts';
|
||||||
header nav div:last-child {
|
header nav div:last-child {
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
}
|
}
|
||||||
|
header nav img {
|
||||||
|
height: 48px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -3,60 +3,84 @@ import Layout from '../layouts/BlogPost.astro';
|
||||||
---
|
---
|
||||||
|
|
||||||
<Layout
|
<Layout
|
||||||
title="Akemi Izuko"
|
title="Akemi Izuko"
|
||||||
description="Lorem ipsum dolor sit amet"
|
description="Lorem ipsum dolor sit amet"
|
||||||
pubDate={new Date('December 25 2023')}
|
pubDate={new Date('December 25 2023')}
|
||||||
heroImage="https://cdn.discordapp.com/attachments/436012664003624970/1174809061221482506/Walpurgis.no.Yoru.full.543319.jpg?ex=6568f133&is=65567c33&hm=2e1cc082483d163dd0f2b994b27b79dd1509cf7a51eb68a51322178bf1ca4347&"
|
heroImage="https://cdn.discordapp.com/attachments/436012664003624970/1174809061221482506/Walpurgis.no.Yoru.full.543319.jpg?ex=6568f133&is=65567c33&hm=2e1cc082483d163dd0f2b994b27b79dd1509cf7a51eb68a51322178bf1ca4347&"
|
||||||
>
|
>
|
||||||
<p>
|
<p>
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
|
I'm Akemi, a 4th year CS honor student at
|
||||||
labore et dolore magna aliqua. Vitae ultricies leo integer malesuada nunc vel risus commodo
|
[UAlberta](https://www.ualberta.ca/computing-science/index.html). I'm
|
||||||
viverra. Adipiscing enim eu turpis egestas pretium. Euismod elementum nisi quis eleifend quam
|
usually on discord, but email is the best way to contact me.
|
||||||
adipiscing. In hac habitasse platea dictumst vestibulum. Sagittis purus sit amet volutpat. Netus
|
</p>
|
||||||
et malesuada fames ac turpis egestas. Eget magna fermentum iaculis eu non diam phasellus
|
|
||||||
vestibulum lorem. Varius sit amet mattis vulputate enim. Habitasse platea dictumst quisque
|
|
||||||
sagittis. Integer quis auctor elit sed vulputate mi. Dictumst quisque sagittis purus sit amet.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
Morbi tristique senectus et netus. Id semper risus in hendrerit gravida rutrum quisque non
|
Some of my interests include <a href="/unix">unix</a>,
|
||||||
tellus. Habitasse platea dictumst quisque sagittis purus sit amet. Tellus molestie nunc non
|
<a href="/road_bike.avif">biking</a>, llamas, 日本語とアニミ... 当たり
|
||||||
blandit massa. Cursus vitae congue mauris rhoncus. Accumsan tortor posuere ac ut. Fringilla urna
|
前じゃん and you (>ω^)
|
||||||
porttitor rhoncus dolor. Elit ullamcorper dignissim cras tincidunt lobortis. In cursus turpis
|
</p>
|
||||||
massa tincidunt dui ut ornare lectus. Integer feugiat scelerisque varius morbi enim nunc.
|
|
||||||
Bibendum neque egestas congue quisque egestas diam. Cras ornare arcu dui vivamus arcu felis
|
|
||||||
bibendum. Dignissim suspendisse in est ante in nibh mauris. Sed tempus urna et pharetra pharetra
|
|
||||||
massa massa ultricies mi.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
Mollis nunc sed id semper risus in. Convallis a cras semper auctor neque. Diam sit amet nisl
|
</p>
|
||||||
suscipit. Lacus viverra vitae congue eu consequat ac felis donec. Egestas integer eget aliquet
|
|
||||||
nibh praesent tristique magna sit amet. Eget magna fermentum iaculis eu non diam. In vitae
|
|
||||||
turpis massa sed elementum. Tristique et egestas quis ipsum suspendisse ultrices. Eget lorem
|
|
||||||
dolor sed viverra ipsum. Vel turpis nunc eget lorem dolor sed viverra. Posuere ac ut consequat
|
|
||||||
semper viverra nam. Laoreet suspendisse interdum consectetur libero id faucibus. Diam phasellus
|
|
||||||
vestibulum lorem sed risus ultricies tristique. Rhoncus dolor purus non enim praesent elementum
|
|
||||||
facilisis. Ultrices tincidunt arcu non sodales neque. Tempus egestas sed sed risus pretium quam
|
|
||||||
vulputate. Viverra suspendisse potenti nullam ac tortor vitae purus faucibus ornare. Fringilla
|
|
||||||
urna porttitor rhoncus dolor purus non. Amet dictum sit amet justo donec enim.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
Mattis ullamcorper velit sed ullamcorper morbi tincidunt. Tortor posuere ac ut consequat semper
|
</p>
|
||||||
viverra. Tellus mauris a diam maecenas sed enim ut sem viverra. Venenatis urna cursus eget nunc
|
|
||||||
scelerisque viverra mauris in. Arcu ac tortor dignissim convallis aenean et tortor at. Curabitur
|
|
||||||
gravida arcu ac tortor dignissim convallis aenean et tortor. Egestas tellus rutrum tellus
|
|
||||||
pellentesque eu. Fusce ut placerat orci nulla pellentesque dignissim enim sit amet. Ut enim
|
|
||||||
blandit volutpat maecenas volutpat blandit aliquam etiam. Id donec ultrices tincidunt arcu. Id
|
|
||||||
cursus metus aliquam eleifend mi.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
Tempus quam pellentesque nec nam aliquam sem. Risus at ultrices mi tempus imperdiet. Id porta
|
</p>
|
||||||
nibh venenatis cras sed felis eget velit. Ipsum a arcu cursus vitae. Facilisis magna etiam
|
|
||||||
tempor orci eu lobortis elementum. Tincidunt dui ut ornare lectus sit. Quisque non tellus orci
|
<p>
|
||||||
ac. Blandit libero volutpat sed cras. Nec tincidunt praesent semper feugiat nibh sed pulvinar
|
</p>
|
||||||
proin gravida. Egestas integer eget aliquet nibh praesent tristique magna.
|
|
||||||
</p>
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Vitae ultricies leo integer malesuada nunc vel risus commodo
|
||||||
|
viverra. Adipiscing enim eu turpis egestas pretium. Euismod elementum nisi quis eleifend quam
|
||||||
|
adipiscing. In hac habitasse platea dictumst vestibulum. Sagittis purus sit amet volutpat. Netus
|
||||||
|
et malesuada fames ac turpis egestas. Eget magna fermentum iaculis eu non diam phasellus
|
||||||
|
vestibulum lorem. Varius sit amet mattis vulputate enim. Habitasse platea dictumst quisque
|
||||||
|
sagittis. Integer quis auctor elit sed vulputate mi. Dictumst quisque sagittis purus sit amet.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Morbi tristique senectus et netus. Id semper risus in hendrerit gravida rutrum quisque non
|
||||||
|
tellus. Habitasse platea dictumst quisque sagittis purus sit amet. Tellus molestie nunc non
|
||||||
|
blandit massa. Cursus vitae congue mauris rhoncus. Accumsan tortor posuere ac ut. Fringilla urna
|
||||||
|
porttitor rhoncus dolor. Elit ullamcorper dignissim cras tincidunt lobortis. In cursus turpis
|
||||||
|
massa tincidunt dui ut ornare lectus. Integer feugiat scelerisque varius morbi enim nunc.
|
||||||
|
Bibendum neque egestas congue quisque egestas diam. Cras ornare arcu dui vivamus arcu felis
|
||||||
|
bibendum. Dignissim suspendisse in est ante in nibh mauris. Sed tempus urna et pharetra pharetra
|
||||||
|
massa massa ultricies mi.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Mollis nunc sed id semper risus in. Convallis a cras semper auctor neque. Diam sit amet nisl
|
||||||
|
suscipit. Lacus viverra vitae congue eu consequat ac felis donec. Egestas integer eget aliquet
|
||||||
|
nibh praesent tristique magna sit amet. Eget magna fermentum iaculis eu non diam. In vitae
|
||||||
|
turpis massa sed elementum. Tristique et egestas quis ipsum suspendisse ultrices. Eget lorem
|
||||||
|
dolor sed viverra ipsum. Vel turpis nunc eget lorem dolor sed viverra. Posuere ac ut consequat
|
||||||
|
semper viverra nam. Laoreet suspendisse interdum consectetur libero id faucibus. Diam phasellus
|
||||||
|
vestibulum lorem sed risus ultricies tristique. Rhoncus dolor purus non enim praesent elementum
|
||||||
|
facilisis. Ultrices tincidunt arcu non sodales neque. Tempus egestas sed sed risus pretium quam
|
||||||
|
vulputate. Viverra suspendisse potenti nullam ac tortor vitae purus faucibus ornare. Fringilla
|
||||||
|
urna porttitor rhoncus dolor purus non. Amet dictum sit amet justo donec enim.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Mattis ullamcorper velit sed ullamcorper morbi tincidunt. Tortor posuere ac ut consequat semper
|
||||||
|
viverra. Tellus mauris a diam maecenas sed enim ut sem viverra. Venenatis urna cursus eget nunc
|
||||||
|
scelerisque viverra mauris in. Arcu ac tortor dignissim convallis aenean et tortor at. Curabitur
|
||||||
|
gravida arcu ac tortor dignissim convallis aenean et tortor. Egestas tellus rutrum tellus
|
||||||
|
pellentesque eu. Fusce ut placerat orci nulla pellentesque dignissim enim sit amet. Ut enim
|
||||||
|
blandit volutpat maecenas volutpat blandit aliquam etiam. Id donec ultrices tincidunt arcu. Id
|
||||||
|
cursus metus aliquam eleifend mi.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Tempus quam pellentesque nec nam aliquam sem. Risus at ultrices mi tempus imperdiet. Id porta
|
||||||
|
nibh venenatis cras sed felis eget velit. Ipsum a arcu cursus vitae. Facilisis magna etiam
|
||||||
|
tempor orci eu lobortis elementum. Tincidunt dui ut ornare lectus sit. Quisque non tellus orci
|
||||||
|
ac. Blandit libero volutpat sed cras. Nec tincidunt praesent semper feugiat nibh sed pulvinar
|
||||||
|
proin gravida. Egestas integer eget aliquet nibh praesent tristique magna.
|
||||||
|
</p>
|
||||||
</Layout>
|
</Layout>
|
||||||
|
|
|
||||||
|
|
@ -7,12 +7,113 @@ import { SITE_TITLE, SITE_DESCRIPTION } from '../consts';
|
||||||
|
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
|
<BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
|
||||||
</head>
|
</head>
|
||||||
<body style="display: flex" class="font-sans flex-col items-center">
|
<body style="display: flex" class="font-sans flex-col items-center">
|
||||||
<Header class="grow" title={SITE_TITLE} />
|
<Header class="grow" title={SITE_TITLE} />
|
||||||
<img width="600px" src="/akemi_silly_transparent.png" />
|
<main>
|
||||||
<Footer />
|
<div id="big-circle-wrapper" >
|
||||||
</body>
|
<div id="big-circle"></div>
|
||||||
|
</div>
|
||||||
|
<div id="title-circle"></div>
|
||||||
|
<h1 id="name-title">
|
||||||
|
Akemi Izuko
|
||||||
|
</h1>
|
||||||
|
<p id="about">
|
||||||
|
I'm Akemi, a 4th year CS honor student at
|
||||||
|
<a href="https://www.ualberta.ca/computing-science/index.html">UAlberta</a>. I'm
|
||||||
|
usually on discord, but email is the best way to contact me.
|
||||||
|
Some of my interests include <a href="/unix">unix</a>,
|
||||||
|
<a href="/road_bike.avif">biking</a>, llamas, 日本語とアニミ... 当たり
|
||||||
|
前じゃん and you (>ω^)!
|
||||||
|
</p>
|
||||||
|
<img id="pfp" src="/akemi_silly_transparent.png" />
|
||||||
|
</main>
|
||||||
|
<Footer />
|
||||||
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
main {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr auto 20px 50%;
|
||||||
|
grid-template-rows: repeat(6, 1fr);
|
||||||
|
width: 100%;
|
||||||
|
min-height: 70vh;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
main a {
|
||||||
|
color: var(--accent-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
#name-title {
|
||||||
|
font-family: var(--font-title);
|
||||||
|
font-size: 96px;
|
||||||
|
text-align: right;
|
||||||
|
/* Grid styles */
|
||||||
|
grid-column-start: 2;
|
||||||
|
grid-column-end: 3;
|
||||||
|
grid-row-start: 2;
|
||||||
|
grid-row-end: 4;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#title-circle {
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: white;
|
||||||
|
width: 200px;
|
||||||
|
height: 200px;
|
||||||
|
box-shadow: 0 40px 50px -10px rgba(0, 0, 0, 0.1);
|
||||||
|
/* Grid styles */
|
||||||
|
grid-column: 1 / 2;
|
||||||
|
grid-row: 2 / 4;
|
||||||
|
justify-self: right;
|
||||||
|
margin-right: -120px;
|
||||||
|
margin-top: -10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#about {
|
||||||
|
max-width: 520px;
|
||||||
|
font-family: var(--font-sans);
|
||||||
|
font-size: 1.2rem;
|
||||||
|
line-height: 1.8;
|
||||||
|
/* Grid styles */
|
||||||
|
grid-column-start: 2;
|
||||||
|
grid-row-start: 4;
|
||||||
|
grid-row-end: 7;
|
||||||
|
justify-self: right;
|
||||||
|
align-self: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
#big-circle {
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: white;
|
||||||
|
width: 1500px;
|
||||||
|
height: 1500px;
|
||||||
|
box-shadow: 10px 60px 50px -10px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
#big-circle-wrapper {
|
||||||
|
width: 500px;
|
||||||
|
height: 160vh;
|
||||||
|
z-index: -1;
|
||||||
|
overflow: hidden;
|
||||||
|
position: absolute;
|
||||||
|
top: -60%;
|
||||||
|
left: 60%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#pfp {
|
||||||
|
width: 600px;
|
||||||
|
/* Grid styles */
|
||||||
|
grid-column-start: 4;
|
||||||
|
grid-column-end: 5;
|
||||||
|
grid-row-start: 1;
|
||||||
|
grid-row-end: 7;
|
||||||
|
justify-self: right;
|
||||||
|
align-self: bottom;
|
||||||
|
margin-right: -15%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue