mirror of
https://git.gay/Juli/about.git
synced 2025-06-24 18:38:49 +00:00
cleaned up
This commit is contained in:
parent
9ba6e838aa
commit
1e8e23b7cc
3 changed files with 233 additions and 176 deletions
120
index.html
120
index.html
|
@ -1,40 +1,94 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Juli's silly website</title>
|
||||
<link rel="stylesheet" href="/style.css">
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="author" content="Juli" />
|
||||
<meta content="juli's page" property="og:title" />
|
||||
<head>
|
||||
<title>Juli's silly website</title>
|
||||
<link rel="stylesheet" href="/style.css" />
|
||||
<meta charset="utf-8" />
|
||||
<meta name="author" content="Juli" />
|
||||
<meta content="juli's page" property="og:title" />
|
||||
<meta content="some furry's page" property="og:description" />
|
||||
<meta content="#f5c2e7" data-react-helmet="true" name="theme-color"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta content="#f5c2e7" data-react-helmet="true" name="theme-color" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="twitter:site" content="https://julimiro.eu" />
|
||||
<meta name="twitter:title" content="juli's website" />
|
||||
<meta name="twitter:description" content="a silly fur's page" />
|
||||
<meta name="twitter:title" content="juli's website" />
|
||||
<meta name="twitter:description" content="a silly fur's page" />
|
||||
<script src="/static/particle.js"></script>
|
||||
<script defer src="https://anal.julimiro.eu/script.js" data-website-id="7b1c38af-a272-41c0-a55b-ddb34141166f"></script>
|
||||
</head>
|
||||
<body>
|
||||
<noscript><style>.scriptonly {display: none;}</style></noscript>
|
||||
<script
|
||||
defer
|
||||
src="https://anal.julimiro.eu/script.js"
|
||||
data-website-id="7b1c38af-a272-41c0-a55b-ddb34141166f"
|
||||
></script>
|
||||
</head>
|
||||
<body>
|
||||
<noscript
|
||||
><style>
|
||||
.scriptonly {
|
||||
display: none;
|
||||
}
|
||||
</style></noscript
|
||||
>
|
||||
|
||||
<div id="particles-js"></div>
|
||||
<div class="page">
|
||||
<div class="content container">
|
||||
|
||||
|
||||
<h1>Juli's about</h1>
|
||||
<p>I am Juli, a Finnish pansexual genderfluid furry from '09(thats 15 years old). I go by Juli or Julimiro, I prefer it/its and she/her(in that order) but any are fine.</p>
|
||||
<p>I have a few coding projects which are on my <a href="https://gitlab.com/julimiro-waf">Gitlab</a></p>
|
||||
<div class="socials">
|
||||
<a alt="Website" rel="me" target="_blank" href="https://julimiro.eu"><img alt="Website" title="Website" width=50px height=50px src="/static/icons/www.svg" /></a>
|
||||
<a alt="Fediverse" rel="me" target="_blank" href="https://kitsunes.club/@juli"><img alt="Fediverse" title="Fediverse" width=50px height=50px src="/static/icons/fediverse.svg" /></a>
|
||||
<a alt="Last.fm" rel="me" target="_blank" href="https://www.last.fm/user/Julimiro"><img alt="Last.fm" title="Last.fm" width=50px height=50px src="/static/icons/lastfm.svg" /></a>
|
||||
<a alt="Pronouns-page" rel="me" target="_blank" href="https://en.pronouns.page/u/Julimiro"><img alt="Pronouns.page"title="prononuns.page" width=50px height=50px src="/static/icons/pronouns.svg" /></a>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</body>
|
||||
<div id="particles-js"></div>
|
||||
<div class="page">
|
||||
<div class="content container">
|
||||
<h1>Juli's about</h1>
|
||||
<p>
|
||||
I am Juli, a Finnish pansexual genderfluid furry from '09(thats 15
|
||||
years old). I go by Juli or Julimiro, I prefer it/its and she/her(in
|
||||
that order) but any are fine.
|
||||
</p>
|
||||
<p>
|
||||
More links can be found at
|
||||
<a href="https://links.julimiro.eu/">links.julimiro.eu</a>
|
||||
</p>
|
||||
<div class="socials">
|
||||
<a alt="Website" rel="me" target="_blank" href="https://julimiro.eu"
|
||||
><img
|
||||
alt="Website"
|
||||
title="Website"
|
||||
width="50px"
|
||||
height="50px"
|
||||
src="/static/icons/www.svg"
|
||||
/></a>
|
||||
<a
|
||||
alt="Fediverse"
|
||||
rel="me"
|
||||
target="_blank"
|
||||
href="https://kitsunes.club/@juli"
|
||||
><img
|
||||
alt="Fediverse"
|
||||
title="Fediverse"
|
||||
width="50px"
|
||||
height="50px"
|
||||
src="/static/icons/fediverse.svg"
|
||||
/></a>
|
||||
<a
|
||||
alt="Last.fm"
|
||||
rel="me"
|
||||
target="_blank"
|
||||
href="https://www.last.fm/user/Julimiro"
|
||||
><img
|
||||
alt="Last.fm"
|
||||
title="Last.fm"
|
||||
width="50px"
|
||||
height="50px"
|
||||
src="/static/icons/lastfm.svg"
|
||||
/></a>
|
||||
<a
|
||||
alt="Pronouns-page"
|
||||
rel="me"
|
||||
target="_blank"
|
||||
href="https://en.pronouns.page/u/Julimiro"
|
||||
><img
|
||||
alt="Pronouns.page"
|
||||
title="prononuns.page"
|
||||
width="50px"
|
||||
height="50px"
|
||||
src="/static/icons/pronouns.svg"
|
||||
/></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
<!-- trans rights :3 -->
|
||||
<!-- trans rights :3 -->
|
||||
|
|
20
readme.md
20
readme.md
|
@ -1,15 +1,19 @@
|
|||
This repo is the source for [about.julimiro.eu](https://about.julimiro.eu/). Below is a copy of the about page but in markdown form.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
juli@meowcity:~/about_me$ cat README.md
|
||||
|
||||
Hi!
|
||||
I am Juli a Finnish furry from '09(thats 15 years old). I go by Juli or Julimiro, i go by any pronouns.
|
||||
I am Juli, a Finnish pansexual genderfluid furry from '09(thats 15 years old). I go by Juli or Julimiro, I prefer it/its and she/her(in that order) but any are fine.
|
||||
More links can be found at [links.julimiro.eu](https://links.julimiro.eu/)
|
||||
|
||||
|
||||
<[https://julimiro.eu](https://julimiro.eu)>
|
||||
<[https://pawb.social/u/Juli](https://pawb.social/u/Juli)>
|
||||
<[https://eepykitty.lol/@juli](https://eepykitty.lol/@juli)>
|
||||
<[https://www.last.fm/user/Julimiro](https://www.last.fm/user/Julimiro)>
|
||||
|
||||
|
||||
|
||||
|
||||
<[@julikitsunes.club](https://kitsunes.club/@juli)>
|
||||
<[https://www.last.fm/user/Julimiro](https://www.last.fm/user/Julimiro)>
|
||||
|
||||
Meow
|
||||
|
|
269
style.css
269
style.css
|
@ -1,168 +1,167 @@
|
|||
@import url("https://api.fonts.coollabs.io/css2?family=Atkinson+Hyperlegible&display=swap");
|
||||
@import url('https://api.fonts.coollabs.io/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap');
|
||||
html, body{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
font-size: 1.1em;
|
||||
@import url("https://api.fonts.coollabs.io/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap");
|
||||
html,
|
||||
body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #cdd6f4;
|
||||
background-color: #1e1e2e;
|
||||
font-family: 'Atkinson Hyperlegible', 'Roboto Mono', Arial, sans-serif;
|
||||
|
||||
color: #cdd6f4;
|
||||
background-color: #1e1e2e;
|
||||
font-family: "Atkinson Hyperlegible", "Roboto Mono", Arial, sans-serif;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #f5c2e7;
|
||||
color: #f5c2e7;
|
||||
}
|
||||
a:hover {
|
||||
color: #f38ba8;
|
||||
color: #f38ba8;
|
||||
}
|
||||
.page {
|
||||
display: flex;
|
||||
width: 65%;
|
||||
margin: 0 auto;
|
||||
align-items: start;
|
||||
padding-top: 3em;
|
||||
display: flex;
|
||||
width: 65%;
|
||||
margin: 0 auto;
|
||||
align-items: start;
|
||||
padding-top: 3em;
|
||||
}
|
||||
.page .content{
|
||||
flex-grow: 7;
|
||||
padding: 0.25em;
|
||||
min-width: 68%;
|
||||
.page .content {
|
||||
flex-grow: 7;
|
||||
padding: 0.25em;
|
||||
min-width: 68%;
|
||||
}
|
||||
.page {
|
||||
max-width: 100%;
|
||||
text-align: center;
|
||||
max-width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
.content {
|
||||
max-width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
.page .sidebar {
|
||||
flex-grow: 3;
|
||||
min-width: 27%; /* this is highly cursed */
|
||||
max-width: 40%;
|
||||
|
||||
flex-grow: 3;
|
||||
min-width: 27%; /* this is highly cursed */
|
||||
max-width: 40%;
|
||||
}
|
||||
.container {
|
||||
border-color: #f5c2e7;
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
margin: 1em;
|
||||
background-color: #1e1e2e;
|
||||
padding: 0.6em;
|
||||
border-color: #f5c2e7;
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
margin: 1em;
|
||||
background-color: #1e1e2e;
|
||||
padding: 0.6em;
|
||||
}
|
||||
/* time to fix these cursed media queries */
|
||||
@media only screen and (min-width: 0px) and (max-width: 600px){
|
||||
.page {
|
||||
width: 100%;
|
||||
margin-top: 0;
|
||||
flex-direction: column-reverse;
|
||||
|
||||
}
|
||||
.container {
|
||||
margin: 0.5em;
|
||||
}
|
||||
.sidebar {
|
||||
min-width: 95% !important;
|
||||
/*max-width: 100% !important;*/
|
||||
width: 100% !important;
|
||||
|
||||
}
|
||||
.content {
|
||||
min-width: 95% !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
@media only screen and (min-width: 0px) and (max-width: 600px) {
|
||||
.page {
|
||||
width: 100%;
|
||||
margin-top: 0;
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
.container {
|
||||
margin: 0.5em;
|
||||
}
|
||||
.sidebar {
|
||||
min-width: 95% !important;
|
||||
/*max-width: 100% !important;*/
|
||||
width: 100% !important;
|
||||
}
|
||||
.content {
|
||||
min-width: 95% !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 600px) and (max-width: 1000px){
|
||||
.page {
|
||||
margin-top: 0;
|
||||
width: 85%;
|
||||
}
|
||||
@media only screen and (min-width: 600px) and (max-width: 1000px) {
|
||||
.page {
|
||||
margin-top: 0;
|
||||
width: 85%;
|
||||
}
|
||||
}
|
||||
|
||||
.page .sidebar header{
|
||||
text-align: right;
|
||||
.page .sidebar header {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
canvas {
|
||||
display: block;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
|
||||
#particles-js {
|
||||
z-index: -1;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #1e1e2e;
|
||||
background-image: url("");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: 50% 50%;
|
||||
}
|
||||
canvas {
|
||||
display: block;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
.content hr:last-of-type {
|
||||
display:none;
|
||||
}
|
||||
.socials {
|
||||
background-color: #fff;
|
||||
display: inline-block;
|
||||
padding:5px;
|
||||
padding-bottom: 0px;
|
||||
border: 2px solid #f5c2e7;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
#animal_img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
#gif_buttons {
|
||||
image-rendering: pixelated;
|
||||
}
|
||||
#particles-js {
|
||||
z-index: -1;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #1e1e2e;
|
||||
background-image: url("");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: 50% 50%;
|
||||
}
|
||||
|
||||
.breakword {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.content hr:last-of-type {
|
||||
display: none;
|
||||
}
|
||||
.socials {
|
||||
background-color: #fff;
|
||||
display: inline-block;
|
||||
padding: 5px;
|
||||
padding-bottom: 0px;
|
||||
border: 2px solid #f5c2e7;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
#animal_img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
#gif_buttons {
|
||||
image-rendering: pixelated;
|
||||
}
|
||||
|
||||
#analytics-iframe {
|
||||
border: unset;
|
||||
width: 100%;
|
||||
height: 30vh;
|
||||
}
|
||||
.breakword {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.qr {
|
||||
width: 20%;
|
||||
height: auto;
|
||||
#analytics-iframe {
|
||||
border: unset;
|
||||
width: 100%;
|
||||
height: 30vh;
|
||||
}
|
||||
|
||||
.qr {
|
||||
width: 20%;
|
||||
height: auto;
|
||||
}
|
||||
#kofiframe {
|
||||
overflow: hidden;
|
||||
}
|
||||
html.is-changing {
|
||||
view-transition-name: main;
|
||||
}
|
||||
|
||||
::view-transition-old(main) {
|
||||
animation: fade 0.5s ease-in-out both;
|
||||
}
|
||||
|
||||
::view-transition-new(main) {
|
||||
animation: fade 0.5s ease-in-out both reverse;
|
||||
}
|
||||
|
||||
@keyframes fade {
|
||||
from {
|
||||
opacity: 1;
|
||||
}
|
||||
#kofiframe {
|
||||
overflow: hidden;
|
||||
to {
|
||||
opacity: 0;
|
||||
}
|
||||
html.is-changing {
|
||||
view-transition-name: main;
|
||||
}
|
||||
|
||||
::view-transition-old(main) {
|
||||
animation: fade 0.5s ease-in-out both;
|
||||
}
|
||||
|
||||
::view-transition-new(main) {
|
||||
animation: fade 0.5s ease-in-out both reverse;
|
||||
}
|
||||
|
||||
@keyframes fade {
|
||||
from { opacity: 1; }
|
||||
to { opacity: 0; }
|
||||
}
|
||||
|
||||
html.is-changing:not(.swup-native) {
|
||||
transition: 0.25s opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
html.is-animating:not(.swup-native) {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
html.is-changing:not(.swup-native) {
|
||||
transition: 0.25s opacity;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
html.is-animating:not(.swup-native) {
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue