<ion-header>
<ion-navbar>
<ion-title>SUBSCRIPTION</ion-title>
</ion-navbar>
</ion-header>
<ion-content>
<ion-item>
<ion-buttons end>
<button ion-button [disabled]="!isenabled" class="add_buttn" (click)="add_page()">Add/Edit</button>
</ion-buttons>
</ion-item>
<ion-label class="sentnc">Take your desired plan to get access to our content easily</ion-label>
<ion-row>
<ion-col col2>
<ion-card (click)="onCardClick()">
<!-- <div *ngIf="cardClicked"></div> -->
<ion-card-content>
<ion-card-title class="titles">
FREE
</ion-card-title>
<p>1 MONTH FREE</p>
<p>&nbsp;</p>
<p class="cost">₹0</p>
<p>&nbsp;</p>
<p>
<button (click)="free_pay()" ion-button color="dark" round>Choose plan</button>
</p>
</ion-card-content>
</ion-card>
</ion-col>
<ion-col col2>
<ion-card (click)="onCardClick()">
<ion-card-content>
<ion-card-title class="titles">
CLASSIC
</ion-card-title>
<p>6 MONTHS PLAN</p>
<p><del>₹150</del></p>
<p class="cost">₹100<sub>/month</sub></p>
<p>&nbsp;</p>
<p>
<button (click)="classic_pay()" ion-button color="dark" round>Choose plan</button>
</p>
</ion-card-content>
</ion-card>
</ion-col>
<ion-col>
<ion-card (click)="onCardClick()">
<ion-card-content>
<ion-card-title class="titles">
PREMIUM
</ion-card-title>
<p>1 YEAR PLAN</p>
<p><del>₹250</del></p>
<p class="cost">₹200<sub>/month</sub></p>
<p>&nbsp;</p>
<p>
<button (click)="premium_pay()" ion-button color="dark" round>Choose plan</button>
</p>
</ion-card-content>
</ion-card>
</ion-col>
</ion-row>
</ion-content>