MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

styling changes 

*dmp-user-field > fit internal/external option
This commit is contained in:
Sofia Papacharalampous 2024-03-21 18:49:11 +02:00
parent efd6f5df47
commit 923872d3b8
2 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.html
View File

@ -34,10 +34,10 @@
<span *ngIf="!isUserSelected(userIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.435rem 0 0.435rem;">{{userIndex + 1}}</span> <span *ngIf="!isUserSelected(userIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.435rem 0 0.435rem;">{{userIndex + 1}}</span>
<mat-icon *ngIf="isUserSelected(userIndex)" [ngClass]="{'drag-handle-disabled': form.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon> <mat-icon *ngIf="isUserSelected(userIndex)" [ngClass]="{'drag-handle-disabled': form.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
</div> </div>
<div class="col-auto"> <div class="col-auto user-field">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style" [formControl]="user.get('userType')"> <mat-button-toggle-group name="fontStyle" aria-label="Font Style" [formControl]="user.get('userType')" class="w-100">
<div *ngFor="let userType of dmpUserTypeEnumValues"> <div *ngFor="let userType of dmpUserTypeEnumValues" class="col p-0">
<mat-button-toggle class="lang-button" [value]="userType">{{enumUtils.toDmpUserTypeString(userType)}}</mat-button-toggle> <mat-button-toggle class="lang-button w-100" [value]="userType">{{enumUtils.toDmpUserTypeString(userType)}}</mat-button-toggle>
</div> </div>
</mat-button-toggle-group> </mat-button-toggle-group>
</div> </div>

3
dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.scss
View File

@ -15,7 +15,7 @@
} }
@media (max-width:1400px) { @media (max-width:1600px) {
.user-fields { .user-fields {
flex-direction: column; flex-direction: column;
@ -23,5 +23,6 @@
.user-field { .user-field {
align-self: flex-start; align-self: flex-start;
width: 100%;
} }
} }