yann/hugo-scroll
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Center contact icons in the footer

Browse source 
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:
Filippo Fontana 2024-03-11 13:38:20 +01:00 • committed by zjedi
parent 69acce5ec7
commit eeba87cc3d
2 changed files with 7 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
assets/css/theme.scss
View file

@ -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 */

10
layouts/partials/footer.html
View file

@ -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 }}