mirrors/vector-im-hydrogen-web
1
0
Fork 0
mirror of https://github.com/vector-im/hydrogen-web.git synced 2024-10-04 22:01:20 +02:00
Code Issues Projects Releases Wiki Activity

align left panel to 4px grid better, and simply margins

Browse Source
This commit is contained in:
Bruno Windels 2020-10-08 10:29:30 +02:00
parent fd4b3d238f
commit c4cfb6f6d1
1 changed files with 19 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/ui/web/css/themes/element/theme.css
View File

@ -208,11 +208,11 @@ button.utility.grid.on {
.LeftPanel { .LeftPanel {
background: rgba(245, 245, 245, 0.90); background: rgba(245, 245, 245, 0.90);
font-size: 1.5rem; font-size: 1.5rem;
padding: 12px 0 0 8px; padding: 12px 8px 0 8px;
} }
.LeftPanel .utilities { .LeftPanel > :not(:first-child) {
margin-right: 8px; margin-top: 12px;
} }
.LeftPanel .utilities > :not(:first-child) { .LeftPanel .utilities > :not(:first-child) {
@ -228,36 +228,40 @@ button.utility.grid.on {
border: none; border: none;
} }
.LeftPanel ul { .LeftPanel .RoomList {
padding: 0; padding: 0;
margin: 0; margin-right: -8px; /* make scrollbar hit right edge of parent */
} }
.LeftPanel li { .RoomList li {
margin: 12px 0; margin: 0;
padding-right: 5px; padding-right: 8px;
/* vertical align */ /* vertical align */
align-items: center; align-items: center;
} }
.LeftPanel li.active { .RoomList li:not(:first-child) {
margin-top: 12px;
}
.RoomList li.active {
background: rgba(141, 151, 165, 0.1); background: rgba(141, 151, 165, 0.1);
border-radius: 5px; border-radius: 5px;
} }
.LeftPanel li > * { .RoomList li > * {
margin-right: 10px; margin-right: 8px;
} }
.LeftPanel .description { .RoomList .description {
align-items: baseline; align-items: baseline;
} }
.LeftPanel .name.unread { .RoomList .name.unread {
font-weight: 600; font-weight: 600;
} }
.LeftPanel .badge { .RoomList .badge {
min-width: 1.6rem; min-width: 1.6rem;
height: 1.6rem; height: 1.6rem;
border-radius: 1.6rem; border-radius: 1.6rem;
@ -271,7 +275,7 @@ button.utility.grid.on {
text-align: center; text-align: center;
} }
.LeftPanel .badge.highlighted { .RoomList .badge.highlighted {
background-color: #ff4b55; background-color: #ff4b55;
} }