<divclass="col-md-12 footer-container"><ul><li*ngFor="let link of links"><a[traverseTo]="link.remoteUrl"><i[class]="'glyphicon glyphicon-'+link.icon"></i>{{link.title}}</a></li></ul></div>
src/app/footer/footer.component.scss:
@import "../../variables.scss";
.footer-container {
background-color: darkgrey;
color: white;
}
ul {
display: flex;
}
li {
flex-grow: 1;
padding: 1em;
list-style: none;
text-align: center;
i, a {
display: block;
color: white;
}
a:hover {
text-decoration: none;
color: white;
}
i {
font-size: 130%;
}
}