about, home: wip page ordering, change paragraph
This commit is contained in:
parent
bc5dd7c663
commit
f2be4bef5c
4 changed files with 79 additions and 113 deletions
|
|
@ -441,6 +441,14 @@ home-content {
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
a {
|
||||
color: var(--darkerer-pink);
|
||||
|
||||
&:hover {
|
||||
color: var(--lavender)
|
||||
}
|
||||
}
|
||||
|
||||
welcome {
|
||||
margin-bottom: 3rem;
|
||||
text-align: center;
|
||||
|
|
@ -543,13 +551,6 @@ home-content {
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--darkerer-pink);
|
||||
|
||||
&:hover {
|
||||
color: var(--lavender)
|
||||
}
|
||||
}
|
||||
|
||||
article-body {
|
||||
padding-bottom: 1rem;
|
||||
|
|
@ -670,12 +671,21 @@ about {
|
|||
align-items: center;
|
||||
background-image: url(assets/gifs/beatingpurple.gif);
|
||||
border: 5px solid var(--darkerer-pink);
|
||||
font-size: 2rem;
|
||||
|
||||
|
||||
name {
|
||||
color: var(--pink);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
&#left {
|
||||
img {
|
||||
max-width: 10svw;
|
||||
padding: 2rem;
|
||||
width: 10svw;
|
||||
margin: 2rem;
|
||||
mix-blend-mode: hard-light;
|
||||
border: 5px solid var(--lavender);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -696,6 +706,12 @@ about {
|
|||
border: 5px solid var(--lavender);
|
||||
padding: 1rem 2rem;
|
||||
box-sizing: border-box;
|
||||
|
||||
introduction {
|
||||
font-size: 1.5rem;
|
||||
color: white;
|
||||
text-shadow: 0.5px 0.5px 0 var(--darkerer-pink), 0.5px -0.5px 0 var(--darkerer-pink), -0.5px 0.5px 0 var(--darkerer-pink), -0.5px -0.5px 0 var(--darkerer-pink), 0.5px 0px 0 var(--darkerer-pink), 0px 0.5px 0 var(--darkerer-pink), -0.5px 0px 0 var(--darkerer-pink), 0px -0.5px 0 var(--darkerer-pink);
|
||||
}
|
||||
}
|
||||
|
||||
[popover] {
|
||||
|
|
|
|||
|
|
@ -1,15 +1,31 @@
|
|||
<about>
|
||||
<!-- Ajouter cœur ici et tu peux l'examiner ou quoi, ça pourrait être cool -->
|
||||
<smaller-container id="left">
|
||||
<img src="/static/assets/images/pfp.webp" />
|
||||
<name>Agahnim</name>
|
||||
</smaller-container>
|
||||
<main-container>
|
||||
<!-- Ajouter cœur ici et tu peux l'examiner ou quoi, ça pourrait être cool, plus de créativité que juste le texte dans le div stp -->
|
||||
<!-- parler viole de gambe etc -->
|
||||
<button popovertarget="mainpopover">Salutttttttt</button>
|
||||
<introduction>
|
||||
In my personal life, I enjoy learning more about sociology, philosophy, particularly the aesthetics, and, to some
|
||||
extent, economics notably through the Regulation school, although I’m slightly less interested in the latter.
|
||||
<br /><br />
|
||||
|
||||
I am eager for aesthetic experiences, as evidenced by my SensCritique account, though it’s still sparse for now,
|
||||
as I tirelessly seek that feeling I first experienced while reading Boris Vian’s "J'irai cracher sur vos tombes".
|
||||
My favorite fields remain music and literature, but I’m open to any medium, such as film or the visual arts, and
|
||||
I’m trying to catch up in those areas! My tastes are quite varied, and I’d have a hard time defining them, but I
|
||||
in fact have a preference for Baroque music and more experimental sounds, though that’s not all of course.
|
||||
<br /><br />
|
||||
|
||||
Of course, I play video games like anyone who spends a fair amount of time on their computer, and I’m particularly
|
||||
enjoying playing Tekken 8 and Death Stranding right now, though my all-time favorite game will always be The
|
||||
Legend of Zelda: Skyward Sword; you can spot some references to it on this site if you look closely!
|
||||
</introduction>
|
||||
</main-container>
|
||||
<!-- <smaller-container> -->
|
||||
<!-- <p>Salut</p> -->
|
||||
<!-- </smaller-container> -->
|
||||
<mainpopover popover id="mainpopover">
|
||||
<p>Salut</p>
|
||||
</mainpopover>
|
||||
|
||||
</about>
|
||||
|
|
@ -1,10 +1,6 @@
|
|||
<home-content>
|
||||
<welcome>
|
||||
<img
|
||||
src="/static/assets/images/welcome.webp"
|
||||
width="400px"
|
||||
alt="A welcome text in pink"
|
||||
/>
|
||||
<img src="/static/assets/images/welcome.webp" width="400px" alt="A welcome text in pink" />
|
||||
<marquee>
|
||||
{% for _ in 0..12 %} 彡★Welcome to my little corner of the
|
||||
Web★彡 {% endfor %}
|
||||
|
|
@ -16,112 +12,54 @@
|
|||
it's still a <darkerer-pink>work in progress</darkerer-pink> but I'm sure
|
||||
you will see changes if you come back from time to time :) <br /><br />
|
||||
My name is <darkerer-pink>Agahnim</darkerer-pink>
|
||||
<pronouns>she/her</pronouns>, I'm a
|
||||
<darkerer-pink>developer</darkerer-pink> and
|
||||
<darkerer-pink>music producer</darkerer-pink> from
|
||||
<darkerer-pink>France</darkerer-pink> ! <br /><br />
|
||||
<pronouns>she/her</pronouns> and I do many things, but I more notably create <darkerer-pink>music</darkerer-pink>
|
||||
with my computer and my <a href="/about">instrument</a> (less notably). I also
|
||||
<darkerer-pink>develop</darkerer-pink> from time to time when a
|
||||
project piques my interest !<br /><br />
|
||||
I created this website not just to
|
||||
<darkerer-pink>improve</darkerer-pink> my web development skills, but also
|
||||
because it's <boing>fun</boing> to build a project like this. It's a
|
||||
small, personal space on the internet, away from the social climate, which
|
||||
is getting <shitty>worse and worse.</shitty> <br /><br />
|
||||
because it's <boing>fun</boing> to build a project like this. Having grown tired of social media, I find it
|
||||
particularly pleasant to have a little personal space that we’ve shaped in our own way; this way, it allows us to
|
||||
express ourselves without being overwhelmed by the increasingly <shitty>toxic social climate and the
|
||||
narrow-minded,
|
||||
unfounded opinions that pop up here and there</shitty>. <br /><br />
|
||||
This website is inspired by the
|
||||
<darkerer-pink>vaporwave aesthetic</darkerer-pink> and the old PCs I used
|
||||
to tinker with when I was a kid. I always liked this type of aesthetic and
|
||||
the mix of melancholy of comfort it brings me. It feels good to bring that
|
||||
vibe into one of my projects.
|
||||
the mix of melancholy of comfort it brings me.
|
||||
<badges>
|
||||
<img
|
||||
src="/static/assets/badges/88x31computer.gif"
|
||||
alt="88x31 pixel art badge with a retro computer"
|
||||
/>
|
||||
<img
|
||||
src="/static/assets/badges/cssisawesome.webp"
|
||||
alt="Badge with text 'CSS is Awesome'"
|
||||
/>
|
||||
<img
|
||||
src="/static/assets/badges/queer.webp"
|
||||
alt="Queer pride flag badge"
|
||||
/>
|
||||
<img
|
||||
width="100px"
|
||||
src="/static/assets/badges/skywardsword.webp"
|
||||
alt="Cover art for The Legend of Zelda Skyward Sword"
|
||||
/>
|
||||
<img
|
||||
src="/static/assets/badges/transrightsnow.webp"
|
||||
alt="Trans rights badge with text 'Trans Rights Now'"
|
||||
/>
|
||||
<img
|
||||
width="30%"
|
||||
src="/static/assets/badges/kirby.gif"
|
||||
alt="Kirby character animated GIF"
|
||||
/>
|
||||
<img
|
||||
width="30%"
|
||||
src="/static/assets/badges/pink.gif"
|
||||
alt="Pink animated pixel art badge"
|
||||
/>
|
||||
<img
|
||||
width="30%"
|
||||
src="/static/assets/badges/trans.gif"
|
||||
alt="Trans pride flag animated badge"
|
||||
/>
|
||||
<img src="/static/assets/badges/88x31computer.gif" alt="88x31 pixel art badge with a retro computer" />
|
||||
<img src="/static/assets/badges/cssisawesome.webp" alt="Badge with text 'CSS is Awesome'" />
|
||||
<img src="/static/assets/badges/queer.webp" alt="Queer pride flag badge" />
|
||||
<img width="100px" src="/static/assets/badges/skywardsword.webp"
|
||||
alt="Cover art for The Legend of Zelda Skyward Sword" />
|
||||
<img src="/static/assets/badges/transrightsnow.webp" alt="Trans rights badge with text 'Trans Rights Now'" />
|
||||
<img width="30%" src="/static/assets/badges/kirby.gif" alt="Kirby character animated GIF" />
|
||||
<img width="30%" src="/static/assets/badges/pink.gif" alt="Pink animated pixel art badge" />
|
||||
<img width="30%" src="/static/assets/badges/trans.gif" alt="Trans pride flag animated badge" />
|
||||
</badges>
|
||||
</box>
|
||||
<box id="smallbox">
|
||||
<socials-header> Socials ! </socials-header>
|
||||
<socials>
|
||||
<a href="https://github.com/naguiagahnim" target="_blank"
|
||||
><img
|
||||
src="/static/assets/icons/github.webp"
|
||||
width="30px"
|
||||
alt="GitHub logo"
|
||||
/></a>
|
||||
<a
|
||||
href="https://open.spotify.com/intl-fr/artist/4BPUhsH6krKkCNFrdMZnZF?si=E3luyIf0S_yfJRmm82S5OA"
|
||||
target="_blank"
|
||||
><img
|
||||
src="/static/assets/icons/spotify.webp"
|
||||
width="30px"
|
||||
alt="Spotify logo"
|
||||
/></a>
|
||||
<a href="https://www.instagram.com/agahnim_music/" target="_blank"
|
||||
><img
|
||||
src="/static/assets/icons/insta.webp"
|
||||
width="30px"
|
||||
alt="Instagram logo"
|
||||
/></a>
|
||||
<a href="https://github.com/naguiagahnim" target="_blank"><img src="/static/assets/icons/github.webp"
|
||||
width="30px" alt="GitHub logo" /></a>
|
||||
<a href="https://open.spotify.com/intl-fr/artist/4BPUhsH6krKkCNFrdMZnZF?si=E3luyIf0S_yfJRmm82S5OA"
|
||||
target="_blank"><img src="/static/assets/icons/spotify.webp" width="30px" alt="Spotify logo" /></a>
|
||||
<a href="https://www.instagram.com/agahnim_music/" target="_blank"><img src="/static/assets/icons/insta.webp"
|
||||
width="30px" alt="Instagram logo" /></a>
|
||||
</socials>
|
||||
<img
|
||||
width="200px"
|
||||
src="/static/assets/gifs/divider2.gif"
|
||||
alt="Decorative divider"
|
||||
/>
|
||||
<bibou-message
|
||||
>Consult the wisdom of the Bibou, if thou darest...</bibou-message
|
||||
>
|
||||
<img width="200px" src="/static/assets/gifs/divider2.gif" alt="Decorative divider" />
|
||||
<bibou-message>Consult the wisdom of the Bibou, if thou darest...</bibou-message>
|
||||
<bibou-container>
|
||||
<img
|
||||
class="boubou"
|
||||
src="/static/assets/images/boubou.webp"
|
||||
alt="Bibou endormi"
|
||||
/>
|
||||
<img
|
||||
class="bibou"
|
||||
src="/static/assets/images/bibou.webp"
|
||||
alt="Bibou éveillé"
|
||||
/>
|
||||
<img class="boubou" src="/static/assets/images/boubou.webp" alt="Bibou endormi" />
|
||||
<img class="bibou" src="/static/assets/images/bibou.webp" alt="Bibou éveillé" />
|
||||
</bibou-container>
|
||||
<bibou-text> </bibou-text>
|
||||
</box>
|
||||
<box id="newsbox">
|
||||
<website-news>
|
||||
<img
|
||||
width="70%"
|
||||
src="/static/assets/gifs/updates.gif"
|
||||
alt="Animated text 'Updates'"
|
||||
/>
|
||||
<img width="70%" src="/static/assets/gifs/updates.gif" alt="Animated text 'Updates'" />
|
||||
|
||||
{% for article in news %}
|
||||
<article-entry>
|
||||
|
|
@ -129,11 +67,7 @@
|
|||
{{ article.date.format("%d/%m/%Y") }}
|
||||
</time>
|
||||
<article-body> {{ article.body_html|safe }} </article-body>
|
||||
<img
|
||||
width="300px"
|
||||
src="/static/assets/gifs/divider2.gif"
|
||||
alt="Decorative divider"
|
||||
/>
|
||||
<img width="300px" src="/static/assets/gifs/divider2.gif" alt="Decorative divider" />
|
||||
</article-entry>
|
||||
{% else %}
|
||||
<ominous-message> Nothing to see here, for now... </ominous-message>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue