How to eliminate line under a card


I have created a list of two cards, when i apply the css effects to it, it show a line in the bottom border that i cant get rid of it

<ion-card class="size1">
            <ion-item href="/home" routerDirection="forward" class="item">
    --ion-font-family: 'NunitoSans';
    --ion-font-size: 115%;
    --ion-font-family: 'NunitoSans';
    background-color: var(--ion-color-step-800);
      --ion-background-color: transparent;

    color: var(--ion-color-step-150);     // to override global variable, dont use --ion
    font-weight: bold;

    background-color: var(--ion-color-light);
    box-shadow: 3px 3px 10px var(--ion-color-light-tint);

It is inside the app component, so these are in the variable .scss, it’s the side menu component.


You can set the lines attribute to none to remove the line from under the ion-item.