sd/site
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: re-add socials and contacts section

Browse source
This commit is contained in:
Ruben 2024-04-20 00:44:35 -05:00
commit 38dc005000
No known key found for this signature in database
GPG key ID: AE181294E97E4802
8 changed files with 144 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
assets/services/discord.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.4 KiB

BIN
assets/services/leapet.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 317 KiB

BIN
assets/services/matrix.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 393 B

BIN
assets/services/revolt.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2 KiB

BIN
assets/services/signal.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
assets/services/xmpp.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 8.8 KiB

39
index.html
View file

@ -57,6 +57,45 @@
</article>
</div>
<!-- socials -->
<div id="socials-and-contacts" class="terminal">
<div class="term-titlebar">
<img src="./assets/terminal.svg">
<p><a href="#socials-and-contacts">~/socials-and-contacts</a></p>
<div> <div id="minimize-btn"></div> <div id="maximize-btn"></div> <div id="close-btn"></div> </div>
</div>
<article>
<h1><a href="#socials-and-contacts">socials n' contacts</a></h1>
<p>you can find or contact me in these places i'm usually available and active on. <span style="color: var(--peach);">i <i>suck</i> at direct messages, if you try to contact me and i don't know you then chances are you'll get a response within the next 3028 years.</span></p>
<div class="socials-contacts-list">
<span class="social-container" id="fedi">
<a href="https://lea.pet" target="_blank"><img src="./assets/services/leapet.png" alt="Lea's Dungeon (Sharkey/Fediverse)" title="Lea's Dungeon (Sharkey/Fediverse)"></a>
<a href="https://lea.pet/@sneexy" target="_blank">@sneexy@lea.pet <small>(Fediverse)</small></a>
</span>
<span class="social-container" id="signal">
<a href="https://signal.org" target="_blank"><img src="./assets/services/signal.png" alt="Signal" title="Signal"></a>
<a href="https://signal.me/#eu/Ir_2xGMSoRqTs1BirNKBrL-fW0xsy5EAbuyBoFXO7nL1eTw22PBPlaN6_a6pwegK" target="_blank">Sneexy.66</a>
</span>
<span class="social-container" id="revolt">
<a href="https://revolt.chat" target="_blank"><img src="./assets/services/revolt.png" alt="Revolt" title="Revolt"></a>
<a href="https://revolt.chat" target="_blank">Sneexy#3963</a>
</span>
<span class="social-container" id="discord">
<a href="https://discord.com" target="_blank"><img src="./assets/services/discord.png" alt="Discord" title="Discord"></a>
<a href="<https://discord.com/users/984235958742425600>" target="_blank">ffmpeg_6.1.1.tar.xz</a>
</span>
<span class="social-container" id="xmpp">
<a href="https://xmpp.org" target="_blank"><img src="./assets/services/xmpp.png" alt="XMPP" title="XMPP"></a>
<a href="xmpp:sneexy@trashserver.net" target="_blank">sneexy@trashserver.net</a>
</span>
<span class="social-container" id="matrix">
<a href="https://matrix.org" target="_blank"><img src="./assets/services/matrix.png" alt="Matrix" title="Matrix"></a>
<a href="https://matrix.to/#/@sneexy:constellatory.net" target="_blank">@sneexy:constellatory.net</a>
</span>
</div>
</article>
</div>
<!-- "fun" facts -->
<div id="fun-facts" class="terminal">
<div class="term-titlebar">

105
style.css
View file

@ -353,6 +353,108 @@ about me section/terminal
text-align: center;
}
/*
socials and links
*/
.socials-contacts-list {
display: grid;
grid-template-columns: repeat(2, 1fr);
margin-bottom: .5em;
}
.social-container {
display: inline-flex;
align-items: center;
margin: .3em;
padding: .2em;
border-radius: 1em;
background-color: var(--crust);
p, a, small {
padding-left: 1mm;
padding-right: 1mm;
margin-top: .8mm;
margin-bottom: .8mm;
}
img {
width: 26px;
height: 26px;
padding-left: 1mm;
padding-right: 1mm;
margin-top: .8mm;
margin-bottom: .8mm;
display: flex;
}
}
#fedi {
background-color: color-mix(in srgb, var(--peach) 25%, transparent);
p, a, small {
color: var(--text);
text-decoration: none;
}
p:hover, a:hover {
color: var(--peach);
text-decoration: underline;
small {
color: var(--peach) !important;
text-decoration: underline;
}
}
}
#signal {
background-color: color-mix(in srgb, var(--sapphire) 25%, transparent);
p, a {
color: var(--text);
text-decoration: none;
}
p:hover, a:hover {
color: var(--sapphire);
text-decoration: underline;
}
}
#revolt {
background-color: color-mix(in srgb, var(--red) 25%, transparent);
p, a {
color: var(--text);
text-decoration: none;
}
p:hover, a:hover {
color: var(--red);
text-decoration: underline;
}
}
#discord {
background-color: color-mix(in srgb, var(--blue) 25%, transparent);
p, a {
color: var(--text);
text-decoration: none;
}
p:hover, a:hover {
color: var(--blue);
text-decoration: underline;
}
}
#xmpp {
background-color: color-mix(in srgb, var(--green) 25%, transparent);
p, a {
color: var(--text);
text-decoration: none;
}
p:hover, a:hover {
color: var(--green);
text-decoration: underline;
}
}
#matrix {
background-color: color-mix(in srgb, var(--flamingo) 25%, transparent);
p, a {
color: var(--text);
text-decoration: none;
}
p:hover, a:hover {
color: var(--flamingo);
text-decoration: underline;
}
}
/*
buttons
*/
@ -410,4 +512,7 @@ modify widths and spacing depending on the size of the display
margin-bottom: 0.7em;
padding: 10px 16px;
}
.socials-contacts-list {
grid-template-columns: repeat(1, 1fr);
}
}