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

clean code

Browse source
This commit is contained in:
Chneemann 2024-06-14 16:39:15 +02:00
parent 61d85f958d
commit 9a797a8197
2 changed files with 15 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/app/components/main-chat/show-channel-member/show-channel-member.component.html
View file

@ -7,7 +7,7 @@
right: isSecondaryChatOpen ? '620px' : '' right: isSecondaryChatOpen ? '620px' : ''
}" }"
> >
<div class="posiotionHeader"> <div class="positionHeader">
<p>{{ "show-channel-member.header" | translate }}</p> <p>{{ "show-channel-member.header" | translate }}</p>
<app-small-btn <app-small-btn
[imgSrc]="'closeIcon.svg'" [imgSrc]="'closeIcon.svg'"
@ -21,7 +21,7 @@
<div class="positionOfAllUsersInBox"> <div class="positionOfAllUsersInBox">
@for(user of getFiltertUsers; track user){ @for(user of getFiltertUsers; track user){
<div class="user" (click)="openUserWindow(user)"> <div class="user" (click)="openUserWindow(user)">
<div class="positionImgs"> <div class="positionImg">
<img src="{{ user.avatar }}" class="avatarImg" /> <img src="{{ user.avatar }}" class="avatarImg" />
<img <img
src="./assets/img/{{ src="./assets/img/{{
@ -46,7 +46,7 @@
right: isSecondaryChatOpen ? '580px' : '' right: isSecondaryChatOpen ? '580px' : ''
}" }"
> >
<div class="posiotionHeader"> <div class="positionHeader">
<div class="headline"> <div class="headline">
<p>{{ "show-channel-member.addMember" | translate }}</p> <p>{{ "show-channel-member.addMember" | translate }}</p>
@if (getChannelName(currentChannel)) { @if (getChannelName(currentChannel)) {
@ -85,7 +85,7 @@
@for(user of getSearchedUser; track user){ @for(user of getSearchedUser; track user){
@if(!isUserAlreadySelected(user)) { @if(!isUserAlreadySelected(user)) {
<div class="userBox" (click)="chooseUser(user)"> <div class="userBox" (click)="chooseUser(user)">
<div class="positionImgsBox"> <div class="positionImgBox">
<img src="{{ user.avatar }}" class="addAvatarImg" /> <img src="{{ user.avatar }}" class="addAvatarImg" />
<img <img
src="./assets/img/{{ src="./assets/img/{{
@ -104,7 +104,7 @@
id="userName" id="userName"
name="userName" name="userName"
autocomplete="off" autocomplete="off"
class="inputfieldStyle" class="inputFieldStyle"
[(ngModel)]="userName" [(ngModel)]="userName"
(keyup)="filterUsers(userName)" (keyup)="filterUsers(userName)"
/> />
@ -113,7 +113,7 @@
<button <button
class="furterBtnClass" class="furterBtnClass"
[ngClass]="{ [ngClass]="{
furterBtnClass: getSelectedUsers.length > 0, btnClass: getSelectedUsers.length > 0,
disabledBtn: getSelectedUsers.length === 0 disabledBtn: getSelectedUsers.length === 0
}" }"
[disabled]="getSelectedUsers.length === 0" [disabled]="getSelectedUsers.length === 0"

18
src/app/components/main-chat/show-channel-member/show-channel-member.component.scss
View file

@ -24,7 +24,7 @@
@include displayFlex($g: 20px); @include displayFlex($g: 20px);
flex-direction: column; flex-direction: column;
.posiotionHeader { .positionHeader {
@include displayFlex($j: space-between); @include displayFlex($j: space-between);
font-size: 24px; font-size: 24px;
font-weight: 600; font-weight: 600;
@ -51,7 +51,7 @@
border-radius: 25px; border-radius: 25px;
} }
.positionImgs { .positionImg {
@include displayFlex($a: flex-end); @include displayFlex($a: flex-end);
.avatarImg { .avatarImg {
@ -95,7 +95,7 @@
border-top-right-radius: 0; border-top-right-radius: 0;
@include displayFlex($g: 20px); @include displayFlex($g: 20px);
flex-direction: column; flex-direction: column;
.posiotionHeader { .positionHeader {
@include displayFlex($j: space-between, $a: flex-start); @include displayFlex($j: space-between, $a: flex-start);
width: 100%; width: 100%;
.headline { .headline {
@ -162,7 +162,7 @@
} }
} }
.inputfieldStyle { .inputFieldStyle {
width: 100%; width: 100%;
flex-grow: 1; flex-grow: 1;
outline: none; outline: none;
@ -218,7 +218,7 @@
border-radius: 25px; border-radius: 25px;
} }
.positionImgsBox { .positionImgBox {
@include displayFlex($a: flex-end); @include displayFlex($a: flex-end);
.addAvatarImg { .addAvatarImg {
@ -243,7 +243,7 @@
@include displayFlex($j: flex-end); @include displayFlex($j: flex-end);
} }
.furterBtnClass { .btnClass {
width: 120px; width: 120px;
height: 48px; height: 48px;
background-color: white; background-color: white;
@ -278,7 +278,7 @@
top: 140px; top: 140px;
right: 20px; right: 20px;
width: 250px; width: 250px;
.posiotionHeader { .positionHeader {
font-size: 21px; font-size: 21px;
} }
} }
@ -288,7 +288,7 @@
top: 140px; top: 140px;
right: 20px; right: 20px;
width: 230px; width: 230px;
.posiotionHeader { .positionHeader {
.headline { .headline {
p { p {
font-size: 21px; font-size: 21px;
@ -315,7 +315,7 @@
font-size: 18px; font-size: 18px;
font-style: 600; font-style: 600;
} }
.positionImgsBox { .positionImgBox {
.addAvatarImg { .addAvatarImg {
width: 32px; width: 32px;
height: 32px; height: 32px;