alanorth/hugo-theme-bootstrap4-blog
1
0
Fork 0
mirror of https://github.com/alanorth/hugo-theme-bootstrap4-blog.git synced 2024-12-19 00:52:19 +01:00
Code Releases Activity

Update margin around sharing icons for Bootstrap v4 Alpha 6

Browse Source 
As of Alpha 6 there is no longer .nav-inline, so we need to add our
own class and apply our own margin.
This commit is contained in:
Alan Orth 2017-01-09 16:47:57 +02:00
parent 7d85c9a740
commit a6a384cc82
2 changed files with 5 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
layouts/partials/sharing-icons.html
View File

@ -1,6 +1,6 @@
<section> <section>
<h4>{{ i18n "share" }}</h4> <h4>{{ i18n "share" }}</h4>
<nav class="nav nav-inline"> <nav class="nav sharing-icons">
{{ if not (eq .Site.Params.sharingicons.facebook false) }}<a class="nav-item" href="https://www.facebook.com/sharer/sharer.php?u={{ .Permalink }}" title="Share on Facebook"><span class="fa fa-facebook fa-2x" aria-hidden="true"></span></a>{{ end }} {{ if not (eq .Site.Params.sharingicons.facebook false) }}<a class="nav-item" href="https://www.facebook.com/sharer/sharer.php?u={{ .Permalink }}" title="Share on Facebook"><span class="fa fa-facebook fa-2x" aria-hidden="true"></span></a>{{ end }}
{{ if not (eq .Site.Params.sharingicons.googleplus false) }}<a class="nav-item" href="https://plus.google.com/share?url={{ .Permalink }}" title="Share on Google+"><span class="fa fa-google-plus fa-2x" aria-hidden="true"></span></a>{{ end }} {{ if not (eq .Site.Params.sharingicons.googleplus false) }}<a class="nav-item" href="https://plus.google.com/share?url={{ .Permalink }}" title="Share on Google+"><span class="fa fa-google-plus fa-2x" aria-hidden="true"></span></a>{{ end }}
{{ if not (eq .Site.Params.sharingicons.linkedin false) }}<a class="nav-item" href="https://www.linkedin.com/shareArticle?mini=true&amp;url={{ .Permalink }}" title="Share on LinkedIn"><span class="fa fa-linkedin fa-2x" aria-hidden="true"></span></a>{{ end }} {{ if not (eq .Site.Params.sharingicons.linkedin false) }}<a class="nav-item" href="https://www.linkedin.com/shareArticle?mini=true&amp;url={{ .Permalink }}" title="Share on LinkedIn"><span class="fa fa-linkedin fa-2x" aria-hidden="true"></span></a>{{ end }}

4
source/scss/main.scss
View File

@ -160,6 +160,10 @@ article img {
height: auto; height: auto;
margin: 13px auto; margin: 13px auto;
} }
// add margin to sharing icons (except the first one)
.sharing-icons .nav-item+.nav-item {
margin-left: 1rem;
}
/* add a margin above the disqus comments only if the preceeding sharing section /* add a margin above the disqus comments only if the preceeding sharing section
is present (because sharing can be hidden, and the margin isn't always needed */ is present (because sharing can be hidden, and the margin isn't always needed */
section + #disqus_thread { section + #disqus_thread {