mirror of
https://codeberg.org/davrot/forgejo.git
synced 2025-07-09 13:00:02 +02:00
8b93f41aaa
Followup to https://codeberg.org/forgejo/forgejo/pulls/4760 * some refactoring * move rules out of repo.css to a new module * simplify selectors by omitting .list: it is now only used to style the list itself, they're still precise enough in scope of .user-cards * apply wrap/ellipsis to cards' content. Done via CSS to avoid spamming gt-ellipsis in the template * prevent cards with long content from taking horizontal space from other cards * prevent such cards from causing horizontal overflow on mobile * prevent varying card height, it doesn't look good even with text wrapping Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6799 Reviewed-by: Otto <otto@codeberg.org> Co-authored-by: 0ko <0ko@noreply.codeberg.org> Co-committed-by: 0ko <0ko@noreply.codeberg.org>
55 lines
976 B
CSS
55 lines
976 B
CSS
.user-cards .list {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
gap: 15px;
|
|
margin: 0 0 10px;
|
|
padding: 0;
|
|
}
|
|
|
|
@media (max-width: 767.98px) {
|
|
.user-cards .list {
|
|
grid-template-columns: repeat(1, 1fr);
|
|
}
|
|
}
|
|
|
|
@media (max-width: 900px) {
|
|
.user.profile .user-cards .list {
|
|
grid-template-columns: repeat(1, 1fr);
|
|
}
|
|
}
|
|
|
|
.user-cards .card {
|
|
display: flex;
|
|
flex-direction: row;
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 14px;
|
|
border-radius: 0.28571429rem;
|
|
border: 1px solid var(--color-secondary);
|
|
background: var(--color-box-body);
|
|
}
|
|
|
|
.user-cards .card,
|
|
.user-cards .card .content,
|
|
.user-cards .card .name,
|
|
.user-cards .card .meta {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.user-cards .card .avatar {
|
|
width: 48px;
|
|
height: 48px;
|
|
margin-right: 14px;
|
|
}
|
|
|
|
.user-cards .card .name {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
font-weight: var(--font-weight-normal);
|
|
}
|
|
|
|
.user-cards .card .meta {
|
|
margin-top: 5px;
|
|
}
|