twisterarmy
/
twister-html
mirror of https://github.com/twisterarmy/twister-html.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

fix of follow-unfollow button behaviour, multiple fixes and improvements of UI glitches, adding of missing players

master
Simon Grim 10 years ago
parent
032049b4f1
commit
9281f8f6a7
14 changed files with 322 additions and 222 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 78
      css/profile.css
  2. 116
      css/style.css
  3. 15
      following.html
  4. 11
      home.html
  5. 78
      js/interface_common.js
  6. 27
      js/twister_following.js
  7. 2
      network.html
  8. 4
      options.html
  9. 88
      theme_calm/css/profile.css
  10. 71
      theme_calm/css/style.css
  11. 34
      theme_nin/css/style.css
  12. 4
      theme_nin/js/theme_option.js
  13. 4
      theme_nin/sass/_profile.sass
  14. 12
      theme_nin/sass/style.sass

78
css/profile.css
Unescape View File

@ -57,49 +57,37 @@
{ {
color: #fff; color: #fff;
} }
.profile-card .direct-messages,
.profile-card .direct-messages-with-user, .profile-card-buttons
.profile-card .mentions-from-user,
.profile-card .follow,
.profile-card .profileUnfollow
{ {
display: block;
position: absolute; position: absolute;
bottom: 20px; bottom: 30px;
right: 125px; right: 0;
padding: 10px; }
.profile-card-buttons .direct-messages-with-user,
.profile-card-buttons .mentions-from-user,
.profile-card-buttons .follow,
.profile-card-buttons .unfollow
{
display: inline;
padding: 4px 12px;
font-size: 12px; font-size: 12px;
width: 110px; width: auto;
text-align: center; text-align: center;
color: rgba( 0, 0, 0, .7 ); color: rgba( 0, 0, 0, .7 );
background: rgba( 0, 0, 0, .1 ); background: rgba( 0, 0, 0, .1 );
border: none; border: none;
transition: all .2s linear; transition: all .2s linear;
} }
.profile-card .follow,
.profile-card .profileUnfollow .profile-card-buttons .direct-messages-with-user:hover,
{ .profile-card-buttons .mentions-from-user:hover
right: 240px;
}
.profile-card .mentions-from-user
{
right: 10px;
}
.profile-card .profileUnfollow
{
background-color: rgba( 0, 0, 0, .3 );
}
.profile-card .direct-messages:hover,
.profile-card .direct-messages-with-user:hover,
.profile-card .mentions-from-user:hover,
.profile-card .follow:hover
{
background: rgba( 0, 0, 0, .3 );
}
.profile-card .profileUnfollow:hover
{ {
background: rgba( 0, 0, 0, .1 ); color: #fff;
background: #45474d;
} }
.profile-card.forEdition .profile-card.forEdition
{ {
margin: 0 auto; margin: 0 auto;
@ -175,24 +163,27 @@
padding: 10px; padding: 10px;
text-align: right; text-align: right;
} }
/************************************* /*************************************
****************** PROFILE MODAL ************ PROFILE MODAL ***********
************************************* **************************************/
.profile-modal .modal-wrapper .profile-modal .modal-wrapper
{ {
width: 580px; width: 580px;
border-radius: 5px; border-radius: 5px;
overflow: hidden; overflow: hidden;
position: absolute; position: absolute;
top:10%; top:5%;
height: 80%; height: 90%;
margin-left: -290px; margin-left: -290px;
}*/ }
.profile-modal .modal-content .profile-modal .modal-content
{ {
padding: 3px; padding: 3px;
height: 100%; height: 100%;
overflow-y: hidden;
} }
#msngrswr { #msngrswr {
display: none; display: none;
@ -274,7 +265,7 @@
{ {
margin-left: 0; margin-left: 0;
padding: 5px 0 5px 0; padding: 5px 0 5px 0;
height: 75%; height: 73%;
} }
.profile-modal .postboard h2 .profile-modal .postboard h2
{ {
@ -314,20 +305,13 @@
height: 200px; height: 200px;
} }
*/ */
.profile-modal .direct-messages,
.profile-modal .direct-messages-with-user,
.profile-modal .mentions-from-user,
.profile-modal .follow,
.profile-modal .profileUnfollow
{
bottom: 10px;
}
h1.profile-name { h1.profile-name {
display: inline; display: inline;
} }
h2.profile-screen-name { h2.profile-screen-name {
display: inline; display: block;
} }
.profile-modal .modal-buttons { .profile-modal .modal-buttons {

116
css/style.css
Unescape View File

@ -90,9 +90,11 @@ h3
color: #1a1; color: #1a1;
content: '\2714'; content: '\2714';
} }
/************************************* /*************************************
**************************** BUTTONS ** ************** BUTTONS ***************
**************************************/ **************************************/
button button
{ {
background: #45474d; background: #45474d;
@ -101,18 +103,51 @@ button
padding: 5px 10px; padding: 5px 10px;
cursor: pointer; cursor: pointer;
} }
button:hover button:hover
{ {
color: #fff; color: #fff;
} }
button.disabled button.disabled
{ {
opacity: .4; opacity: .4;
} }
button.disabled:hover button.disabled:hover
{ {
color: rgba( 255, 255, 255, .8 ); color: rgba( 255, 255, 255, .8 );
} }
button.follow, button.unfollow, .following-list button.private {
color: rgba( 0, 0, 0, .4 );
background: none;
border: solid 1px rgba( 0, 0, 0, .2 );
padding: 3px 15px;
}
.following-list .public-following {
padding: 4px 16px;
}
.following-list .public-following:hover {
color: rgba( 0, 0, 0, .4 );
background: none;
border: solid 1px rgba( 0, 0, 0, .2 );
padding: 3px 15px;
}
button.follow:hover, button.unfollow:hover, .following-list button.private:hover {
color: #fff;
background: #45474d;
}
.follow-suggestions .follow, .follow-suggestions .unfollow {
display: block;
position: relative;
left: 50%;
}
/************************************* /*************************************
**************************** MENU ***** **************************** MENU *****
**************************************/ **************************************/
@ -356,12 +391,7 @@ button.disabled:hover
.userMenu-search-sugestions a:hover, .userMenu-search-sugestions a:hover,
.userMenu-search-profiles li:hover a .userMenu-search-profiles li:hover a
{ {
background: #45474d; background: #fefef1;
color: #fff;
}
.userMenu-search-profiles li:hover span
{
color: #fff;
} }
.userMenu-search-profiles button .userMenu-search-profiles button
{ {
@ -749,17 +779,6 @@ textarea.splited-post {
opacity: 1; opacity: 1;
} }
.follow, .unfollow {
background: none;
border: solid 1px rgba( 0, 0, 0 ,.2 );
padding: 3px 15px;
color: rgba( 0, 0, 0 ,.4 );
}
.follow:hover, .unfollow:hover {
color: rgba( 0, 0, 0 ,.7 );
}
.refresh-users, .refresh-users,
.view-all-users .view-all-users
{ {
@ -885,7 +904,7 @@ ol.toptrends-list {
.post:hover, .post:hover,
.post .post .post .post
{ {
background: #ececed; background: #fefef1;
} }
.post:hover .post:hover
{ {
@ -1564,9 +1583,13 @@ ol.toptrends-list {
} }
/************************************* /*************************************
*************** FOLLOWING-CONFIG PROMPT ****** FOLLOWING-CONFIG PROMPT *******
**************************************/ **************************************/
.following-config-modal
{
margin-top: -80px;
}
.following-config-modal .modal-content .following-config-modal .modal-content
{ {
padding: 10px; padding: 10px;
@ -1581,10 +1604,8 @@ ol.toptrends-list {
padding: 10px; padding: 10px;
} }
/************************************* /*************************************
****************** RETWIST POSTS PROMPT ******** RETWIST POSTS PROMPT ********
**************************************/ **************************************/
.reTwist .reTwist
@ -1798,6 +1819,55 @@ ol.toptrends-list {
-ms-transition: height 1s linear; -ms-transition: height 1s linear;
} }
/* Following page */
.following-list
{
overflow-y: auto;
}
.following ol.following-list > li{
width: 425px;
height: 150px;
margin: 5px;
padding: 8px;
float: left;
border: 0;
background: #fff;
}
.w1200 .following ol.following-list > li{
width: 385px;
}
.following ol.following-list > li:hover{
background: #fefef1;
}
.following-list .following-config
{
position: absolute;
left: 30%;
top: 69px;
}
.following-list .mini-profile-actions
{
position: absolute;
top: 0;
right: 0;
z-index: 10;
}
.following-list .swarm-status
{
font: 12px "Open Sans", sans-serif;
display: block;
position: absolute;
top: 110px;
right: 10px;
}
/* Autocomplite*/ /* Autocomplite*/
.textcomplete-wrapper textarea { .textcomplete-wrapper textarea {
display: inline; display: inline;

15
following.html
Unescape View File

@ -176,8 +176,10 @@
<li>Display retransmissions</li> <li>Display retransmissions</li>
</ul> </ul>
</div> </div>
<button class="unfollow">Unfollow</button> <div class="following-config">
<button class="public-following">Public</button> <button class="follow">Follow</button>
<button class="public-following">Public</button>
</div>
</div> </div>
<div> <div>
<span class="swarm-status" style="display: none;"></span> <span class="swarm-status" style="display: none;"></span>
@ -427,8 +429,11 @@
<li><a href="#"><span class="followers-count">&nbsp;</span><span class="label">Followers</span></a></li> <li><a href="#"><span class="followers-count">&nbsp;</span><span class="label">Followers</span></a></li>
</ul> </ul>
</div> </div>
<button class="dinamicFollowButton" href="#">Follow</button> <div class="profile-card-buttons">
<button class="follow" href="#">Follow</button>
<button class="direct-messages-with-user" href="#">Direct Messages</button> <button class="direct-messages-with-user" href="#">Direct Messages</button>
<button class="mentions-from-user" href="#">Mentions</button>
</div>
</div> </div>
<div class="who-follow"></div> <div class="who-follow"></div>
</div> </div>
@ -514,6 +519,8 @@
</div> </div>
<!-- TEMPLATES END --> <!-- TEMPLATES END -->
<audio id="player"></audio>
<audio id="playerSec"></audio>
</body> </body>
</html> </html>

11
home.html
Unescape View File

@ -457,9 +457,11 @@
<li><a href="#"><span class="followers-count">&nbsp;</span><span class="label">Followers</span></a></li> <li><a href="#"><span class="followers-count">&nbsp;</span><span class="label">Followers</span></a></li>
</ul> </ul>
</div> </div>
<button class="dinamicFollowButton" href="#">Follow</button> <div class="profile-card-buttons">
<button class="direct-messages-with-user" href="#">Direct Messages</button> <button class="follow" href="#">Follow</button>
<button class="mentions-from-user" href="#">Mentions</a> <button class="direct-messages-with-user" href="#">Direct Messages</button>
<button class="mentions-from-user" href="#">Mentions</button>
</div>
</div> </div>
<div class="who-follow"></div> <div class="who-follow"></div>
</div> </div>
@ -546,8 +548,9 @@
</div> </div>
<!-- TEMPLATES END --> <!-- TEMPLATES END -->
<audio id="player"></audio> <audio id="player"></audio>
<audio id="playerSec"></audio> <audio id="playerSec"></audio>
<!-- hide elements --> <!-- hide elements -->
</body> </body>
</html> </html>

78
js/interface_common.js
Unescape View File

@ -158,14 +158,14 @@ function openProfileModalWithUsernameHandler(username)
//título do modal //título do modal
$( "."+profileModalClass + " h3" ).text( polyglot.t("users_profile", { username: username }) ); $( "."+profileModalClass + " h3" ).text( polyglot.t("users_profile", { username: username }) );
//hed//add dinamic follow button in profile modal window //setup follow button in profile modal window
if(followingUsers.indexOf(username) != -1){ var button = $('.profile-card-buttons .follow');
$('.profile-card button.dinamicFollowButton').first().addClass('profileUnfollow').text(polyglot.t('Unfollow')).on('click', function(){ if (button) {
unfollow(username); if(followingUsers.indexOf(username) !== -1){
window.setTimeout("loadModalFromHash();",500); toggleFollowButton(username, true, function(){ window.setTimeout("loadModalFromHash();", 500);});
}); } else {
} else { button.on('click', userClickFollow);
$('.profile-card button.dinamicFollowButton').first().addClass('follow').text(polyglot.t('Follow')).on('click', userClickFollow ); };
}; };
$(".tox-ctc").attr("title", polyglot.t("Copy to clipboard")); $(".tox-ctc").attr("title", polyglot.t("Copy to clipboard"));
@ -558,31 +558,47 @@ function closeThis() {
$( this ).slideUp( "fast" ); $( this ).slideUp( "fast" );
} }
function toggleFollowButton(button, followingUser) { function toggleFollowButton(username, toggleUnfollow, bindFunc) {
if (!button || !followingUser) if (!username)
return; return;
button if (toggleUnfollow) {
.removeClass("follow") $("[data-screen-name='"+username+"']").find(".follow")
.addClass("unfollow") .removeClass("follow")
.unbind("click") .addClass("unfollow")
.bind("click", .unbind("click")
(function(e) { .bind("click",
unfollow(this.toString(), (function(e) {
(function() { e.stopPropagation();
this
.removeClass("unfollow") unfollow(this.username.toString(),
.addClass("follow") (function() {
.unbind("click") toggleFollowButton(this.username);
.bind("click", userClickFollow)
.text(polyglot.t('Follow')) if (this.bindFunc)
.trigger("toggleFollow"); this.bindFunc;
}).bind($(e.target)) }).bind({username: this.username, bindFunc: this.bindFunc})
); );
}).bind(followingUser) }).bind({username: username, bindFunc: bindFunc})
) )
.text(polyglot.t('Unfollow')) .text(polyglot.t('Unfollow'))
.trigger("toggleUnfollow"); .trigger("eventToggleUnfollow");
} else {
$("[data-screen-name='"+username+"']").find(".unfollow")
.removeClass("unfollow")
.addClass("follow")
.unbind("click")
.bind("click",
(function(e) {
userClickFollow;
if (this.bindFunc)
this.bindFunc;
}).bind({bindFunc: bindFunc})
)
.text(polyglot.t('Follow'))
.trigger("eventToggleFollow");
}
} }
var postExpandFunction = function( e, postLi ) var postExpandFunction = function( e, postLi )

27
js/twister_following.js
Unescape View File

@ -524,7 +524,6 @@ function showFollowingUsers(){
resItem.find(".mini-profile-info").attr("data-screen-name", followingUsers[i]); resItem.find(".mini-profile-info").attr("data-screen-name", followingUsers[i]);
resItem.find(".following-screen-name").text(followingUsers[i]); resItem.find(".following-screen-name").text(followingUsers[i]);
resItem.find("a.open-profile-modal").attr("href",$.MAL.userUrl(followingUsers[i])); resItem.find("a.open-profile-modal").attr("href",$.MAL.userUrl(followingUsers[i]));
resItem.find("a.unfollow").attr("href",$.MAL.unfollowUrl(followingUsers[i]));
resItem.find("a.direct-messages-with-user").attr("href", $.MAL.dmchatUrl(followingUsers[i])); resItem.find("a.direct-messages-with-user").attr("href", $.MAL.dmchatUrl(followingUsers[i]));
if (isPublicFollowing(followingUsers[i])) { if (isPublicFollowing(followingUsers[i])) {
resItem.find(".public-following").text(polyglot.t("Public")); resItem.find(".public-following").text(polyglot.t("Public"));
@ -538,11 +537,11 @@ function showFollowingUsers(){
} }
resItem.prependTo($followingList); resItem.prependTo($followingList);
toggleFollowButton(followingUsers[i], true)
} }
$.MAL.followingListLoaded(); $.MAL.followingListLoaded();
} }
function processSuggestion(arg, suggestion, followedBy) { function processSuggestion(arg, suggestion, followedBy) {
var dashboard = $(".follow-suggestions"); var dashboard = $(".follow-suggestions");
if( suggestion ) { if( suggestion ) {
@ -656,9 +655,9 @@ function processDropdownUserResults(partialName, results){
resItem.find("a.open-profile-modal").attr("href",$.MAL.userUrl(results[i])); resItem.find("a.open-profile-modal").attr("href",$.MAL.userUrl(results[i]));
getAvatar(results[i],resItem.find(".mini-profile-photo")); getAvatar(results[i],resItem.find(".mini-profile-photo"));
getFullname(results[i],resItem.find(".mini-profile-name")); getFullname(results[i],resItem.find(".mini-profile-name"));
if (followingUsers.indexOf(results[i]) >= 0)
toggleFollowButton(resItem.find(".follow"), results[i]);
resItem.appendTo(typeaheadAccounts); resItem.appendTo(typeaheadAccounts);
if (followingUsers.indexOf(results[i]) >= 0)
toggleFollowButton(results[i], true);
} }
$.MAL.searchUserListLoaded(); $.MAL.searchUserListLoaded();
@ -682,11 +681,6 @@ function userClickFollow(e) {
e.stopPropagation(); e.stopPropagation();
e.preventDefault(); e.preventDefault();
var followingInitiator = $(".followingInitiator");
if (followingInitiator)
followingInitiator.removeClass("followingInitiator");
$(e.target).addClass("followingInitiator");
var $this = $(this); var $this = $(this);
var $userInfo = $this.closest("[data-screen-name]"); var $userInfo = $this.closest("[data-screen-name]");
var username = $userInfo.attr("data-screen-name"); var username = $userInfo.attr("data-screen-name");
@ -723,16 +717,6 @@ function initUserSearch() {
}); });
} }
function followingListUnfollow(e) {
e.stopPropagation();
e.preventDefault();
var $this = $(this);
var username = $this.closest(".mini-profile-info").attr("data-screen-name");
unfollow(username);
}
function followingListPublicCheckbox(e) { function followingListPublicCheckbox(e) {
e.stopPropagation(); e.stopPropagation();
@ -764,9 +748,7 @@ function setFollowingMethod(e) {
//console.log("start following @" +username +" by method "+publicFollow); //console.log("start following @" +username +" by method "+publicFollow);
follow(username, publicFollow, follow(username, publicFollow,
(function() { (function() {
var followingInitiator = $(".followingInitiator"); toggleFollowButton(this, true);
if (followingInitiator)
toggleFollowButton(followingInitiator, this);
}).bind(username) }).bind(username)
); );
} }
@ -818,7 +800,6 @@ function initInterfaceFollowing() {
initUserSearch(); initUserSearch();
initInterfaceDirectMsg(); initInterfaceDirectMsg();
$("button.unfollow").bind( "click", followingListUnfollow );
$(".mini-profile-info .public-following").bind( "click", followingListPublicCheckbox ); $(".mini-profile-info .public-following").bind( "click", followingListPublicCheckbox );
$(".mentions-from-user").bind( "click", openMentionsModal ); $(".mentions-from-user").bind( "click", openMentionsModal );

2
network.html
Unescape View File

@ -225,5 +225,7 @@
</div> </div>
<audio id="player"></audio>
<audio id="playerSec"></audio>
</body> </body>
</html> </html>

4
options.html
Unescape View File

@ -141,7 +141,6 @@
<input type="range" name="playerVol" id="playerVol" class="container" min="0" max="1" step="0.01"><span class="volValue container">0</span> <input type="range" name="playerVol" id="playerVol" class="container" min="0" max="1" step="0.01"><span class="volValue container">0</span>
</div> </div>
</form> </form>
<audio id="player"></audio>
</div> </div>
</div> </div>
<div class="module"> <div class="module">
@ -347,5 +346,8 @@
</div><!-- /tab-content --> </div><!-- /tab-content -->
</div><!-- /options --> </div><!-- /options -->
</div><!-- /options --> </div><!-- /options -->
<audio id="player"></audio>
<audio id="playerSec"></audio>
</body> </body>
</html> </html>

88
theme_calm/css/profile.css
Unescape View File

@ -61,36 +61,37 @@
top: 19%; top: 19%;
color: #f8f8f8; color: #f8f8f8;
} }
.profile-card .direct-messages,
.profile-card .direct-messages-with-user, .profile-card-buttons
.profile-card .follow,
.profile-card .profileUnfollow
{ {
display: block;
position: absolute; position: absolute;
bottom: 20px; bottom: 30px;
right: 3px; right: 0;
padding: 10px 3px; }
.profile-card-buttons .direct-messages-with-user,
.profile-card-buttons .mentions-from-user,
.profile-card-buttons .follow,
.profile-card-buttons .unfollow
{
display: inline;
padding: 4px 12px;
font-size: 12px; font-size: 12px;
width: 120px; width: auto;
text-align: center; text-align: center;
color: rgba( 0, 0, 0, .7 ); color: rgba( 0, 0, 0, .7 );
background: rgba( 0, 0, 0, .1 ); background: rgba( 0, 0, 0, .1 );
border: none; border: none;
transition: all .2s linear; transition: all .2s linear;
} }
.profile-card .follow,
.profile-card .profileUnfollow .profile-card-buttons .direct-messages-with-user:hover,
{ .profile-card-buttons .mentions-from-user:hover
right: 128px;
}
.profile-card .direct-messages:hover,
.profile-card .direct-messages-with-user:hover,
.profile-card .follow:hover,
.profile-card .profileUnfollow:hover
{ {
background: rgba( 0, 0, 0, .3 ); color: #fff;
background: #b2d67b;
} }
.profile-card.forEdition .profile-card.forEdition
{ {
margin: 0 auto; margin: 0 auto;
@ -217,9 +218,11 @@
.secret-key-container .secret-key { .secret-key-container .secret-key {
color: #d2dbf1; color: #d2dbf1;
} }
/************************************* /*************************************
****************** PROFILE MODAL ************ PROFILE MODAL ***********
**************************************/ **************************************/
.profile-modal .modal-wrapper .profile-modal .modal-wrapper
{ {
width: 580px; width: 580px;
@ -228,7 +231,7 @@
position: absolute; position: absolute;
top:5%; top:5%;
height: 90%; height: 90%;
margin-left: -300px; margin-left: -290px;
} }
.profile-modal .modal-header, .profile-modal .profile-card { .profile-modal .modal-header, .profile-modal .profile-card {
@ -328,32 +331,11 @@
margin-left: -4px; margin-left: -4px;
border-bottom: 0; border-bottom: 0;
} }
button.follow:hover {
background: #b2d67b;
color: #fff;
}
.profile-modal button.follow:hover {
background: #b2d67b;
color: #fff;
}
.profile-card .profileUnfollow:hover {
background: #e18882;
color: #fff;
}
.profile-modal button.direct-messages-with-user:hover {
background: #b2d67b;
color: #fff;
}
.profile-modal .separator {
height: 10px;
width: 100%;
background-color: #000;
}
.profile-modal .postboard .profile-modal .postboard
{ {
margin-left: 0; margin-left: 0;
padding: 5px 0 5px 0; padding: 5px 0 5px 0;
height: 60%; height: 73%;
} }
.profile-modal .postboard h2 { .profile-modal .postboard h2 {
width: auto; width: auto;
@ -368,17 +350,6 @@ button.follow:hover {
font: 18px/40px 'Open Sans Condensed', sans-serif; font: 18px/40px 'Open Sans Condensed', sans-serif;
padding-left: 10px; padding-left: 10px;
} }
.profile-modal .postboard-posts-wrapper
{
position: absolute;
top: 0;
height: 100%;
width: 99%;
box-sizing: border-box;
border-top: 292px solid transparent;
overflow: auto;
z-index: 0;
}
.profile-modal .profile-card-main .profile-modal .profile-card-main
{ {
background: #f3f5fb; background: #f3f5fb;
@ -408,13 +379,6 @@ button.follow:hover {
height: 200px; height: 200px;
} }
*/ */
.profile-modal .direct-messages,
.profile-modal .direct-messages-with-user,
.profile-modal .follow,
.profile-card .profileUnfollow
{
bottom: 10px;
}
h1.profile-name { h1.profile-name {
display: inline; display: inline;
@ -440,4 +404,4 @@ h2.profile-screen-name {
.profile-modal a.profile-url:empty, .profile-modal a.profile-url:empty,
.profile-modal a.profile-bio:empty { .profile-modal a.profile-bio:empty {
display: none; display: none;
} }

71
theme_calm/css/style.css
Unescape View File

@ -101,9 +101,11 @@ h3
color: #1a1; color: #1a1;
content: '\2714'; content: '\2714';
} }
/************************************* /*************************************
**************************** BUTTONS ** ************** BUTTONS ***************
**************************************/ **************************************/
button button
{ {
background: #45474d; background: #45474d;
@ -112,18 +114,61 @@ button
padding: 5px 10px; padding: 5px 10px;
cursor: pointer; cursor: pointer;
} }
button:hover button:hover
{ {
color: #fff; color: #fff;
} }
button.disabled button.disabled
{ {
opacity: .4; opacity: .4;
} }
button.disabled:hover button.disabled:hover
{ {
color: rgba( 255, 255, 255, .8 ); color: rgba( 255, 255, 255, .8 );
} }
button.follow, button.unfollow, .following-list button.private {
color: rgba( 0, 0, 0, .4 );
background: none;
border: solid 1px rgba( 0, 0, 0, .2 );
padding: 3px 15px;
}
.following-list .public-following {
padding: 4px 16px;
}
.following-list .public-following:hover {
color: rgba( 0, 0, 0, .4 );
background: none;
border: solid 1px rgba( 0, 0, 0, .2 );
padding: 3px 15px;
}
.following-list button.private:hover {
color: #fff;
background: #45474d;
}
button.follow:hover {
color: #fff;
background: #b2d67b;
}
button.unfollow:hover {
color: #fff;
background: #e18882;
}
.follow-suggestions .follow, .follow-suggestions .unfollow {
display: block;
position: relative;
left: 50%;
}
/************************************* /*************************************
**************************** MENU ***** **************************** MENU *****
**************************************/ **************************************/
@ -921,17 +966,6 @@ textarea.splited-post {
text-decoration: none; text-decoration: none;
} }
.follow, .unfollow {
background: none;
border: solid 1px rgba( 0, 0, 0 ,.2 );
padding: 3px 15px;
color: rgba( 0, 0, 0 ,.4 );
}
.follow:hover, .unfollow:hover {
color: rgba( 0, 0, 0 ,.7 );
}
.refresh-users, .refresh-users,
.view-all-users .view-all-users
{ {
@ -1747,14 +1781,14 @@ textarea.splited-post {
{ {
padding: 5px 20px; padding: 5px 20px;
} }
/************************************* /*************************************
*************** FOLLOWING-CONFIG MODAL ****** FOLLOWING-CONFIG PROMPT *******
**************************************/ **************************************/
.following-config-modal .modal-wrapper
.following-config-modal
{ {
top: 43%; margin-top: -80px;
left: 25%;
width: 50%;
} }
.following-config-modal .modal-content .following-config-modal .modal-content
{ {
@ -1769,8 +1803,9 @@ textarea.splited-post {
{ {
padding: 10px; padding: 10px;
} }
/************************************* /*************************************
****************** RETWIST POSTS PROMPT ******** RETWIST POSTS PROMPT ********
**************************************/ **************************************/
.reTwist .reTwist

34
theme_nin/css/style.css
Unescape View File

@ -556,7 +556,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
padding: 15px; padding: 15px;
} }
/* line 146, ../sass/_profile.sass */ /* line 146, ../sass/_profile.sass */
.profile-card .direct-messages-with-user, .profile-card .follow, .profile-card .profileUnfollow, .profile-card .follow { .profile-card .direct-messages-with-user, .profile-card .follow, .profile-card .unfollow {
display: inline-block; display: inline-block;
position: static; position: static;
} }
@ -566,7 +566,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
position: absolute; position: absolute;
} }
/* line 154, ../sass/_profile.sass */ /* line 154, ../sass/_profile.sass */
.profile-card .profileUnfollow { .profile-card .unfollow {
background: #aaa; background: #aaa;
} }
/* line 157, ../sass/_profile.sass */ /* line 157, ../sass/_profile.sass */
@ -2579,18 +2579,46 @@ ol.toptrends-list a:hover {
.following-config-method-buttons { .following-config-method-buttons {
padding: 10px; padding: 10px;
} }
/****** FOLLOWING-CONFIG PROMPT ***** */
/* line 699, ../sass/style.sass */ /* line 699, ../sass/style.sass */
.following-config-modal
{
margin-top: -100px;
}
.following-config-modal .modal-content
{
padding: 10px;
text-align: center;
}
.following-config-modal .modal-buttons
{
display: none;
}
.following-config-method-buttons .public-following { .following-config-method-buttons .public-following {
background-color: #B4C669; background-color: #B4C669;
margin: 0px 2px;
padding: 6px 16px;
} }
/************ RETWIST POSTS MODAL ********* */ /********** RETWIST POSTS PROMPT ********* */
/* line 705, ../sass/style.sass */ /* line 705, ../sass/style.sass */
.reTwist {
margin-top: -110px;
}
.reTwist .modal-wrapper { .reTwist .modal-wrapper {
width: 520px; width: 520px;
top: 20%; top: 20%;
margin: 0 0 0 -260px; margin: 0 0 0 -260px;
} }
.reTwist .modal-content
{
padding: 20px 15px;
}
.reTwist button.modal-propagate
{
background-color: #B4C669;
}
/* line 709, ../sass/style.sass */ /* line 709, ../sass/style.sass */
.reTwist .post-expand, .reTwist .post-interactions { .reTwist .post-expand, .reTwist .post-interactions {
display: none; display: none;

4
theme_nin/js/theme_option.js
Unescape View File

@ -39,10 +39,10 @@ $(function(){
}); });
$(".userMenu-search-profiles .follow") $(".userMenu-search-profiles .follow")
.on("toggleFollow", function() { .on("eventToggleFollow", function() {
$(this).text('').attr('title', polyglot.t('Follow')); $(this).text('').attr('title', polyglot.t('Follow'));
}) })
.on("toggleUnfollow", function() { .on("eventToggleUnfollow", function() {
$(this).text('').attr('title', polyglot.t('Unfollow')); $(this).text('').attr('title', polyglot.t('Unfollow'));
}); });

4
theme_nin/sass/_profile.sass
Unescape View File

@ -143,7 +143,7 @@ $modal-postboard-post-height: $modal-height - 45px
position: relative position: relative
padding: $modal-gut padding: $modal-gut
.direct-messages-with-user, .follow, .profileUnfollow, .follow .direct-messages-with-user, .follow, .unfollow
display: inline-block display: inline-block
position: static position: static
@ -151,7 +151,7 @@ $modal-postboard-post-height: $modal-height - 45px
font-size: 15px font-size: 15px
position: absolute position: absolute
.profileUnfollow .unfollow
background: $main-color-light background: $main-color-light
.twister-user-info .twister-user-info

12
theme_nin/sass/style.sass
Unescape View File

@ -697,6 +697,7 @@ ol.toptrends-list
/************ FOLLOWING-CONFIG MODAL **********/ /************ FOLLOWING-CONFIG MODAL **********/
.following-config-modal .following-config-modal
margin-top: -100px
h2 h2
text-transform: none text-transform: none
.modal-wrapper .modal-wrapper
@ -710,17 +711,24 @@ ol.toptrends-list
.modal-buttons .modal-buttons
display: none display: none
.following-config-method-buttons .following-config-method-buttons
padding: 10px
.public-following .public-following
background-color: #B4C669 background-color: $color-green
margin: 0px 2px
padding: 6px 16px
/************ RETWIST POSTS MODAL **********/ /************ RETWIST POSTS MODAL **********/
.reTwist .reTwist
margin-top: -110px
.modal-wrapper .modal-wrapper
width: $postboard-modal-width width: $postboard-modal-width
top: 20% top: 20%
margin: 0 0 0 0-($postboard-modal-width/2) margin: 0 0 0 0-($postboard-modal-width/2)
.modal-content
padding: 20px 15px
.modal-buttons
.modal-propagate
background-color: $color-green
.post-expand, .post-interactions .post-expand, .post-interactions
display: none display: none

Write Preview
Loading…
Cancel
Save