Browse Source

Improve alignment

pull/4181/head
Thomas Kaul 8 months ago
parent
commit
a661ddee31
  1. 6
      apps/client/src/app/pages/pricing/pricing-page.html
  2. 6
      apps/client/src/app/pages/pricing/pricing-page.scss

6
apps/client/src/app/pages/pricing/pricing-page.html

@ -178,10 +178,12 @@
class="h-100" class="h-100"
[ngClass]="{ active: user?.subscription?.type === 'Premium' }" [ngClass]="{ active: user?.subscription?.type === 'Premium' }"
> >
<mat-card-content class="d-flex flex-column h-100">
@if (label) { @if (label) {
<mat-card-title>{{ label }}</mat-card-title> <div class="badge-container position-absolute text-right">
<span class="badge badge-warning m-1">{{ label }}</span>
</div>
} }
<mat-card-content class="d-flex flex-column h-100">
<div class="flex-grow-1"> <div class="flex-grow-1">
<div class="align-items-center d-flex mb-2"> <div class="align-items-center d-flex mb-2">
<h4 class="align-items-center d-flex flex-grow-1 m-0"> <h4 class="align-items-center d-flex flex-grow-1 m-0">

6
apps/client/src/app/pages/pricing/pricing-page.scss

@ -23,6 +23,12 @@
ion-icon[name='checkmark-circle-outline'] { ion-icon[name='checkmark-circle-outline'] {
color: rgba(var(--palette-primary-500), 1); color: rgba(var(--palette-primary-500), 1);
} }
.badge-container {
left: 0;
right: 0;
top: 0;
}
} }
} }

Loading…
Cancel
Save