How to add styles to ion-button inner text?


#1

So i have this:

<ion-button color="primary" size="large"  class="button-inner" style="min-width: 10em;" href="/home">
     open my <br />
     new app
</ion-button>

its all in capitals in two rows, how can i make “open my” be only capitalize and look like this “Open my” and how can i have “Open my” be smaller font size than “NEW APP”

I’ve tried using spans or p but i lose the two level text

my idea is something like this:

image

I’m using Ionic v4


#2

maybe?

<ion-label>open my</ion-label>
<ion-label text-uppercase>new app</ion-label>

or with a div

<div>
<ion-label>open my</ion-label>
<ion-label text-uppercase>new app</ion-label>
</div>

#3

Nope, tried that already and nothing


#4
<ion-button color="primary" size="large">
    <div>
      <p no-margin text-lowercase><ion-label>open my</ion-label></p>
      <p no-margin><ion-label text-uppercase>new app</ion-label></p>
    </div>
  </ion-button>


<br> tag does not work in <ion-item>