feat: re-add socials and contacts section

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

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);
}
}