FlandreScarle7/Fork-Awesome
1
0
Fork 0
mirror of https://github.com/ForkAwesome/Fork-Awesome.git synced 2024-12-26 21:41:31 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add share buttons for Diaspora and Mastodon on the homepage

Browse Source
This commit is contained in:
Julien Deswaef 2018-02-23 00:41:48 -05:00
parent d2a87d95be
commit c06d35b1b4
5 changed files with 52 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/doc/_includes/stripe-social.html
View File

@ -2,11 +2,37 @@
<div class="container">
<ul class="list-inline">
<li>
<iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=ForkAwesome&repo=Fork-Awesome&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
<input name="popup" id="overlay" class="overlay" type="radio">
<span class="share">
<label class="share-btn btn btn-xs diaspora" title="Share this page on Diaspora*" for="diaspora-share">
<i class="fa fa-diaspora" aria-hidden="true"></i> Spread
</label>
<input name="popup" id="diaspora-share" class="hidden" type="radio">
<span class="popup">
<label for="overlay"></label>
<input name="podurl" value="" placeholder="Diaspora URL (joindiaspora.con)" type="text"><button class="share-btn" type="submit" value="diaspora">OK</button>
</span>
</span>
</li>
<li>
<input name="popup" id="overlay" class="overlay" type="radio">
<span class="share">
<label class="share-btn btn btn-xs mastodon" title="Share this page on Mastodon" for="mastodon-share">
<i class="fa fa-mastodon" aria-hidden="true"></i> Toot
</label>
<input name="popup" id="mastodon-share" class="hidden" type="radio">
<span class="popup">
<label for="overlay"></label>
<input name="podurl" value="" placeholder="Mastodon URL (mastodon.social)" type="text"><button class="share-btn" type="submit" value="mastodon">OK</button>
</span>
</span>
</li>
<li class="tweet-btn hidden-phone">
<a href="https://twitter.com/share" class="twitter-share-button" data-url="{{ site.forkawesome.url }}" data-text="Fork Awesome, a fork of the iconic font and CSS framework" data-counturl="{{ site.forkawesome.legacy_url }}" data-count="horizontal">Tweet</a>
</li>
<li class="github-btn">
<iframe src="https://ghbtns.com/github-btn.html?user=ForkAwesome&repo=Fork-Awesome&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
</li>
</ul>
</div>
</div>

3
src/doc/_layouts/base.html
View File

@ -16,6 +16,7 @@
================================================== -->
<link rel="stylesheet" href="{{ page.relative_path }}assets/css/site.css">
<link rel="stylesheet" href="{{ page.relative_path }}assets/css/pygments.css">
<link rel="stylesheet" href="{{ page.relative_path }}assets/css/share.min.css">
<link rel="stylesheet" href="{{ page.relative_path }}assets/fork-awesome/css/fork-awesome.css">
<!--[if lt IE 9]>
@ -36,7 +37,7 @@
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/{{ site.jquery_validate.version }}/jquery.validate.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/{{ site.bootstrap.version }}/js/bootstrap.min.js"></script>
<script src="{{ page.relative_path }}assets/js/site.js"></script>
<script src="{{ page.relative_path }}assets/js/search.js"></script>
<script src="{{ page.relative_path }}assets/js/share.min.js"></script>
</body>
</html>

1
src/doc/assets/css/share.min.css vendored Normal file
View File

@ -0,0 +1 @@
.rounded{border-radius:6px}.oval{border-radius:15px}.circle{border-radius:50%}.wo-text{width:34px}.dex-btn,.popup button{cursor:pointer}.dex-btn{font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Helvetica Neue,Open Sans,Cantarell,sans-serif;display:inline-block;height:34px;line-height:1.6;color:#fff;text-align:center;text-decoration:none;font-size:.85rem;margin:0 .2em;border:none;padding-top:4px;box-sizing:border-box}.dex-btn span,.dex-icon{vertical-align:middle}.dex-btn,.dex-btn span{font-weight:700}.share{display:inline-block;max-height:40px}.share .dex-btn:not(.wo-text),.support:not(.wo-text){padding:4px 12px 4px 10px}.share .dex-btn:not(.wo-text) .dex-icon,.support:not(.wo-text) .dex-icon{margin-right:8px}.dex-icon{fill:#fff}.hidden,.hidden+.popup,.overlay{display:none}.hidden:checked+.popup{position:absolute;min-width:255px;margin-top:.8em;padding:.5em;z-index:3;background-color:#333;border-radius:.5em;display:inline-block}.hidden:checked+.popup:before{content:"";position:absolute;top:-.7em;height:0;width:0;border-bottom:.8em solid #141414;border-left:.8em solid transparent;border-right:.8em solid transparent;z-index:3}.popup input{min-width:190px;height:25px}.popup button{margin:2.5px 0 2.5px 5px;height:28px;width:44px}.popup label{position:fixed;top:0;left:0;right:0;bottom:0;z-index:-1;background-color:rgba(0,0,0,.5)}.diaspora{background-color:#222}.diaspora:hover{background-color:#000}.mastodon{background-color:#3088d4}.mastodon:hover{background-color:#1074cb}.hubzilla{background-color:#43488a}.hubzilla:hover{background-color:#363b7d}.gnusocial{background-color:#a22430}.gnusocial:hover{background-color:#900d19}.friendica{background-color:#ffb900}.friendica:hover{background-color:#ebaa00}.socialhome{background-color:#4c4c4c}.socialhome:hover{background-color:#423c3c}.postactiv{background-color:#ad68d5}.postactiv:hover{background-color:#a44fd5}.pumpio{background-color:#000}.pumpio:hover{background-color:#333}.diaspora-bright{background-color:#141414}.diaspora-bright:hover{background-color:#000}.mastodon-bright{background-color:#054dff}.mastodon-bright:hover{background-color:#003cd1}.hubzilla-bright{background-color:#311b92}.hubzilla-bright:hover{background-color:#231367}.gnusocial-bright{background-color:#b90d1e}.gnusocial-bright:hover{background-color:#890a16}.friendica-bright{background-color:#ff8f00}.friendica-bright:hover{background-color:#ff7a00}.socialhome-bright{background-color:#303636}.socialhome-bright:hover{background-color:#212727}.postactiv-bright{background-color:#b030f9}.postactiv-bright:hover{background-color:#a20af7}.support-liberapay{background-color:#f6c915;color:#0e0e0e}.support-liberapay:hover{background-color:#ffb900}.support-snowdrift{background-color:#13628e}.support-snowdrift:hover{background-color:#024d76}.support-ocollective{background-color:#7fadf2}.support-ocollective:hover{background-color:#4992ff}.support-gratipay{background-color:#630}.support-gratipay:hover{background-color:#4d2600}.support-liberapay .dex-icon{fill:#0e0e0e}@media screen and (max-width:64em){.dex-btn{margin:.5em .2em}}@media screen and (max-width:47.938em){.share{display:inline-block}}

1
src/doc/assets/js/share.min.js vendored Normal file
View File

@ -0,0 +1 @@
"use strict";document.addEventListener("DOMContentLoaded",function(){function e(e){if(e.match(/^https:\/\//i))return e;var t=e.split("/").filter(function(e){return e.indexOf(".")>-1});return"https://"+encodeURIComponent(t)}for(var t=document.querySelector("h1"),n=document.querySelector("head").querySelector("title"),o=document.querySelector('meta[property="og:title"]'),r=null===n?"":n.textContent,i=null===o?"":o.content,l=null===t?"":t.textContent,u=r||i||l,a=encodeURIComponent(window.location.href),c=document.querySelectorAll(".share-btn"),d=[],s=0;s<c.length;s++)d.push(c[s]);for(var p=document.querySelectorAll(".popup input"),f=[],h=0;h<p.length;h++)f.push(p[h]);var m=function(t){var n="podurl"!==t.target.name,o=n?t.target.value:t.target.nextSibling.value,r=n?t.target.previousSibling.value:t.target.value,i=encodeURI(u).replace(/%20/g,"+"),l=e(r);if("diaspora"===o||"friendica"===o||"socialhome"===o)window.open(l+"/bookmarklet?url="+a+"&title="+i);else if("gnusocial"===o)window.open(l+"/notice/new?status_textarea="+i+"&"+a);else if("mastodon"===o)window.open(l+"/share?text="+i+" "+a);else{if("hubzilla"!==o)return;window.open(l+"/rpost?f=&url="+a+"&title="+i)}};d.forEach(function(e){return e.addEventListener("click",m,!1)}),f.forEach(function(e){return e.addEventListener("keypress",function(e){13===e.keyCode&&m(e)})})});

21
src/doc/assets/less/site/social-buttons.less
View File

@ -17,3 +17,24 @@ label.error {
color: @state-danger-text;
margin-top: 5px;
}
/* Get those Github and Twitter Buttons to behave */
.list-inline li iframe {
position: relative !important;
display: inline;
top: 6px;
}
/* Federation Share buttons */
.share {
.btn-xs {
line-height: 1.3;
padding-left: 6px;
padding-right: 6px;
}
label,
label:hover {
color: #fff;
}
}