zydronium/neocities
1
0
Fork 0
mirror of https://github.com/neocities/neocities.git synced 2025-04-28 11:12:30 +02:00
Code Issues Projects Releases Packages Wiki Activity

Almost where I want the follow button to be, but not quite

Browse source
This commit is contained in:
Victoria Wang 2014-10-14 22:42:13 -07:00
parent 8665e70be1
commit 5011d83436
4 changed files with 42 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
public/js/news/site.js
View file

@ -1,14 +1,11 @@
var Site = { var Site = {
toggleFollow: function(siteId, csrfToken) { toggleFollow: function(siteId, csrfToken) {
var link = $('a#followLink') var link = $('a#followLink')
var span = $('a#followLink span')
$.post('/site/'+siteId+'/toggle_follow', {csrf_token: csrfToken}, function(res) { $.post('/site/'+siteId+'/toggle_follow', {csrf_token: csrfToken}, function(res) {
if(res.result == "followed") { if(res.result == "followed") {
span.text('Unfollow') link.addClass('is-following')
link.removeClass('follow')
} else if(res.result == 'unfollowed') { } else if(res.result == 'unfollowed') {
span.text('Follow') link.removeClass('is-following')
link.addClass('follow')
} }
}) })
} }

44
sass/_project-sass/_project-Main.scss
View file

@ -484,7 +484,7 @@ a.tag:hover {
text-decoration: none; text-decoration: none;
background: #FFEE8A; background: #FFEE8A;
} }
.following { .follower-list {
width: 100%; width: 100%;
float: left; float: left;
margin-bottom: 2em; margin-bottom: 2em;
@ -669,18 +669,40 @@ a.tag:hover {
.interior .header-Outro .stats .stat.tips { .interior .header-Outro .stats .stat.tips {
width: 60px; width: 60px;
} }
.btn-Action.follow span { #followLink {
background-image: url(/img/follow.png); .follow {
padding-left: 22px; display: inline;
}
.following {
display: none;
}
.unfollow {
display: none;
}
} }
.btn-Action.tip span { #followLink.is-following {
background-image: url(/img/tip.png); width: 8.7em;
padding-left: 26px;
background-position-y: -1px; .follow {
display: none;
}
.following {
display: inline;
}
.unfollow {
display: none;
}
} }
.btn-Action.share span { #followLink.is-following:hover {
background-image: url(/img/share.png); .follow {
padding-left: 26px; display: none;
}
.following {
display: none;
}
.unfollow {
display: inline;
}
} }
.col-33 .stats .stat { .col-33 .stats .stat {
margin-bottom: .4em; margin-bottom: .4em;

2
views/_follows.erb
View file

@ -15,7 +15,7 @@
<% site_follows = site.follows %> <% site_follows = site.follows %>
<% if (!is_current_site && !site_follows.empty?) || is_current_site %> <% if (!is_current_site && !site_follows.empty?) || is_current_site %>
<h3>Followers</h3> <h3>Followers</h3>
<div class="following"> <div class="follower-list">
<% if site_follows.empty? %> <% if site_follows.empty? %>
No followers yet. No followers yet.
<% else %> <% else %>

8
views/site.erb
View file

@ -34,9 +34,13 @@
<% if current_site && current_site != site %> <% if current_site && current_site != site %>
<% is_following = current_site.is_following?(site) %> <% is_following = current_site.is_following?(site) %>
<a id="followLink" href="#" onclick="Site.toggleFollow(<%= site.id %>, '<%= csrf_token %>'); return false" class="btn-Action <%= is_following ? '' : 'follow' %>">
<span><%= is_following ? 'Unfollow' : 'Follow' %></span> <a id="followLink" href="#" onclick="Site.toggleFollow(<%= site.id %>, '<%= csrf_token %>'); return false" class="btn-Action <%= is_following ? 'is-following' : '' %>">
<span class="unfollow"><i class="fa fa-times"></i>Unfollow</span>
<span class="following"><i class="fa fa-check"></i>Following</span>
<span class="follow"><i class="fa fa-plus"></i>Follow</span>
</a> </a>
<!-- <a href="#" class="btn-Action tip"><span>Tip</span></a> --> <!-- <a href="#" class="btn-Action tip"><span>Tip</span></a> -->
<% end %> <% end %>