angular / angular/components

[Card] Extra margins show when using ripple

Ouverte
#10,898 14 commentaires 8 réactions 0 personnes assignées Voir sur GitHub
area: material/card area: material/core P3
Langage dominant
TypeScript
Étoiles
25k
Forks
6.8k
Merge moyen
1 j 8 h
PR mergées (30 j)
91

Description

When `matRipple` is added to a ``, the card expands on click.

Reproduction: https://stackblitz.com/edit/angular-1mherw?file=app/card-overview-example.html

This is due to the styling rule that says every element in the card except for the last should have bottom margin. When the ripple is added, the last element is no longer last and so it gains the margin bottom.

https://github.com/angular/material2/blob/master/src/lib/card/card.scss#L190

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par la règle de style située près de src/lib/card/card.scss#L190 et utilisez la reproduction StackBlitz liée pour observer l’agrandissement de la carte lorsque matRipple est ajouté à mat-card. La correction est terminée lorsque la carte ne gagne plus de marge inférieure supplémentaire et ne s’agrandit plus au clic, tout en conservant le comportement d’espacement actuel de la carte.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
angular
Domaine
frontend
Type d'issue
Bug
Difficulté
2/5
Temps estimé
1-3 heures
Activité
À l'abandon
Clarté
Clairement spécifiée
Accessibilité débutants
38/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.