Chneemann/join
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update btn contacts

Browse source
This commit is contained in:
Chneemann 2024-09-02 19:27:27 +02:00
parent c50ca2f507
commit 1b163ac134
2 changed files with 31 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/app/components/contacts/contact-detail/contact-detail.component.html
View file

@ -1,17 +1,19 @@
<section>
<div class="header">
<div class="headerline">
<div class="headline">
<div class="title">{{ "contacts.headline" | translate }}</div>
<div class="blue-bar"></div>
<div class="metrics-txt">
{{ "contacts.headlineDescription" | translate }}
</div>
</div>
<img
[ngClass]="{ 'd-none': !currentUserId }"
(click)="closeUserDetails()"
src="./../../../../assets/img/arrow-left.svg"
/>
<div class="btn-back">
<img
[ngClass]="{ 'd-none': !currentUserId }"
(click)="closeUserDetails()"
src="./../../../../assets/img/arrow-left.svg"
/>
</div>
</div>
@if (currentUserId) { @for (user of checkUserData(currentUserId); track user)
{

32
src/app/components/contacts/contact-detail/contact-detail.component.scss
View file

@ -2,20 +2,34 @@
display: flex;
justify-content: space-between;
align-items: center;
}
.btn-back {
display: flex;
justify-content: center;
align-items: center;
width: 38px;
height: 38px;
cursor: pointer;
img {
width: 32px;
height: 32px;
cursor: pointer;
&:hover {
width: 36px;
height: 36px;
background-color: var(--light-gray);
border-radius: 18px;
width: 22px;
height: 22px;
filter: brightness(0) saturate(100%) invert(56%) sepia(64%) saturate(570%)
hue-rotate(154deg) brightness(92%) contrast(92%);
}
&:hover {
background-color: var(--light-blue);
border-radius: 100%;
scale: 1.1;
img {
scale: 1.1;
filter: brightness(0) saturate(100%) invert(100%) sepia(0%)
saturate(7485%) hue-rotate(325deg) brightness(100%) contrast(104%);
}
}
}
.headerline {
.headline {
display: flex;
align-items: center;
position: relative;