cordova - cum să faci icoanele și butoanele mai mari în ionic 2


Cum pot face dimensiunea button și icon mai mare în codul următor:

<ion-card>
  <ion-card-header>
    Explore Nearby
  </ion-card-header>

  <ion-list>
    <button ion-item>
      <ion-icon name="cart" item-left></ion-icon>
      Shopping
    </button>

    <button ion-item>
      <ion-icon name="medical" item-left></ion-icon>
      Hospital
    </button>

    <button ion-item>
      <ion-icon name="cafe" item-left></ion-icon>
      Cafe
    </button>
  </ion-list>
</ion-card>

Răspuns #1

Pictograme

ion-icon-urile sunt pictograme de tip font, așa că pot fi editate folosind următorul Sass/CSS deoarece ele sunt, în esență, text:

    ion-icon {
        font-size: 20px; //Preferred size here
    }

Butonuri

În ceea ce privește button, Ionic are câteva clase încorporate pentru a influența dimensiunea. De exemplu:

   <button ion-button large>Large</button>

   <button ion-button>Default</button>

   <button ion-button small>Small</button>

De asemenea, poți actualiza variabila Sass implicită $button-round-padding în fișierul tău src/theme/variables.scss, la dimensiunea pe care o dorești. Mai multe despre butoane pot fi găsite aici

Răspunsul #2

În aplicațiile mele Ionic 4 am adoptat următoarea abordare. În fișierul *.scss:

ion-icon { zoom: 1.5 }

Desigur, valoarea zoom depinde de nevoile tale.
Sper că asta ajută pe cineva. o/