format socials as list (im still learning...)

This commit is contained in:
do butterflies cry? 2026-02-04 01:53:04 +10:00
parent f132b754a5
commit 36dde64b61
3 changed files with 70 additions and 71 deletions

View file

@ -45,21 +45,46 @@ main {
font-size: 1.5em
}
socials-list {
.socials-list {
/* display: flex; */
/* flex-direction: column; */
/* gap: 1ch; */
/* align-content: centerr; */
/* align-items: start; */
list-style: none;
width: 45ch;
}
.socials-item {
display: flex;
flex-direction: column;
/* justify-content: start; */
align-content: centerr;
align-items: start;
gap: 1ch;
}
socials-item {
align-items: start;
gap: 12px;
padding: 8px 0;
border-bottom: 1px solid var(--theme-icon-off);
}
.icon-social {
.socials-icon {
width: 2ch;
height: 2ch;
object-fit: contain;
flex: 0 0 40px; /* fixed column */
}
.socials-name {
flex: 1 1 140px;
text-align: left;
min-width: 0; /* important to allow truncation if needed */
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.socials-link {
flex: 0 0 auto; /* fixed link column width; adjust as needed */
text-align: left;
color: var(--theme-link);
text-decoration: none;
white-space: nowrap;
}