Center contact icons in the footer
This commit changes the way contact icons are displayed in the footer: instead of using <li> tags which inherit a 30px left margin, they are now just simple <a> tags handled by flex to center them. The new style rules are added to the `.icons` class in `assets/css/theme.scss`. Signed-off-by: Filippo Fontana <filippofontana1998@gmail.com>
This commit is contained in:
parent
69acce5ec7
commit
eeba87cc3d
2 changed files with 7 additions and 14 deletions
|
|
@ -276,13 +276,10 @@ a.fn-item {
|
||||||
|
|
||||||
/* Footer Icons */
|
/* Footer Icons */
|
||||||
.icons {
|
.icons {
|
||||||
ol {
|
display: flex;
|
||||||
padding-left: 0;
|
justify-content: center;
|
||||||
}
|
gap: 30px;
|
||||||
|
padding: 8px;
|
||||||
li {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Footer Links */
|
/* Footer Links */
|
||||||
|
|
|
||||||
|
|
@ -19,13 +19,9 @@
|
||||||
|
|
||||||
{{ if ne .Site.Params.footer.showContactIcons false }}
|
{{ if ne .Site.Params.footer.showContactIcons false }}
|
||||||
<section class="icons">
|
<section class="icons">
|
||||||
<ol>
|
{{ range .Site.Params.contacts }}
|
||||||
{{ range .Site.Params.contacts }}
|
<a href="{{ .url }}" aria-label='{{ i18n "{{ .label }}" }}'><i class="{{ .icon }}"></i></a>
|
||||||
<li>
|
{{ end }}
|
||||||
<a href="{{ .url }}" aria-label='{{ i18n "{{ .label }}" }}'><i class="{{ .icon }}"></i></a>
|
|
||||||
</li>
|
|
||||||
{{ end }}
|
|
||||||
</ol>
|
|
||||||
</section>
|
</section>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue