finish the site (social cards) (finally)
This commit is contained in:
parent
ff9ed5cfc3
commit
fcd59381e5
14 changed files with 250 additions and 49 deletions
BIN
assets/socials/akkoma.png
Normal file
BIN
assets/socials/akkoma.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
assets/socials/amoguscloud.png
Normal file
BIN
assets/socials/amoguscloud.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 544 KiB |
BIN
assets/socials/firefish.png
Normal file
BIN
assets/socials/firefish.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 422 KiB |
BIN
assets/socials/gitgay.png
Normal file
BIN
assets/socials/gitgay.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
assets/socials/github.png
Normal file
BIN
assets/socials/github.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
BIN
assets/socials/idle.apng
Normal file
BIN
assets/socials/idle.apng
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
BIN
assets/socials/listenbrainz.png
Normal file
BIN
assets/socials/listenbrainz.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
assets/socials/matrix.png
Normal file
BIN
assets/socials/matrix.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 848 B |
BIN
assets/socials/retrospring.png
Normal file
BIN
assets/socials/retrospring.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 41 KiB |
BIN
assets/socials/revolt.png
Normal file
BIN
assets/socials/revolt.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
BIN
assets/socials/shitcord.png
Normal file
BIN
assets/socials/shitcord.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
BIN
assets/socials/xmpp.png
Normal file
BIN
assets/socials/xmpp.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
142
index.html
142
index.html
|
|
@ -5,11 +5,11 @@
|
||||||
<head>
|
<head>
|
||||||
<title>sneexy dot pages dot gay</title>
|
<title>sneexy dot pages dot gay</title>
|
||||||
<link rel="stylesheet" href="style.css">
|
<link rel="stylesheet" href="style.css">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
|
||||||
<div class="main">
|
<div class="main">
|
||||||
|
|
||||||
<div class="pixel-corners">
|
<div class="pixel-corners">
|
||||||
|
|
@ -31,42 +31,120 @@
|
||||||
<div class="pixel-corners">
|
<div class="pixel-corners">
|
||||||
<article class="links-n-socials">
|
<article class="links-n-socials">
|
||||||
<h1>~/links-n-socials</h1>
|
<h1>~/links-n-socials</h1>
|
||||||
<p>(in order of most prefered to least prefered!)</p>
|
<small>(in order of most prefered to least prefered! <span class="dot">●</span> some of these have extra info you can find by clicking their icons)</small>
|
||||||
|
|
||||||
<section class="social-lists">
|
<section class="fedi">
|
||||||
<section class="social-links">
|
<section class="firefish">
|
||||||
<h2>socials</h2>
|
<a href="https://joinfirefish.org" target="_blank">
|
||||||
<ul>
|
<img class="firefish-icon" src="/assets/socials/firefish.png" alt="Fediverse/Firefish"/>
|
||||||
<li class="fedi">@sneexy<small>@<a href="https://lea.pet/@sneexy" target="_blank">lea.pet</a></small></li>
|
</a>
|
||||||
<li class="revolt">Sneexy#3963<small>@<a href="https://revolt.chat" target="_blank">revolt.chat</a></small></li>
|
<p>@sneexy<small><a href="https://lea.pet/@sneexy" target="_blank">@lea.pet</a></small></p>
|
||||||
<li class="matrix">@sneexy<small>:<a href="https://matrix.to/#/@sneexy:tchncs.de" target="_blank">tchncs.de</a></small></li>
|
|
||||||
<li class="xmpp">sneexy<small>@<a href="xmpp:sneexy@trashserver.net" target="_blank">trashserver.net</a></small></li>
|
|
||||||
<li class="shitcord">Sneexy#6488<small>@<a href="https://discord.com" target="_blank">discord.com</a></small></li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="social-links">
|
<span class="dot2">●</span>
|
||||||
<h2>others</h2>
|
|
||||||
<ul>
|
|
||||||
<li class="fedi">@sneexy<small>@<a href="https://lea.pet/@sneexy" target="_blank">lea.pet</a></small></li>
|
|
||||||
<li class="revolt">Sneexy#3963<small>@<a href="https://revolt.chat" target="_blank">revolt.chat</a></small></li>
|
|
||||||
<li class="matrix">@sneexy<small>:<a href="https://matrix.to/#/@sneexy:tchncs.de" target="_blank">tchncs.de</a></small></li>
|
|
||||||
<li class="xmpp">sneexy<small>@<a href="xmpp:sneexy@trashserver.net" target="_blank">trashserver.net</a></small></li>
|
|
||||||
<li class="shitcord">Sneexy#6488<small>@<a href="https://discord.com" target="_blank">discord.com</a></small></li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section class="social-links">
|
<section class="akkoma">
|
||||||
<h2>misc.</h2>
|
<a href="https://akkoma.social" target="_blank">
|
||||||
<ul>
|
<img class="akkoma-icon" src="/assets/socials/akkoma.png" alt="Fediverse/Akkoma"/>
|
||||||
<li class="fedi">@sneexy<small>@<a href="https://lea.pet/@sneexy" target="_blank">lea.pet</a></small></li>
|
</a>
|
||||||
<li class="revolt">Sneexy#3963<small>@<a href="https://revolt.chat" target="_blank">revolt.chat</a></small></li>
|
<p>@sneexy<small><a href="https://akko.wtf/sneexy" target="_blank">@akko.wtf</a></small></p>
|
||||||
<li class="matrix">@sneexy<small>:<a href="https://matrix.to/#/@sneexy:tchncs.de" target="_blank">tchncs.de</a></small></li>
|
|
||||||
<li class="xmpp">sneexy<small>@<a href="xmpp:sneexy@trashserver.net" target="_blank">trashserver.net</a></small></li>
|
|
||||||
<li class="shitcord">Sneexy#6488<small>@<a href="https://discord.com" target="_blank">discord.com</a></small></li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
</section>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<span class="separator">
|
||||||
|
<small>───────────</small>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<section class="messaging">
|
||||||
|
<section class="revolt">
|
||||||
|
<a href="https://revolt.chat" target="_blank">
|
||||||
|
<img class="revolt-icon" src="/assets/socials/revolt.png" alt="Revolt"/>
|
||||||
|
</a>
|
||||||
|
<p>Sneexy#3963<small><a href="https://revolt.chat" target="_blank">@revolt.chat</a></small></p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<span class="dot2">●</span>
|
||||||
|
|
||||||
|
<section class="matrix">
|
||||||
|
<a href="https://matrix.org" target="_blank">
|
||||||
|
<img class="matrix-icon" src="/assets/socials/matrix.png" alt="Matrix"/>
|
||||||
|
</a>
|
||||||
|
<p>@sneexy<small><a href="https://matrix.to/#/@sneexy:tchncs.de" target="_blank">:tchncs.de</a></small></p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<span class="dot2">●</span>
|
||||||
|
|
||||||
|
<section class="xmpp">
|
||||||
|
<a href="https://xmpp.org" target="_blank">
|
||||||
|
<img class="xmpp-icon" src="/assets/socials/xmpp.png" alt="XMPP"/>
|
||||||
|
</a>
|
||||||
|
<p>sneexy<small><a href="xmpp:sneexy@trashserver.net" target="_blank">@trashserver.net</a></small></p>
|
||||||
|
</section>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<span class="separator">
|
||||||
|
<small>───────────</small>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<section class="platforms">
|
||||||
|
<section class="listenbrainz">
|
||||||
|
<a href="https://listenbrainz.org" target="_blank">
|
||||||
|
<img class="listenbrainz-icon" src="/assets/socials/listenbrainz.png" alt="Listenbrainz"/>
|
||||||
|
</a>
|
||||||
|
<p>Sneexy<small><a href="https://listenbrainz.org/user/Sneexy" target="_blank">@listenbrainz.org</a></small></p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<span class="dot2">●</span>
|
||||||
|
|
||||||
|
<section class="gitgay">
|
||||||
|
<a href="https://git.gay" target="_blank">
|
||||||
|
<img class="gitgay-icon" src="/assets/socials/gitgay.png" alt="Forgejo on git.gay"/>
|
||||||
|
</a>
|
||||||
|
<p>Sneexy<small><a href="https://git.gay/sneexy" target="_blank">@git.gay</a></small></p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<span class="dot2">●</span>
|
||||||
|
|
||||||
|
<section class="github">
|
||||||
|
<a href="https://github.com" target="_blank">
|
||||||
|
<img class="github-icon" src="/assets/socials/github.png" alt="GitHub"/>
|
||||||
|
</a>
|
||||||
|
<p>Sneexy<small><a href="https://github.com/sneexy-boi" target="_blank">@github.com</a></small></p>
|
||||||
|
</section>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<span class="separator">
|
||||||
|
<small>───────────</small>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<section class="misc">
|
||||||
|
<section class="retrospring">
|
||||||
|
<a href="https://retrospring.net" target="_blank">
|
||||||
|
<img class="retrospring-icon" src="/assets/socials/retrospring.png" alt="Retrospring - Ask me anything!"/>
|
||||||
|
</a>
|
||||||
|
<p>@Sneexy<small><a href="https://retrospring.net/@Sneexy" target="_blank">@retrospring.net</a></small></p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<span class="dot2">●</span>
|
||||||
|
|
||||||
|
<section class="dotfiles">
|
||||||
|
<a href="https://hyprland.org" target="_blank">
|
||||||
|
<img class="idle" src="/assets/socials/idle.apng" alt="Hyprland"/>
|
||||||
|
</a>
|
||||||
|
<p><a href="https://git.gay/sneexy/el-dotfiles" target="_blank">el-dotfiles</a></p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<span class="dot2">●</span>
|
||||||
|
|
||||||
|
<section class="shitposts">
|
||||||
|
<a href="https://nextcloud.com" target="_blank">
|
||||||
|
<img class="amoguscloud" src="/assets/socials/amoguscloud.png" alt="Nextcloud"/>
|
||||||
|
</a>
|
||||||
|
<p><a href="https://amogus.cloud/s/3jFf2eoppD38g3p" target="_blank">shitposts drive!</a></p>
|
||||||
|
</section>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<small class="warning">if you ABSOLUTELY need to contact me via discord, just ask me for my username. i'd highly prefer not using it though and if you could please use something else to contact me with.</small>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -97,7 +175,7 @@
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<img class="yoshi" src="/home/ruben/Git/pages/assets/yoshi.gif" alt="gif of a yoshi model dancing" />
|
<img class="yoshi" src="/assets/yoshi.gif" alt="GIF of a dancing yoshi" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
157
style.css
157
style.css
|
|
@ -326,6 +326,32 @@ a {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dot {
|
||||||
|
color: var(--accent-1);
|
||||||
|
text-shadow: 0px 0px 8px var(--accent-1);
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot2 {
|
||||||
|
color: var(--accent-1);
|
||||||
|
text-shadow: 0px 0px 8px var(--accent-1);
|
||||||
|
margin-top: 22px;
|
||||||
|
margin-left: 14px;
|
||||||
|
margin-right: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.separator {
|
||||||
|
display: flex;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-bottom: -1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.separator > small {
|
||||||
|
color: var(--bg-t);
|
||||||
|
}
|
||||||
|
|
||||||
.intro-box, .links-n-socials, .about-me, .fun-facts {
|
.intro-box, .links-n-socials, .about-me, .fun-facts {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -352,33 +378,126 @@ a {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* -- below is all the css used only for the social cards, and its probably Very Bad so get a puke bag or something read -- */
|
/* -- below is all the css used only for the social cards, and its probably Very Bad so get a puke bag or something read -- */
|
||||||
.social-lists {
|
.fedi, .firefish, .firefish-icon, .akkoma, .akkoma-icon, .messaging, .revolt, .revolt-icon, .matrix, .matrix-icon, .xmpp, .xmpp-icon, .platforms, .listenbrainz, .listenbrainz-icon, .gitgay, .gitgay-icon, .github, .github-icon, .misc, .retrospring, .retrospring-icon, .dotfiles, .idle, .shitposts, .amoguscloud, .warning {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
flex-direction: row;
|
||||||
|
margin-left: auto;
|
||||||
.social-links {
|
|
||||||
display: grid;
|
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
align-content: start;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.social-links > h2 {
|
.firefish-icon, .akkoma-icon, .revolt-icon, .matrix-icon, .xmpp-icon, .listenbrainz-icon, .gitgay-icon, .github-icon, .retrospring-icon, .idle, .amoguscloud {
|
||||||
margin-bottom: -7px;
|
margin-top: 20px;
|
||||||
|
margin-right: 8px;
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.social-links > ul {
|
/* -- fedi section -- */
|
||||||
margin-left: -22px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.fedi > small > a, .revolt > small > a, .matrix > small > a, .xmpp > small > a, .shitcord > small > a {
|
/* -- firefish -- */
|
||||||
|
.firefish > p > small, .firefish > p > small > a {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
|
background: #E74788;
|
||||||
|
background: linear-gradient(to right, #E74788 0%, #F6AE4A 100%);
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0px 0px 8px #F1775D;
|
||||||
|
}
|
||||||
|
/* -- */
|
||||||
|
|
||||||
|
/* -- akkoma -- */
|
||||||
|
.akkoma > p > small, .akkoma > p > small > a {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #CBA6D7;
|
||||||
|
text-shadow: 0px 0px 8px #CBA6D7;
|
||||||
|
}
|
||||||
|
/* -- */
|
||||||
|
|
||||||
|
/* -- messaging section -- */
|
||||||
|
|
||||||
|
/* -- revolt -- */
|
||||||
|
.revolt > p > small, .revolt > p > small > a {
|
||||||
|
font-size: 16px;
|
||||||
|
background: #FF4654;
|
||||||
|
background: linear-gradient(to right, #FF4654 0%, #FF558B 100%);
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0px 0px 8px #FF4654;
|
||||||
|
}
|
||||||
|
/* -- */
|
||||||
|
|
||||||
|
/* -- matrix -- */
|
||||||
|
.matrix > p > small, .matrix > p > small > a {
|
||||||
|
font-size: 16px;
|
||||||
|
background: #FFFFFF;
|
||||||
|
background: linear-gradient(to right, #FFFFFF 0%, #4B4B4B 100%);
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0px 0px 8px #4B4B4B;
|
||||||
|
}
|
||||||
|
/* -- */
|
||||||
|
|
||||||
|
/* -- xmpp -- */
|
||||||
|
.xmpp > p > small, .xmpp > p > small > a {
|
||||||
|
font-size: 16px;
|
||||||
|
background: #EED49F;
|
||||||
|
background: linear-gradient(to right, #A6DA95 0%, #EED49F 100%);
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0px 0px 8px #11A4D8;
|
||||||
|
}
|
||||||
|
/* -- */
|
||||||
|
|
||||||
|
/* -- other platforms that i guess count as social -- */
|
||||||
|
|
||||||
|
/* -- listenbrainz -- */
|
||||||
|
.listenbrainz > p > small, .listenbrainz > p > small > a {
|
||||||
|
font-size: 16px;
|
||||||
|
background: #DA9014;
|
||||||
|
background: linear-gradient(to right, #8AADf4 0%, #EB743B 100%);
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0px 0px 8px #D58C17;
|
||||||
|
}
|
||||||
|
/* -- */
|
||||||
|
|
||||||
|
/* -- git.gay -- */
|
||||||
|
.gitgay > p > small, .gitgay > p > small > a {
|
||||||
|
font-size: 16px;
|
||||||
|
background: #69CB86;
|
||||||
|
background: linear-gradient(to right, #FE9494 0%, #FFC783 31%, #69CB86 56%, #83A8FF 79%, #C56AD4 100%);
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0px 0px 8px #69CB86;
|
||||||
|
}
|
||||||
|
/* -- */
|
||||||
|
|
||||||
|
/* -- gith*b -- */
|
||||||
|
.github > p > small, .github > p > small > a {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #CDD6F4;
|
||||||
|
text-shadow: 0px 0px 8px #CDD6F4;
|
||||||
|
}
|
||||||
|
/* -- */
|
||||||
|
|
||||||
|
/* -- misc. links -- */
|
||||||
|
|
||||||
|
/* -- retrospring -- */
|
||||||
|
.retrospring > p > small, .retrospring > p > small > a {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #CA9EE6;
|
||||||
|
text-shadow: 0px 0px 8px #5E35B1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fedi {
|
/* -- lil warning message :3 -- */
|
||||||
list-style: url("/home/ruben/Documents/Unnamed.png");
|
.warning {
|
||||||
width: 10px;
|
margin-top: 3rem;
|
||||||
height: 10px;
|
text-align: center;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #E78284;
|
||||||
|
text-shadow: 0px 0px 8px #E78284;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* -- end of puke code -- */
|
/* -- end of puke code -- */
|
||||||
|
|
||||||
.yoshi {
|
.yoshi {
|
||||||
|
|
@ -414,8 +533,12 @@ a {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.social-lists {
|
.fedi, .messaging, .platforms, .misc, .shitcord, .warning {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dot2:not(:nth-child(1)) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
/* -- yea -- */
|
/* -- yea -- */
|
||||||
Loading…
Add table
Add a link
Reference in a new issue