Skip to content

Commit b901bf6

Browse files
tumms2021389tumms2021389
authored
Merge branch 'master' into fix/stylingIssues
2 parents e2a3598 + 5f0ddea commit b901bf6

File tree

7 files changed

+76
-40
lines changed

7 files changed

+76
-40
lines changed

‎packages/angular-sdk-components/src/lib/_components/field/selectable-card/selectable-card.component.html‎

Lines changed: 49 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); grid-auto-rows: 1fr; gap: 0.5rem">
1+
<div
2+
*ngIf="type === 'checkbox'"
3+
style="display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); grid-auto-rows: 1fr; gap: 0.5rem"
4+
>
25
<div *ngFor="let cardContent of contentList">
36
<mat-card [ngStyle]="cardStyle" appearance="outlined" (click)="cardSelect($event, cardContent.commonCardProps)">
47
<img
@@ -9,27 +12,15 @@
912
[ngStyle]="cardContent.cardImage.style"
1013
/>
1114
<mat-card-content>
12-
<div *ngIf="type === 'radio'">
13-
<mat-radio-button
14-
[checked]="radioBtnValue === cardContent?.commonCardProps?.key"
15-
[disabled]="disabled"
16-
[value]="cardContent.commonCardProps.key"
17-
(change)="fieldOnChange(cardContent.commonCardProps.key)"
18-
>
19-
{{ cardContent.commonCardProps.label }}
20-
</mat-radio-button>
21-
</div>
22-
<div *ngIf="type === 'checkbox'">
23-
<mat-checkbox
24-
[labelPosition]="'after'"
25-
[checked]="cardContent.commonCardProps.selected"
26-
[disabled]="disabled || readOnly"
27-
[attr.data-test-id]="testId + ':' + cardContent.commonCardProps.label"
28-
(change)="handleChangeMultiMode($event, cardContent.commonCardProps)"
29-
(blur)="fieldOnBlur()"
30-
>{{ cardContent.commonCardProps.label }}</mat-checkbox
31-
>
32-
</div>
15+
<mat-checkbox
16+
[labelPosition]="'after'"
17+
[checked]="cardContent.commonCardProps.selected"
18+
[disabled]="disabled || readOnly"
19+
[attr.data-test-id]="testId + ':' + cardContent.commonCardProps.label"
20+
(change)="handleChangeMultiMode($event, cardContent.commonCardProps)"
21+
(blur)="fieldOnBlur()"
22+
>{{ cardContent.commonCardProps.label }}</mat-checkbox
23+
>
3324
<div
3425
*ngFor="let field of cardContent.commonCardProps.fields"
3526
[ngStyle]="field.type !== 'TextArea' ? (field.name ? defaultStyle : noLabelStyle) : specialStyle"
@@ -41,3 +32,39 @@
4132
</mat-card>
4233
</div>
4334
</div>
35+
36+
<mat-radio-group
37+
*ngIf="type === 'radio'"
38+
style="display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); grid-auto-rows: 1fr; gap: 0.5rem"
39+
[name]="propName"
40+
[value]="radioBtnValue"
41+
(change)="fieldOnChange($event.value)"
42+
>
43+
<div *ngFor="let cardContent of contentList">
44+
<mat-card [ngStyle]="cardStyle" appearance="outlined" (click)="cardSelect($event, cardContent.commonCardProps)">
45+
<img
46+
*ngIf="cardContent.cardImage"
47+
mat-card-image
48+
src="{{ cardContent.cardImage.src }}"
49+
alt="{{ cardContent.cardImage.alt }}"
50+
[ngStyle]="cardContent.cardImage.style"
51+
/>
52+
<mat-card-content>
53+
<mat-radio-button
54+
[checked]="radioBtnValue === cardContent?.commonCardProps?.key"
55+
[disabled]="disabled"
56+
[value]="cardContent.commonCardProps.key"
57+
>
58+
{{ cardContent.commonCardProps.label }}
59+
</mat-radio-button>
60+
<div
61+
*ngFor="let field of cardContent.commonCardProps.fields"
62+
[ngStyle]="field.type !== 'TextArea' ? (field.name ? defaultStyle : noLabelStyle) : specialStyle"
63+
>
64+
<div>{{ field.name }}</div>
65+
<div>{{ field?.value?.getPConnect().getConfigProps().value ?? '--' }}</div>
66+
</div>
67+
</mat-card-content>
68+
</mat-card>
69+
</div>
70+
</mat-radio-group>

‎packages/angular-sdk-components/src/lib/_components/infra/action-buttons/action-buttons.component.html‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
<mat-grid-list *ngIf="arMainButtons$ && arSecondaryButtons$" cols="2" rowHeight="6.25rem">
2-
<mat-grid-tile>
1+
<div class="button-bar" *ngIf="arMainButtons$ && arSecondaryButtons$">
2+
<div class="left-group">
33
<button
44
*ngFor="let aButton of arSecondaryButtons$"
55
mat-stroked-button
@@ -8,10 +8,10 @@
88
>
99
{{ localizedVal(aButton.name, localeCategory) }}
1010
</button>
11-
</mat-grid-tile>
12-
<mat-grid-tile>
11+
</div>
12+
<div class="right-group">
1313
<button *ngFor="let aButton of arMainButtons$" mat-flat-button (click)="buttonClick(aButton.jsAction, 'primary')">
1414
{{ localizedVal(aButton.name, localeCategory) }}
1515
</button>
16-
</mat-grid-tile>
17-
</mat-grid-list>
16+
</div>
17+
</div>

‎packages/angular-sdk-components/src/lib/_components/infra/action-buttons/action-buttons.component.scss‎

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,23 @@
1+
.button-bar {
2+
box-sizing: border-box;
3+
display: flex;
4+
flex-direction: row;
5+
align-items: center;
6+
width: 100%;
7+
padding: 1rem;
8+
}
9+
10+
.left-group,
11+
.right-group {
12+
display: flex;
13+
gap: 1rem;
14+
}
15+
16+
.right-group {
17+
margin-left: auto;
18+
}
19+
120
.secondary-button {
221
background-color: var(--app-sys-secondary-button-background);
322
border-color: var(--app-sys-secondary-button-border);
4-
margin: 0 5px;
523
}

‎packages/angular-sdk-components/src/lib/_components/infra/action-buttons/action-buttons.component.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,12 @@
11
import { Component, Input, Output, EventEmitter } from '@angular/core';
22
import { CommonModule } from '@angular/common';
33
import { MatButtonModule } from '@angular/material/button';
4-
import { MatGridListModule } from '@angular/material/grid-list';
54

65
@Component({
76
selector: 'app-action-buttons',
87
templateUrl: './action-buttons.component.html',
98
styleUrls: ['./action-buttons.component.scss'],
10-
imports: [CommonModule, MatGridListModule, MatButtonModule]
9+
imports: [CommonModule, MatButtonModule]
1110
})
1211
export class ActionButtonsComponent {
1312
@Input() arMainButtons$: any[];

‎packages/angular-sdk-components/src/lib/_components/infra/assignment-card/assignment-card.component.scss‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
1-
.psdk-case-view-divider {
2-
border-bottom: 0.0625rem solid var(--mat-sys-outline-variant);
3-
}
4-
51
.psdk-flow-container {
62
padding: 0rem 1rem;
73
}

‎projects/angular-test-app/src/containerStyles.scss‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,6 @@ app-flow-container {
88
font-size: 0.8rem;
99
}
1010

11-
.psdk-case-view-divider {
12-
border-bottom: 0.0625rem solid var(--mat-sys-outline-variant);
13-
}
14-
1511
.psdk-flow-container-top {
1612
background-color: var(--mat-sys-surface-container);
1713
padding: 0.5rem 0.625rem;

‎projects/angular-test-app/src/styles.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ a.mat-mdc-menu-item > mat-icon {
6363
}
6464

6565
.psdk-grid-label {
66-
color: rgba(0, 0, 0, 0.54);
66+
color: var(--mat-sys-on-surface-variant);
6767
}
6868
.psdk-value {
6969
margin: 8px 0px;

0 commit comments

Comments
 (0)