feat: info-icon with section change for policy cards in summary
MODIFY
src/app/components/my-apps-summary/my-apps-summary.component.html
src/app/components/my-apps-summary/my-apps-summary.component.html
<div class="policies">
<mat-card *ngFor="let policy of contract!.policies" class="example-card">
<mat-card-header>
- <mat-icon mat-card-avatar>analytics</mat-icon>
- <mat-card-title>Shiba Inu</mat-card-title>
+ <mat-icon color="primary" mat-card-avatar>tune</mat-icon>
+ <mat-card-title>Rate Limiting</mat-card-title>
</mat-card-header>
<mat-card-content>
- <p>
- The Shiba Inu is the smallest of the six original and distinct spitz
- breeds of dog from Japan
- </p>
+ <div class="limit-flex">
+ <div>
+ <p><b>300</b> requests per <b>day</b></p>
+ <p><b>150</b> / 300</p>
+ </div>
+ <div class="second">
+ <button (click)="setSectionToPolicies();" mat-icon-button color="primary" class="mt-10">
+ <mat-icon>info</mat-icon>
+ </button>
+ </div>
+ </div>
</mat-card-content>
</mat-card>
</div>

MODIFY
src/app/components/my-apps-summary/my-apps-summary.component.scss
src/app/components/my-apps-summary/my-apps-summary.component.scss
@@ -46,3 +46,14 @@ mat-form-field{
font-size: 32px;
width: 28px;
}
+
+.limit-flex{
+ display: flex;
+ align-items: flex-end;
+ justify-content: space-between;
+
+ .second{
+ top: 12px;
+ position: relative;
+ }
+}

MODIFY
src/app/components/my-apps-summary/my-apps-summary.component.ts
src/app/components/my-apps-summary/my-apps-summary.component.ts
@@ -8,7 +8,12 @@ import {IContractExt} from '../../interfaces/IContractExt';
})
export class MyAppsSummaryComponent implements OnInit {
@Input() contract?: IContractExt;
+
constructor() {}
ngOnInit(): void {}
+
+ setSectionToPolicies() {
+ this.contract!.section = 'policies';
+ }
}

MODIFY
src/app/components/my-apps/my-apps.component.scss
src/app/components/my-apps/my-apps.component.scss
.app-api-header-labels{
white-space: nowrap;
- margin-right: 3rem;
+ margin-right: 1.8rem;
text-align: right;
span{
margin-right: 16px;

feat: info-icon with section change for policy cards in summary