sergiodj/binario
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add sharing buttons

Browse source
This commit is contained in:
vimux 2018-06-11 21:41:16 +03:00
parent 299ecd09ca
commit 6b36c1ca0a
No known key found for this signature in database
GPG key ID: 5A34FDC4EE832E34
7 changed files with 121 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
README.md
View file

@ -57,6 +57,16 @@ cardsPerRow = 2 # Possible values: 1, 2, 3
#mastodon = "username"
#medium = "username"
[Params.Share] # Post Share block
#facebook = true
#twitter = true
#reddit = true
#telegram = true
#linkedin = true
#googleplus = true
#vk = true
#pocket = true
# Web App Manifest settings
# https://www.w3.org/TR/appmanifest/
# https://developers.google.com/web/fundamentals/web-app-manifest/

7
i18n/en.yaml
View file

@ -8,6 +8,13 @@
- id: meta_categories
translation: Categories
# Share
- id: share-caption
translation: Share on
- id: save-caption
translation: Save to
# Related
- id: related_title
translation: Related

1
layouts/_default/single.html
View file

@ -10,6 +10,7 @@
{{ if .Params.tags }}
<footer class="post__footer">
{{ partial "post_tags.html" . }}
{{ partial "post_share.html" . }}
</footer>
{{ end }}
</article>

44
layouts/partials/post_share.html Normal file
View file

@ -0,0 +1,44 @@
{{- if and .IsPage (.Param "share") }}
<div class="post__share share">
{{- if .Param "share.facebook" }}
<a class="share__link" title="{{ T "share-caption" }} Facebook" href="https://www.facebook.com/sharer/sharer.php?u={{ .Permalink }}" target="_blank" rel="noopener noreferrer" onclick="window.open(this.href, '{{ T "share-caption" }} Facebook', 'width=800,height=600,toolbar=0,status=0'); return false">
{{ partial "svg/facebook.svg" (dict "class" "share__icon" ) }}
</a>
{{- end }}
{{- if .Param "share.twitter" }}
<a class="share__link" title="{{ T "share-caption" }} Twitter" href="https://twitter.com/intent/tweet/?url={{ .Permalink }}&amp;text={{ .Title }}" target="_blank" rel="noopener noreferrer" onclick="window.open(this.href, '{{ T "share-caption" }} Twitter', 'width=800,height=450,resizable=yes,toolbar=0,status=0'); return false">
{{ partial "svg/twitter.svg" (dict "class" "share__icon" ) }}
</a>
{{- end }}
{{- if .Param "share.reddit" }}
<a class="share__link" title="{{ T "share-caption" }} Reddit" href="https://www.reddit.com/submit?url={{ .Permalink }}&amp;title={{ .Title }}" target="_blank" rel="noopener noreferrer" onclick="window.open(this.href, '{{ T "share-caption" }} Reddit', 'width=832,height=624,toolbar=0,status=0'); return false">
{{ partial "svg/reddit.svg" (dict "class" "share__icon" ) }}
</a>
{{- end }}
{{- if .Param "share.telegram" }}
<a class="share__link" title="{{ T "share-caption" }} Telegram" href="https://t.me/share/url?url={{ .Permalink }}&amp;title={{ .Title }}" target="_blank" rel="noopener noreferrer" onclick="window.open(this.href, '{{ T "share-caption" }} Telegram', 'width=800,height=600,toolbar=0,status=0'); return false">
{{ partial "svg/telegram.svg" (dict "class" "share__icon" ) }}
</a>
{{- end }}
{{- if .Param "share.linkedin" }}
<a class="share__link" title="{{ T "share-caption" }} LinkedIn" href="https://www.linkedin.com/shareArticle?mini=true&url={{ .Permalink }}&title={{ .Title }}" target="_blank" rel="noopener noreferrer" onclick="window.open(this.href, '{{ T "share-caption" }} LinkedIn', 'width=640,height=480,toolbar=0,status=0'); return false">
{{ partial "svg/linkedin.svg" (dict "class" "share__icon" ) }}
</a>
{{- end }}
{{- if .Param "share.googleplus" }}
<a class="share__link" title="{{ T "share-caption" }} Google+" href="https://plus.google.com/share?url={{ .Permalink }}" target="_blank" rel="noopener noreferrer" onclick="window.open(this.href, '{{ T "share-caption" }} Google+', 'width=640,height=480,toolbar=0,status=0'); return false">
{{ partial "svg/googleplus.svg" (dict "class" "share__icon" ) }}
</a>
{{- end }}
{{- if .Param "share.vk" }}
<a class="share__link" title="{{ T "share-caption" }} VK" href="https://vk.com/share.php?url={{ .Permalink }}" target="_blank" rel="noopener noreferrer" onclick="window.open(this.href, '{{ T "share-caption" }} VK', 'width=640,height=480,toolbar=0,status=0'); return false">
{{ partial "svg/vk.svg" (dict "class" "share__icon" ) }}
</a>
{{- end }}
{{- if .Param "share.pocket" }}
<a class="share__link" title="{{ T "save-caption" }} Pocket" href="https://getpocket.com/edit?url={{ .Permalink }}&amp;title={{ .Title }}" target="_blank" rel="noopener noreferrer" onclick="window.open(this.href, '{{ T "save-caption" }} Pocket', 'width=480,height=320,toolbar=0,status=0'); return false">
{{ partial "svg/pocket.svg" (dict "class" "share__icon" ) }}
</a>
{{- end }}
</div>
{{- end }}

1
layouts/partials/svg/pocket.svg Normal file
View file

@ -0,0 +1 @@
<svg class="{{ .class }}" aria-label="Pocket" role="img" width="32" height="32" viewBox="0 0 512 512"><path d="M388.8 88.9H123.2A47.4 47.4 0 0 0 76 136.5v131.9c0 2.4.2 4.8.5 7.2a101.8 101.8 0 0 0-.5 10.6c0 75.6 80.6 137 180 137s180-61.4 180-137c0-3.6-.2-7.1-.5-10.6.3-2.4.5-4.8.5-7.2v-132A47.4 47.4 0 0 0 388.8 89zm-22.4 132.6l-93 93c-4.7 4.6-11 7-17.1 7a23.8 23.8 0 0 1-17.7-7l-93-93a24 24 0 0 1 33.8-33.8l76.6 76.5 76.6-76.5a24 24 0 0 1 33.8 33.8z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 458 B

1
layouts/partials/svg/reddit.svg Normal file
View file

@ -0,0 +1 @@
<svg class="{{ .class }}" aria-label="Reddit" role="img" width="32" height="32" viewBox="0 0 512 512"><path d="M375 146a32 32 0 1 0 0-64 32 32 0 0 0 0 64zM106 298a42 42 0 1 0 0-84 42 42 0 0 0 0 84zm301 0a42 42 0 1 0 0-84 42 42 0 0 0 0 84z"/><path fill-rule="evenodd" d="M271 93c1-4 5-7 10-6l73 15a8 8 0 0 1-4 16l-65-14-21 94a8 8 0 1 1-16-4l23-101z"/><path fill-rule="evenodd" d="M422 307c0 65-74 117-166 117S90 372 90 307s74-117 166-117 166 52 166 117zm-227 47a6 6 0 0 0-8 10c18 14 44 20 69 21 25 0 51-7 69-21a7 7 0 0 0-8-10c-15 12-38 18-61 18s-46-7-61-18zm-4-36a31 31 0 1 0 0-62 31 31 0 0 0 0 62zm161-31a31 31 0 1 1-62 0 31 31 0 0 1 62 0z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 648 B

58
static/css/main.css
View file

@ -674,7 +674,7 @@ mark {
.post__tag {
display: inline-block;
padding: .25rem .5rem;
margin: 0 .3125rem .3125rem 0;
margin: .25rem;
line-height: 1.5;
background: #111;
}
@ -707,6 +707,62 @@ mark {
font-weight: 700;
}
.post__footer {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-top: 1.5rem;
}
.post__tags {
display: flex;
flex-basis: 100%;
flex-wrap: wrap;
margin: 0 -.25rem auto;
}
.post__share {
display: flex;
flex-basis: 100%;
flex-wrap: wrap;
margin: 0 -.25rem auto;
}
@media screen and (min-width: 720px) {
.post__tags {
flex: 1 0 65%;
justify-content: flex-start;
}
.post__share {
flex: 1 0 35%;
justify-content: flex-end;
}
}
.share__link {
background-color: #111;
margin: .25rem;
font-size: 0;
}
.share__link:hover {
margin: .25rem;
text-decoration: none;
}
.share__icon {
fill: #f8ae00;
stroke: #f8ae00;
width: 32px;
height: 32px;
}
.share__icon:hover {
fill: #fff;
stroke: #fff;
}
.alignleft {
float: left;
margin: 1rem 1rem 1rem 0;