Ionic 2: machen Ion-Liste Elemente kleiner

Question

Es gibt eine ähnliche Frage here, aber es bezieht sich auf ionische 1, wo die ion-item immer noch ion-content hat. In ionic-2 gibt es nicht ionic-content. Ich habe versucht, die Höhe/Polsterung/Marge der tatsächlichen ion-item und der Klasse item-inner zu ändern und kann nicht scheinen, eine einheitliche "Skinning" der Ionen-Elemente zu bekommen.

Frage: Wie mache ich die Ionen-Elemente in einer Ion-Liste dünner/kleiner/nicht so groß in ionischen 2? Ps. Dies ist die Verwendung von ionischen 2 Beta 10

Answer 1

Ich fand, dass das Hauptproblem mit dieser in der nativen app.ios.css Datei sind zu ionische, dass die .item-Klasse, mit dem ion-item Element zugewiesen wird ein min-height ihm zugeordneten bekommt von 4.4 Rem. Ich bin mir nicht sicher, woher dieser Wert kommt oder warum er 4.4 ist. Also, meiner .scss Datei in der Liste gehören, habe ich nur noch:

.item { 
    min-height: 3rem; /* <- this can be whatever you need */ 
} 

Dies machte es so alle Änderungen, die ich an den Rand gemacht (ich landete Änderung der Marge auf 0 8px 0 0 respectively) von Die inneren Elemente haben tatsächlich die Höhe des Listenelements geändert, weil sie nicht gegen eine Einstellung für die minimale Höhe gestoßen sind. Siehe andere Antwort, wo der Rand geändert werden kann.

Ohne die Mindesthöhe des Listenelements zu ändern, haben Änderungen an den Rändern der inneren Elemente nichts bewirkt (zumindest für mich).

Answer 2

Ändern Sie die Ober-Unterseite-Polsterung auf <ion-label>. Die Standardeinstellung ist dies:

ion-label { 
    margin: 13px 8px 13px 0; 
}