update design

This commit is contained in:
Chneemann 2024-03-27 09:27:03 +01:00
parent ca40dc95b9
commit cac5a73353
2 changed files with 16 additions and 3 deletions

View file

@ -37,7 +37,7 @@ section {
top: -64px; top: -64px;
left: -64px; left: -64px;
width: 400px; width: 400px;
height: calc(100vh - 128px); min-height: calc(100vh - 128px);
background-color: var(--white); background-color: var(--white);
padding-top: 32px; padding-top: 32px;
box-shadow: 2px 0px 2px 0px rgba(0, 0, 0, 0.1); box-shadow: 2px 0px 2px 0px rgba(0, 0, 0, 0.1);
@ -46,14 +46,14 @@ section {
.content { .content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 48px 24px 24px 24px; padding: 24px;
} }
.first-letter { .first-letter {
font-size: 20px; font-size: 20px;
font-weight: 400; font-weight: 400;
padding-left: 38px; padding-left: 38px;
margin-bottom: 12px; margin: 32px 0 12px 0;
} }
.line { .line {
@ -101,3 +101,14 @@ section {
color: var(--light-blue); color: var(--light-blue);
} }
} }
@media screen and (max-width: 910px) {
.left-frame {
position: fixed;
top: 96px;
left: 0px;
width: 100vw;
min-height: calc(100vh - 207px);
background-color: var(--bgContent);
}
}

View file

@ -38,12 +38,14 @@ export class ContactsComponent {
} }
sortUsersFirstLetter() { sortUsersFirstLetter() {
this.usersFirstLetter = [];
this.usersFirstLetter = Array.from( this.usersFirstLetter = Array.from(
new Set(this.allUsers.map((user) => user.firstName[0].toUpperCase())) new Set(this.allUsers.map((user) => user.firstName[0].toUpperCase()))
); );
} }
sortUsersByFirstLetter() { sortUsersByFirstLetter() {
this.usersByFirstLetter = {};
this.allUsers.forEach((user) => { this.allUsers.forEach((user) => {
const firstLetter = user.firstName[0].toUpperCase(); const firstLetter = user.firstName[0].toUpperCase();
if (!this.usersByFirstLetter[firstLetter]) { if (!this.usersByFirstLetter[firstLetter]) {