Mirrors/BookStack
1
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2024-10-30 07:32:39 +01:00
Code Issues Releases Wiki Activity

Improved card list design

Browse Source 
- Removed border and rounded list item styles to make hover states have
  less edge detail and to align with other UI elements.
- In expanded-detail view, removed space used for entity description if
  there is not description content existing.
This commit is contained in:
Dan Brown 2022-05-14 12:54:23 +01:00
parent 60e319c4b4
commit e6864a9cff
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
2 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
resources/sass/_blocks.scss
View File

@ -66,7 +66,6 @@
@include lightDark(background-color, #FFF, #222); @include lightDark(background-color, #FFF, #222);
box-shadow: $bs-card; box-shadow: $bs-card;
border-radius: 3px; border-radius: 3px;
border: 1px solid transparent;
.body, p.empty-text { .body, p.empty-text {
padding: $-m; padding: $-m;
} }

8
resources/sass/_lists.scss
View File

@ -400,6 +400,7 @@ ul.pagination {
padding: $-s $-m; padding: $-s $-m;
display: flex; display: flex;
align-items: center; align-items: center;
gap: $-m;
background-color: transparent; background-color: transparent;
border: 0; border: 0;
width: 100%; width: 100%;
@ -409,7 +410,6 @@ ul.pagination {
color: #666; color: #666;
} }
> span:first-child { > span:first-child {
margin-inline-end: $-m;
flex-basis: 1.88em; flex-basis: 1.88em;
flex: none; flex: none;
} }
@ -449,7 +449,8 @@ ul.pagination {
} }
.card .entity-list-item:not(.no-hover):hover { .card .entity-list-item:not(.no-hover):hover {
@include lightDark(background-color, #F2F2F2, #2d2d2d) @include lightDark(background-color, #F2F2F2, #2d2d2d);
border-radius: 0;
} }
.card .entity-list-item .entity-list-item:hover { .card .entity-list-item .entity-list-item:hover {
background-color: #EEEEEE; background-color: #EEEEEE;
@ -519,6 +520,9 @@ ul.pagination {
font-size: $fs-m * 0.8; font-size: $fs-m * 0.8;
padding-top: $-xs; padding-top: $-xs;
} }
.entity-list-item p:empty {
padding-top: 0;
}
p { p {
margin: 0; margin: 0;
} }