Certificates

V281-07

Een footer om certificaten weer te geven.

Hoe te gebruiken?

Pas in de config het veld 'navbar.footer.style' aan naar 'certificates' en kopieer onderstaande styling in je template.

Voorvertoning

Alvast beginnen met een basis opmaak?

CSS
Kopiërenfooter.nav-footer {
	background-color: var(--secondary);
	color: #fff;
}

footer .top {
	padding-bottom: 3rem;
	padding-top: 3rem;
}

footer .top .h3,
footer .top .title,
footer .top .nav-link:hover,
footer .top a:not(.text-decoration-none) {
	color: #fff;
}

footer .top .nav-item+.nav-item {
	margin-top: 0.5rem;
}

footer .top .h3-small {
	font-size: 1.25rem;
}

footer .top .nav-link {
	padding-left: 0;
}

footer .top .navlist-nav {
	margin-bottom: 0;
}

footer .top .nav-link:after {
	content: "\f061";
	font: var(--fa-font);
	font-size: 1em;
	font-weight: 400;
	margin-left: 0.5rem;
	transition: margin-left 200ms ease-out;
}

footer .top .nav-link:hover:after {
	margin-left: 1.5rem;
}

footer .footer-contact {
	margin-top: 1.5rem;
}

footer .footer-contact i[class^=fa] {
	color: var(--primary);
}

footer .footer-contact .btn.btn-link:not(.btn-admin) {
	line-height: 1.25;
	padding: 0;
	text-align: left;
}

footer .footer-contact .btn.btn-link:not(.btn-admin):active,
footer .footer-contact .btn.btn-link:not(.btn-admin):focus,
footer .footer-contact .btn.btn-link:not(.btn-admin):hover {
	color: #fff;
	text-decoration: underline;
}

footer .footer-socials a {
	color: #fff;
	font-size: 1.5em;
	margin-right: 1rem;
}

footer .footer-socials a:hover {
	color: var(--primary);
}

footer .footer-certificates .row {
	align-items: center;
}