diondiondion b43005ac12 [Glitch] Update collection account list design
Port 225069d1f2161c94c696c74405ce2a058154bafc to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
2026-04-02 18:28:47 +02:00

116 lines
1.8 KiB
SCSS

.header {
display: flex;
flex-direction: column;
gap: 12px;
padding: 24px;
}
.titleWithMenu {
display: flex;
align-items: start;
gap: 10px;
}
.titleWrapper {
flex-grow: 1;
display: flex;
flex-direction: column;
align-items: start;
gap: 4px;
min-width: 0;
}
.tag {
display: inline-block;
padding: 4px;
font-size: 13px;
font-weight: 500;
color: var(--color-text-secondary);
background: var(--color-bg-secondary);
}
.name {
font-size: 22px;
font-weight: 500;
line-height: 1.2;
overflow-wrap: anywhere;
}
.authorNote {
font-size: 13px;
color: var(--color-text-secondary);
a {
color: inherit;
text-decoration-color: rgb(from var(--color-text-secondary) r g b / 50%);
&:hover {
text-decoration: none;
}
}
}
.description {
font-size: 15px;
}
.headerButtonWrapper {
display: flex;
gap: 8px;
}
.iconButton {
box-sizing: content-box;
padding: 7px;
border-radius: 4px;
border: 1px solid var(--color-border-primary);
svg {
width: 20px;
height: 20px;
}
}
.itemList {
padding-inline: 24px;
}
.columnSubheading {
padding-bottom: 12px;
font-size: 15px;
font-weight: 500;
}
.accountItemWrapper {
display: flex;
align-items: start;
padding-block: 16px;
&[data-with-border='true'] {
border-bottom: 1px solid var(--color-border-primary);
}
:global(.account__note) {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
line-clamp: 3;
}
// Hide 'No description provided' message added by `Account` component
:global(.account__note--missing) {
display: none;
}
}
.accountItem {
--account-name-size: 15px;
--account-handle-color: var(--color-text-secondary);
--account-handle-size: 13px;
--account-bio-color: var(--color-text-primary);
--account-bio-size: 13px;
--account-outer-spacing: 0;
flex-grow: 1;
}