Archives
/
asciinema.org
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Use non-tracking social buttons

Browse Source
element
Marcin Kulik 9 years ago
parent feebd078ea
commit 96adb6dae6
4 changed files with 91 additions and 14 deletions
Show Stats Download Patch File Download Diff File

2
app/views/asciicasts/_share.html.slim
Unescape Escape View File

@ -24,7 +24,7 @@
.col-md-6
h2 Social
div
= render 'shared/add_this', title: page.asciicast_title, url: asciicast_url(page.asciicast), big: true
= render 'shared/social_buttons', title: page.asciicast_title, url: asciicast_url(page.asciicast)
h2 Embed image link
p Use snippets below to display a screenshot linking to this recording. Useful in places where scripts are not allowed (e.g. in a project's README file).

5
app/views/pages/contributing.html.slim
Unescape Escape View File

@ -122,10 +122,9 @@
a href="https://twitter.com/asciinema" @asciinema
' on Twitter btw.
= render 'shared/add_this',
= render 'shared/social_buttons',
url: root_url,
title: 'asciinema - Record and share your terminal sessions, the right way',
big: true
title: 'asciinema - Record and share your terminal sessions, the right way'
.col-md-4
h2 Contribute by:

10
app/views/shared/_add_this.html.erb
Unescape Escape View File

@ -1,10 +0,0 @@
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style <%= 'addthis_32x32_style' if local_assigns[:big] %>" addthis:url="<%= url %>" addthis:title="<%= title %>">
<a class="addthis_button_twitter"></a>
<a class="addthis_button_google_plusone_share"></a>
<a class="addthis_button_reddit"></a>
<a class="addthis_button_facebook"></a>
<a class="addthis_button_compact"></a>
</div>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=<%= CFG.add_this_profile_id %>"></script>
<!-- AddThis Button END -->

88
app/views/shared/_social_buttons.html.erb
Unescape Escape View File

@ -0,0 +1,88 @@
<a class="resp-sharing-button__link" href="https://twitter.com/intent/tweet/?text=<%= title %>&url=<%= url %>" target="_blank"><div class="resp-sharing-button resp-sharing-button--twitter resp-sharing-button--small">
<div class="resp-sharing-button__icon"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1em" height="1em" viewBox="0 0 32 32"><path d="M32 6.076c-1.177 0.522-2.443 0.875-3.771 1.034 1.355-0.813 2.396-2.099 2.887-3.632-1.269 0.752-2.674 1.299-4.169 1.593-1.198-1.276-2.904-2.073-4.792-2.073-3.626 0-6.565 2.939-6.565 6.565 0 0.515 0.058 1.016 0.17 1.496-5.456-0.274-10.294-2.888-13.532-6.86-0.565 0.97-0.889 2.097-0.889 3.301 0 2.278 1.159 4.287 2.921 5.465-1.076-0.034-2.088-0.329-2.974-0.821-0.001 0.027-0.001 0.055-0.001 0.083 0 3.181 2.263 5.834 5.266 6.437-0.551 0.15-1.131 0.23-1.73 0.23-0.423 0-0.834-0.041-1.235-0.118 0.835 2.608 3.26 4.506 6.133 4.559-2.247 1.761-5.078 2.81-8.154 2.81-0.53 0-1.052-0.031-1.566-0.092 2.905 1.863 6.356 2.95 10.064 2.95 12.076 0 18.679-10.004 18.679-18.68 0-0.285-0.006-0.568-0.019-0.849 1.283-0.926 2.396-2.082 3.276-3.398z"></path></svg></div>
</div>
</a>
<a class="resp-sharing-button__link" href="https://facebook.com/sharer/sharer.php?u=<%= url %>" target="_blank"><div class="resp-sharing-button resp-sharing-button--facebook resp-sharing-button--small">
<div class="resp-sharing-button__icon"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1em" height="1em" viewBox="0 0 32 32"><path d="M21 6c-2.761 0-5 2.239-5 5v3h-4v4h4v14h4v-14h4.5l1-4h-5.5v-3c0-0.552 0.448-1 1-1h5v-4h-5z"></path></svg></div>
</div>
</a>
<a class="resp-sharing-button__link" href="https://plus.google.com/share?url=<%= url %>" target="_blank"><div class="resp-sharing-button resp-sharing-button--google resp-sharing-button--small">
<div class="resp-sharing-button__icon"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1em" height="1em" viewBox="0 0 32 32"><path d="M17.471 2c0 0-6.28 0-8.373 0-3.754 0-7.287 2.844-7.287 6.138 0 3.366 2.559 6.083 6.378 6.083 0.266 0 0.524-0.005 0.776-0.024-0.248 0.475-0.425 1.009-0.425 1.564 0 0.936 0.503 1.694 1.14 2.313-0.481 0-0.945 0.014-1.452 0.014-4.649-0-8.228 2.961-8.228 6.032 0 3.024 3.923 4.916 8.573 4.916 5.301 0 8.228-3.008 8.228-6.032 0-2.425-0.715-3.877-2.928-5.442-0.757-0.536-2.204-1.839-2.204-2.604 0-0.897 0.256-1.34 1.607-2.395 1.385-1.082 2.365-2.603 2.365-4.372 0-2.106-0.938-4.159-2.699-4.837h2.655l1.874-1.355zM14.546 22.483c0.066 0.28 0.103 0.569 0.103 0.863 0 2.444-1.575 4.353-6.093 4.353-3.214 0-5.535-2.035-5.535-4.478 0-2.395 2.879-4.389 6.093-4.354 0.75 0.008 1.449 0.129 2.083 0.334 1.745 1.213 2.996 1.899 3.349 3.281zM9.401 13.368c-2.157-0.065-4.207-2.413-4.58-5.246s1.074-5.001 3.231-4.937c2.157 0.065 4.207 2.338 4.58 5.171s-1.075 5.077-3.231 5.012zM26 8v-6h-2v6h-6v2h6v6h2v-6h6v-2z"></path></svg></div>
</div>
</a>
<a class="resp-sharing-button__link" href="https://www.tumblr.com/widgets/share/tool?posttype=link&content=<%= url %>&title=<%= title %>&caption=<%= title %>" target="_blank"><div class="resp-sharing-button resp-sharing-button--tumblr resp-sharing-button--small">
<div class="resp-sharing-button__icon"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1em" height="1em" viewBox="0 0 32 32"><path d="M18.001 14l-0 7.318c0 1.857-0.024 2.927 0.173 3.453 0.195 0.524 0.685 1.067 1.218 1.381 0.709 0.425 1.517 0.637 2.428 0.637 1.62 0 2.577-0.214 4.179-1.267v4.811c-1.366 0.642-2.558 1.019-3.666 1.279-1.109 0.258-2.308 0.388-3.596 0.388-1.463 0-2.327-0.184-3.45-0.552-1.124-0.371-2.083-0.9-2.876-1.579-0.795-0.685-1.344-1.413-1.652-2.182s-0.46-1.888-0.46-3.351v-11.222h-4.295v-4.531c1.256-0.408 2.661-0.993 3.556-1.755 0.899-0.764 1.618-1.678 2.16-2.748 0.543-1.067 0.917-2.429 1.121-4.079h5.159l-0 8h7.999v6h-7.999z"></path></svg></div>
</div>
</a>
<a class="resp-sharing-button__link" href="https://reddit.com/submit/?url=<%= url %>" target="_blank"><div class="resp-sharing-button resp-sharing-button--reddit resp-sharing-button--small">
<div class="resp-sharing-button__icon"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1em" height="1em" viewBox="0 0 32 32"><path d="M8 20c0-1.105 0.895-2 2-2s2 0.895 2 2c0 1.105-0.895 2-2 2s-2-0.895-2-2zM20 20c0-1.105 0.895-2 2-2s2 0.895 2 2c0 1.105-0.895 2-2 2s-2-0.895-2-2zM20.097 24.274c0.515-0.406 1.262-0.317 1.668 0.198s0.317 1.262-0.198 1.668c-1.434 1.13-3.619 1.86-5.567 1.86s-4.133-0.73-5.567-1.86c-0.515-0.406-0.604-1.153-0.198-1.668s1.153-0.604 1.668-0.198c0.826 0.651 2.46 1.351 4.097 1.351s3.271-0.7 4.097-1.351zM32 16c0-2.209-1.791-4-4-4-1.504 0-2.812 0.83-3.495 2.057-2.056-1.125-4.561-1.851-7.29-2.019l2.387-5.36 4.569 1.319c0.411 1.167 1.522 2.004 2.83 2.004 1.657 0 3-1.343 3-3s-1.343-3-3-3c-1.142 0-2.136 0.639-2.642 1.579l-5.091-1.47c-0.57-0.164-1.173 0.116-1.414 0.658l-3.243 7.282c-2.661 0.187-5.102 0.907-7.114 2.007-0.683-1.227-1.993-2.056-3.496-2.056-2.209 0-4 1.791-4 4 0 1.635 0.981 3.039 2.387 3.659-0.252 0.751-0.387 1.535-0.387 2.341 0 5.523 6.268 10 14 10s14-4.477 14-10c0-0.806-0.134-1.589-0.387-2.34 1.405-0.62 2.387-2.025 2.387-3.66zM27 5.875c0.621 0 1.125 0.504 1.125 1.125s-0.504 1.125-1.125 1.125-1.125-0.504-1.125-1.125 0.504-1.125 1.125-1.125zM2 16c0-1.103 0.897-2 2-2 0.797 0 1.487 0.469 1.808 1.145-1.045 0.793-1.911 1.707-2.552 2.711-0.735-0.296-1.256-1.016-1.256-1.856zM16 29.625c-6.42 0-11.625-3.414-11.625-7.625s5.205-7.625 11.625-7.625c6.42 0 11.625 3.414 11.625 7.625s-5.205 7.625-11.625 7.625zM28.744 17.856c-0.641-1.003-1.507-1.918-2.552-2.711 0.321-0.676 1.011-1.145 1.808-1.145 1.103 0 2 0.897 2 2 0 0.84-0.52 1.56-1.256 1.856z"></path></svg></div>
</div>
</a>
<style>
.resp-sharing-button {
display: inline-block;
border-radius: 5px;
border-width: 1px;
border-style: solid;
transition: background-color 125ms ease-out, border-color 125ms ease-out, opacity 250ms ease-out;
margin-right: 0.5em;
padding: 0.5em 0.75em;
font-family: Helvetica Neue,Helvetica,Arial,sans-serif; }
.resp-sharing-button a {
text-decoration: none;
color: #FFF;
display: block; }
.resp-sharing-button__icon {
display: inline-block; }
.resp-sharing-button__icon svg {
fill: #FFF;
width: 1em;
height: 1em;
margin-bottom: -0.1em; }
.resp-sharing-button__link {
text-decoration: none;
color: #FFF; }
.resp-sharing-button--large .resp-sharing-button__icon svg {
padding-right: 0.4em; }
.resp-sharing-button__wrapper {
display: inline-block; }
.resp-sharing-button--facebook {
background-color: #3b5998;
border-color: #3b5998; }
.resp-sharing-button--facebook:hover,
.resp-sharing-button--facebook:active {
background-color: #2d4373;
border-color: #2d4373; }
.resp-sharing-button--twitter {
background-color: #55acee;
border-color: #55acee; }
.resp-sharing-button--twitter:hover,
.resp-sharing-button--twitter:active {
background-color: #2795e9;
border-color: #2795e9; }
.resp-sharing-button--google {
background-color: #dd4b39;
border-color: #dd4b39; }
.resp-sharing-button--google:hover,
.resp-sharing-button--google:active {
background-color: #c23321;
border-color: #c23321; }
.resp-sharing-button--tumblr {
background-color: #35465C;
border-color: #35465C; }
.resp-sharing-button--tumblr:hover,
.resp-sharing-button--tumblr:active {
background-color: #222d3c;
border-color: #222d3c; }
.resp-sharing-button--reddit {
background-color: #5f99cf;
border-color: #5f99cf; }
.resp-sharing-button--reddit:hover,
.resp-sharing-button--reddit:active {
background-color: #3a80c1;
border-color: #3a80c1; }
.resp-sharing-button__link:hover {
text-decoration: none;
}
</style>
Write Preview
Loading…
Cancel
Save