ui: refactor user-cards as a grid
This commit is contained in:
parent
c0dde47d37
commit
cad8d09ba8
3 changed files with 45 additions and 28 deletions
|
@ -2099,35 +2099,49 @@ td .commit-summary {
|
|||
}
|
||||
|
||||
.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 .list .card {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.user-cards .list .item {
|
||||
list-style: none;
|
||||
width: 31%;
|
||||
margin: 15px 15px 0 0;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 14px;
|
||||
float: left;
|
||||
border-radius: 0.28571429rem;
|
||||
border: 1px solid var(--color-secondary);
|
||||
background: var(--color-box-body);
|
||||
}
|
||||
|
||||
.user-cards .list .item .avatar {
|
||||
.user-cards .list .card .avatar {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
float: left;
|
||||
display: block;
|
||||
margin-right: 10px;
|
||||
margin-right: 14px;
|
||||
}
|
||||
|
||||
.user-cards .list .item .name {
|
||||
.user-cards .list .card .name {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-weight: var(--font-weight-normal);
|
||||
}
|
||||
|
||||
.user-cards .list .item .meta {
|
||||
.user-cards .list .card .meta {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue