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

new post button in left area

nin-v2
myleneb 9 years ago
parent
76acb87ac8
commit
9386ed2e69
4 changed files with 62 additions and 42 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/style.css
  2. 20
      js/theme_option.js
  3. 1
      sass/layout/_prompt.sass
  4. 5
      sass/style.sass

78
css/style.css
Unescape View File

@ -114,7 +114,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
.ion:before, .userMenu li.userMenu-config > a:before, .modal-header span:before, .prompt-wrapper .modal-header span:before, .prompt-wrapper .switch-mode:before, .bitmessage-ctc:before, .tox-ctc:before, .profile-modal .profile-tox:before, .profile-modal .profile-bitmessage:before, .post-retransmited-icon:before, .post-interactions span:before, .post-stats li.stat-count:before, ul.userMenu-search-profiles button:before, ul.userMenu-search-profiles .show-more-followers:before, .mini-profile-indicators .userMenu-connections a:before, .mini-profile-indicators .userMenu-messages a:before, .mini-profile-indicators .userMenu-user a:before, .twister-user-remove:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before, .view-all-users:before, .ion-after:after, .isFollowing:after, .direct-messages-list .post:after { .ion:before, .userMenu li.userMenu-config > a:before, .modal-header span:before, .prompt-wrapper .modal-header span:before, .mini-profile .post-area.display .modal-header span:before, .prompt-wrapper .switch-mode:before, .mini-profile .post-area.display .switch-mode:before, .bitmessage-ctc:before, .tox-ctc:before, .profile-modal .profile-tox:before, .profile-modal .profile-bitmessage:before, .post-retransmited-icon:before, .post-interactions span:before, .post-stats li.stat-count:before, ul.userMenu-search-profiles button:before, ul.userMenu-search-profiles .show-more-followers:before, .mini-profile-indicators .userMenu-connections a:before, .mini-profile-indicators .userMenu-messages a:before, .mini-profile-indicators .userMenu-user a:before, .twister-user-remove:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before, .view-all-users:before, .ion-after:after, .isFollowing:after, .direct-messages-list .post:after {
display: inline-block; display: inline-block;
font-family: "Ionicons"; font-family: "Ionicons";
speak: none; speak: none;
@ -128,11 +128,11 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
.ion:before, .userMenu li.userMenu-config > a:before, .modal-header span:before, .prompt-wrapper .modal-header span:before, .prompt-wrapper .switch-mode:before, .bitmessage-ctc:before, .tox-ctc:before, .profile-modal .profile-tox:before, .profile-modal .profile-bitmessage:before, .post-retransmited-icon:before, .post-interactions span:before, .post-stats li.stat-count:before, ul.userMenu-search-profiles button:before, ul.userMenu-search-profiles .show-more-followers:before, .mini-profile-indicators .userMenu-connections a:before, .mini-profile-indicators .userMenu-messages a:before, .mini-profile-indicators .userMenu-user a:before, .twister-user-remove:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before, .view-all-users:before { .ion:before, .userMenu li.userMenu-config > a:before, .modal-header span:before, .prompt-wrapper .modal-header span:before, .mini-profile .post-area.display .modal-header span:before, .prompt-wrapper .switch-mode:before, .mini-profile .post-area.display .switch-mode:before, .bitmessage-ctc:before, .tox-ctc:before, .profile-modal .profile-tox:before, .profile-modal .profile-bitmessage:before, .post-retransmited-icon:before, .post-interactions span:before, .post-stats li.stat-count:before, ul.userMenu-search-profiles button:before, ul.userMenu-search-profiles .show-more-followers:before, .mini-profile-indicators .userMenu-connections a:before, .mini-profile-indicators .userMenu-messages a:before, .mini-profile-indicators .userMenu-user a:before, .twister-user-remove:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before, .view-all-users:before {
padding: 0 3px; padding: 0 3px;
} }
.ion:after, .userMenu li.userMenu-config > a:after, .modal-header span:after, .prompt-wrapper .modal-header span:after, .prompt-wrapper .switch-mode:after, .bitmessage-ctc:after, .tox-ctc:after, .profile-modal .profile-tox:after, .profile-modal .profile-bitmessage:after, .post-retransmited-icon:after, .post-interactions span:after, .post-stats li.stat-count:after, ul.userMenu-search-profiles button:after, ul.userMenu-search-profiles .show-more-followers:after, .mini-profile-indicators .userMenu-connections a:after, .mini-profile-indicators .userMenu-messages a:after, .mini-profile-indicators .userMenu-user a:after, .twister-user-remove:after, .refresh-toptrends:after, .twistday-reminder .refresh:after, .refresh-users:after, .view-all-users:after, .ion-after:before, .isFollowing:before, .direct-messages-list .post:before { .ion:after, .userMenu li.userMenu-config > a:after, .modal-header span:after, .prompt-wrapper .modal-header span:after, .mini-profile .post-area.display .modal-header span:after, .prompt-wrapper .switch-mode:after, .mini-profile .post-area.display .switch-mode:after, .bitmessage-ctc:after, .tox-ctc:after, .profile-modal .profile-tox:after, .profile-modal .profile-bitmessage:after, .post-retransmited-icon:after, .post-interactions span:after, .post-stats li.stat-count:after, ul.userMenu-search-profiles button:after, ul.userMenu-search-profiles .show-more-followers:after, .mini-profile-indicators .userMenu-connections a:after, .mini-profile-indicators .userMenu-messages a:after, .mini-profile-indicators .userMenu-user a:after, .twister-user-remove:after, .refresh-toptrends:after, .twistday-reminder .refresh:after, .refresh-users:after, .view-all-users:after, .ion-after:before, .isFollowing:before, .direct-messages-list .post:before {
display: none; display: none;
} }
@ -140,7 +140,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
content: ""; content: "";
} }
.ion-checkmark:after, .isFollowing:after, .modal-header span.mark-all-as-read:after, .ion-checkmark:before, .isFollowing:before, .modal-header span.mark-all-as-read:before { .ion-checkmark:after, .isFollowing:after, .modal-header span.mark-all-as-read:after, .mini-profile .post-area.display .modal-header span.mark-all-as-read:after, .ion-checkmark:before, .isFollowing:before, .modal-header span.mark-all-as-read:before, .mini-profile .post-area.display .modal-header span.mark-all-as-read:before {
content: ""; content: "";
} }
@ -148,7 +148,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
content: ""; content: "";
} }
.ion-shuffle:before, .prompt-wrapper .switch-mode:before, .post-retransmited-icon:before, .post-interactions span.post-propagate:before, .post-stats li.stat-count:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before { .ion-shuffle:before, .prompt-wrapper .switch-mode:before, .mini-profile .post-area.display .switch-mode:before, .post-retransmited-icon:before, .post-interactions span.post-propagate:before, .post-stats li.stat-count:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before {
content: ""; content: "";
} }
@ -172,11 +172,11 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
content: ""; content: "";
} }
.ion-close:before, .modal-header span.modal-close:before, .twister-user-remove:before { .ion-close:before, .modal-header span.modal-close:before, .mini-profile .post-area.display .modal-header span.modal-close:before, .twister-user-remove:before {
content: ""; content: "";
} }
.ion-back:before, .modal-header span.modal-back:before { .ion-back:before, .modal-header span.modal-back:before, .mini-profile .post-area.display .modal-header span.modal-back:before {
content: ""; content: "";
} }
@ -342,7 +342,7 @@ h3 .isFollowing:after, .login .module p span .isFollowing:after {
box-shadow: 0 8px 13px rgba(17, 17, 17, 0); box-shadow: 0 8px 13px rgba(17, 17, 17, 0);
} }
.clear-fix:after, .userMenu > ul:after, .wrapper:after, .dashboard > .module:after, .dashboard > .module ol:after, .modal-wrapper.following-modal a:after, .modal-wrapper .modal-content:after, .modal-header:after, .prompt-wrapper .modal-header:after, .twister-user:after, .direct-messages-thread .post:after, #postboard-top:after, #postboard-top .post-area:after, .expanded-content:after, .forEdition.profile-card:after, .forEdition.profile-card .profile-card-main:after, .following .following-list li a:after, .login .module:after, .network.singleBlock:after, .network.singleBlock .module:after, .options .tab-content:after, ul.userMenu-search-profiles li:after, .mini-profile .post-area:after, .mini-profile-indicators:after, .profile-data:after { .clear-fix:after, .userMenu > ul:after, .wrapper:after, .dashboard > .module:after, .dashboard > .module ol:after, .modal-wrapper.following-modal a:after, .modal-wrapper .modal-content:after, .modal-header:after, .prompt-wrapper .modal-header:after, .mini-profile .post-area.display .modal-header:after, .twister-user:after, .direct-messages-thread .post:after, #postboard-top:after, #postboard-top .post-area:after, .expanded-content:after, .forEdition.profile-card:after, .forEdition.profile-card .profile-card-main:after, .following .following-list li a:after, .login .module:after, .network.singleBlock:after, .network.singleBlock .module:after, .options .tab-content:after, ul.userMenu-search-profiles li:after, .mini-profile .post-area:after, .mini-profile-indicators:after, .profile-data:after {
content: ""; content: "";
display: table; display: table;
clear: both; clear: both;
@ -735,7 +735,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
z-index: 2000; z-index: 2000;
} }
.modal-header, .prompt-wrapper .modal-header { .modal-header, .prompt-wrapper .modal-header, .mini-profile .post-area.display .modal-header {
position: relative; position: relative;
background: #212121; background: #212121;
height: 52px; height: 52px;
@ -743,7 +743,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
} }
.modal-header h3, .prompt-wrapper .modal-header h3, .modal-header .login .module p span, .login .module p .modal-header span { .modal-header h3, .prompt-wrapper .modal-header h3, .mini-profile .post-area.display .modal-header h3, .modal-header .login .module p span, .login .module p .modal-header span {
padding-left: 20px; padding-left: 20px;
line-height: 52px; line-height: 52px;
font-weight: 500; font-weight: 500;
@ -751,10 +751,10 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
float: left; float: left;
color: white; color: white;
} }
.modal-header h3 span, .prompt-wrapper .modal-header h3 span, .modal-header .login .module p span span, .login .module p .modal-header span span { .modal-header h3 span, .prompt-wrapper .modal-header h3 span, .mini-profile .post-area.display .modal-header h3 span, .modal-header .login .module p span span, .login .module p .modal-header span span {
position: relative; position: relative;
} }
.modal-header span, .prompt-wrapper .modal-header span { .modal-header span, .prompt-wrapper .modal-header span, .mini-profile .post-area.display .modal-header span {
position: absolute; position: absolute;
top: 0; top: 0;
line-height: 52px; line-height: 52px;
@ -763,22 +763,22 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
color: rgba(255, 255, 255, 0.7); color: rgba(255, 255, 255, 0.7);
transition: color 0.1s linear; transition: color 0.1s linear;
} }
.modal-header span:hover { .modal-header span:hover, .mini-profile .post-area.display .modal-header span:hover {
color: white; color: white;
} }
.modal-header span b, .prompt-wrapper .modal-header span b { .modal-header span b, .prompt-wrapper .modal-header span b, .mini-profile .post-area.display .modal-header span b {
display: none; display: none;
} }
.modal-header span.modal-close { .modal-header span.modal-close, .mini-profile .post-area.display .modal-header span.modal-close {
right: 10px; right: 10px;
} }
.modal-header span.mark-all-as-read { .modal-header span.mark-all-as-read, .mini-profile .post-area.display .modal-header span.mark-all-as-read {
position: static; position: static;
float: left; float: left;
margin-left: 10px; margin-left: 10px;
display: none; display: none;
} }
.modal-header span.modal-back { .modal-header span.modal-back, .mini-profile .post-area.display .modal-header span.modal-back {
right: 35px; right: 35px;
} }
@ -806,7 +806,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
/*********** POPUP PROMPT ************ */ /*********** POPUP PROMPT ************ */
/*********** POPUP PROMPT ************ */ /*********** POPUP PROMPT ************ */
.prompt-wrapper { .prompt-wrapper, .mini-profile .post-area.display {
background: #FDFCFA; background: #FDFCFA;
z-index: 200; z-index: 200;
position: fixed; position: fixed;
@ -818,34 +818,34 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
-webkit-box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3);
box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3); box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3);
} }
.prompt-wrapper .following-config-method-buttons { .prompt-wrapper .following-config-method-buttons, .mini-profile .post-area.display .following-config-method-buttons {
padding: 0 20px 20px 0; padding: 0 20px 20px 0;
float: right; float: right;
} }
.prompt-wrapper .modal-content { .prompt-wrapper .modal-content, .mini-profile .post-area.display .modal-content {
padding: 20px; padding: 20px;
} }
.prompt-wrapper .modal-content .post-area textarea { .prompt-wrapper .modal-content .post-area textarea, .mini-profile .post-area.display .modal-content .post-area textarea {
clear: both; clear: both;
} }
.prompt-wrapper .post-data { .prompt-wrapper .post-data, .mini-profile .post-area.display .post-data {
border: 1px solid #F3F2F0; border: 1px solid #F3F2F0;
position: relative; position: relative;
padding: 10px; padding: 10px;
background: white; background: white;
} }
.prompt-wrapper .modal-header h3 span, .prompt-wrapper .modal-header .login .module p span span, .login .module p .prompt-wrapper .modal-header span span { .prompt-wrapper .modal-header h3 span, .mini-profile .post-area.display .modal-header h3 span, .prompt-wrapper .modal-header .login .module p span span, .login .module p .prompt-wrapper .modal-header span span, .mini-profile .post-area.display .modal-header .login .module p span span, .login .module p .mini-profile .post-area.display .modal-header span span {
padding-left: 5px; padding-left: 5px;
color: white; color: white;
} }
.prompt-wrapper .modal-header h3 span:hover, .prompt-wrapper .modal-header .login .module p span span:hover, .login .module p .prompt-wrapper .modal-header span span:hover { .prompt-wrapper .modal-header h3 span:hover, .mini-profile .post-area.display .modal-header h3 span:hover, .prompt-wrapper .modal-header .login .module p span span:hover, .login .module p .prompt-wrapper .modal-header span span:hover, .mini-profile .post-area.display .modal-header .login .module p span span:hover, .login .module p .mini-profile .post-area.display .modal-header span span:hover {
cursor: default; cursor: default;
} }
.prompt-wrapper .modal-buttons { .prompt-wrapper .modal-buttons, .mini-profile .post-area.display .modal-buttons {
margin: 4px 0; margin: 4px 0;
text-align: right; text-align: right;
} }
.prompt-wrapper .switch-mode { .prompt-wrapper .switch-mode, .mini-profile .post-area.display .switch-mode {
display: inline-block; display: inline-block;
float: left; float: left;
margin: 12px 4px 4px; margin: 12px 4px 4px;
@ -856,43 +856,43 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
} }
/************ FOLLOWING-CONFIG MODAL ********* */ /************ FOLLOWING-CONFIG MODAL ********* */
.prompt-wrapper.following-config-modal { .prompt-wrapper.following-config-modal, .mini-profile .following-config-modal.post-area.display {
margin-top: -100px; margin-top: -100px;
} }
.prompt-wrapper.following-config-modal h2 { .prompt-wrapper.following-config-modal h2, .mini-profile .following-config-modal.post-area.display h2 {
text-transform: none; text-transform: none;
display: inline-block !important; display: inline-block !important;
font-size: 1rem; font-size: 1rem;
font-weight: 400; font-weight: 400;
padding: 1rem; padding: 1rem;
} }
.prompt-wrapper.following-config-modal h2 span { .prompt-wrapper.following-config-modal h2 span, .mini-profile .following-config-modal.post-area.display h2 span {
display: inline-block !important; display: inline-block !important;
} }
.prompt-wrapper.following-config-modal h2 span b { .prompt-wrapper.following-config-modal h2 span b, .mini-profile .following-config-modal.post-area.display h2 span b {
font-weight: 400; font-weight: 400;
} }
/************ RETWIST POSTS MODAL ********* */ /************ RETWIST POSTS MODAL ********* */
.prompt-wrapper.reTwist.prompt-wrapper { .prompt-wrapper.reTwist.prompt-wrapper, .mini-profile .reTwist.post-area.display {
margin-top: -150px; margin-top: -150px;
} }
.prompt-wrapper.reTwist .post-expand, .prompt-wrapper.reTwist .post-interactions { .prompt-wrapper.reTwist .post-expand, .mini-profile .reTwist.post-area.display .post-expand, .prompt-wrapper.reTwist .post-interactions, .mini-profile .reTwist.post-area.display .post-interactions {
display: none; display: none;
} }
.prompt-wrapper.reTwist .post-info-time { .prompt-wrapper.reTwist .post-info-time, .mini-profile .reTwist.post-area.display .post-info-time {
position: static; position: static;
float: right; float: right;
} }
/********* REPLY POSTS MODAL************** */ /********* REPLY POSTS MODAL************** */
.prompt-wrapper.reply.prompt-wrapper { .prompt-wrapper.reply.prompt-wrapper, .mini-profile .reply.post-area.display {
margin-top: -110px; margin-top: -110px;
} }
.prompt-wrapper.reply .post-expand, .prompt-wrapper.reply .post-interactions { .prompt-wrapper.reply .post-expand, .mini-profile .reply.post-area.display .post-expand, .prompt-wrapper.reply .post-interactions, .mini-profile .reply.post-area.display .post-interactions {
display: none; display: none;
} }
.prompt-wrapper.reply .post-area { .prompt-wrapper.reply .post-area, .mini-profile .reply.post-area.display .post-area {
padding-bottom: 6px; padding-bottom: 6px;
} }
@ -2349,6 +2349,10 @@ ul.userMenu-search-profiles button, ul.userMenu-search-profiles .show-more-follo
.mini-profile .post-area { .mini-profile .post-area {
display: none; display: none;
} }
.mini-profile .post-area.display {
display: block;
margin-top: -110px;
}
#post-preview { #post-preview {
border: 1px solid #eee; border: 1px solid #eee;
@ -2776,7 +2780,7 @@ ul.dropdown-menu li > li > a {
width: 150px; width: 150px;
} }
.prompt-wrapper { .prompt-wrapper, .mini-profile .post-area.display {
width: 98%; width: 98%;
left: 1%; left: 1%;
margin-left: 0; margin-left: 0;

20
js/theme_option.js
Unescape View File

@ -50,9 +50,7 @@ $(document).ready(function()
$(window).scroll(function(){ $(window).scroll(function(){
window_scrollY = window.pageYOffset; // declare variable here for screen not to scroll when closing modals window_scrollY = window.pageYOffset; // declare variable here for screen not to scroll when closing modals
if ( (window_scrollY >= 300) && (!$('#postboard-top').hasClass('.onTop')) ) {$('#postboard-top').addClass('onTop')} // switch #postboard-top when scrolling
else
{$('#postboard-top').removeClass('onTop')}
}); });
}); });
@ -102,6 +100,22 @@ function reOrganizeTemplates() { // for nin's templating
//loader //loader
newLoader() newLoader()
// new post button
$('<li></li>')
.addClass('userMenu-newPost')
.prependTo('.mini-profile-indicators');
$('<a href="#">New post</a>')
.addClass('ion')
.addClass('ion-plus')
.appendTo('.userMenu-newPost')
.bind( 'click', function() {
if(!$('.mini-profile .post-area').hasClass('display')) {$('.mini-profile .post-area').addClass('display');}
else {$('.mini-profile .post-area').removeClass('display');}
return false;
});
} }
function reAppendModules() { // avoid w1200 things function reAppendModules() { // avoid w1200 things

1
sass/layout/_prompt.sass
Unescape View File

@ -2,7 +2,6 @@
.prompt-wrapper .prompt-wrapper
background: $bloc-light-color background: $bloc-light-color
z-index: 200 z-index: 200
position: fixed position: fixed
top: 50% top: 50%

5
sass/style.sass
Unescape View File

@ -349,7 +349,10 @@ ul.userMenu-search-profiles
.mini-profile .post-area .mini-profile .post-area
display: none display: none
&.display
display: block
@extend .prompt-wrapper
margin-top: -110px

Write Preview
Loading…
Cancel
Save