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

fixing modal/prompt for new post

nin-v2
myleneb 9 years ago
parent
01f9116f48
commit
0f7b7100fb
4 changed files with 37 additions and 36 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. 49
      css/style.css
  2. 9
      js/theme_option.js
  3. 7
      sass/layout/_responsive.sass
  4. 8
      sass/style.sass

49
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, .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 { .ion:before, .userMenu li.userMenu-config > a:before, .modal-header span:before, .prompt-wrapper .modal-header span:before, .mini-profile .post-area .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, .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:before, .userMenu li.userMenu-config > a:before, .modal-header span:before, .prompt-wrapper .modal-header span:before, .mini-profile .post-area .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, .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 { .ion:after, .userMenu li.userMenu-config > a:after, .modal-header span:after, .prompt-wrapper .modal-header span:after, .mini-profile .post-area .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, .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 { .ion-checkmark:after, .isFollowing:after, .modal-header span.mark-all-as-read:after, .mini-profile .post-area .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 .modal-header span.mark-all-as-read: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, .mini-profile .post-area.display .modal-header span.modal-close:before, .twister-user-remove:before { .ion-close:before, .modal-header span.modal-close:before, .mini-profile .post-area .modal-header span.modal-close:before, .twister-user-remove:before {
content: ""; content: "";
} }
.ion-back:before, .modal-header span.modal-back:before, .mini-profile .post-area.display .modal-header span.modal-back:before { .ion-back:before, .modal-header span.modal-back:before, .mini-profile .post-area .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, .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 { .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 .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, .mini-profile .post-area.display .modal-header { .modal-header, .prompt-wrapper .modal-header, .mini-profile .post-area .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, .mini-profile .post-area.display .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 .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, .mini-profile .post-area.display .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 .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, .mini-profile .post-area.display .modal-header span { .modal-header span, .prompt-wrapper .modal-header span, .mini-profile .post-area .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, .mini-profile .post-area.display .modal-header span:hover { .modal-header span:hover, .mini-profile .post-area .modal-header span:hover {
color: white; color: white;
} }
.modal-header span b, .prompt-wrapper .modal-header span b, .mini-profile .post-area.display .modal-header span b { .modal-header span b, .prompt-wrapper .modal-header span b, .mini-profile .post-area .modal-header span b {
display: none; display: none;
} }
.modal-header span.modal-close, .mini-profile .post-area.display .modal-header span.modal-close { .modal-header span.modal-close, .mini-profile .post-area .modal-header span.modal-close {
right: 10px; right: 10px;
} }
.modal-header span.mark-all-as-read, .mini-profile .post-area.display .modal-header span.mark-all-as-read { .modal-header span.mark-all-as-read, .mini-profile .post-area .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, .mini-profile .post-area.display .modal-header span.modal-back { .modal-header span.modal-back, .mini-profile .post-area .modal-header span.modal-back {
right: 35px; right: 35px;
} }
@ -834,7 +834,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
padding: 10px; padding: 10px;
background: white; background: white;
} }
.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 { .prompt-wrapper .modal-header h3 span, .prompt-wrapper .mini-profile .post-area .modal-header h3 span, .mini-profile .post-area .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;
} }
@ -2159,13 +2159,15 @@ ul.userMenu-search-profiles button, ul.userMenu-search-profiles .show-more-follo
.mini-profile .post-area { .mini-profile .post-area {
margin-top: 1px; margin-top: 1px;
margin-bottom: 20px; margin-bottom: 20px;
padding: 0.5em; }
.mini-profile .post-area .modal-header h3, .mini-profile .post-area .modal-header .login .module p span, .login .module p .mini-profile .post-area .modal-header span {
padding: 0 0 0 20px;
} }
.mini-profile .post-area-new { .mini-profile .post-area-new {
padding: 20px;
-moz-box-shadow: none; -moz-box-shadow: none;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
padding: 0;
margin: 0; margin: 0;
} }
.mini-profile .post-area-new textarea { .mini-profile .post-area-new textarea {
@ -2835,14 +2837,7 @@ ul.dropdown-menu li > li > a {
} }
#postboard-top { #postboard-top {
position: fixed !important; display: none;
bottom: 0;
top: auto;
margin: 0;
width: 100%;
-moz-box-shadow: 0 -5px 13px rgba(17, 17, 17, 0.2);
-webkit-box-shadow: 0 -5px 13px rgba(17, 17, 17, 0.2);
box-shadow: 0 -5px 13px rgba(17, 17, 17, 0.2);
} }
.modal-wrapper { .modal-wrapper {

9
js/theme_option.js
Unescape View File

@ -114,11 +114,18 @@ function reOrganizeTemplates() { // for nin's templating
else {$('.mini-profile .post-area').removeClass('display');} else {$('.mini-profile .post-area').removeClass('display');}
return false; return false;
}); });
// new post prompt
$('<div><h3>New post</h3><span class="modal-close prompt-close"></span></div>')
.addClass('modal-header')
.prependTo('.mini-profile .post-area');
$('.mini-profile .post-area .post-submit').bind( 'click', function() { $('.mini-profile .post-area .post-submit').bind( 'click', function() {
$('.mini-profile .post-area').removeClass('display'); $('.mini-profile .post-area').removeClass('display');
}); });
$('.mini-profile .post-area .modal-close').bind( 'click', function() {
$('.mini-profile .post-area').removeClass('display');
});
} }
function reAppendModules() { // avoid w1200 things function reAppendModules() { // avoid w1200 things

7
sass/layout/_responsive.sass
Unescape View File

@ -84,12 +84,7 @@
.modal-wrapper & .modal-wrapper &
top: auto top: auto
#postboard-top #postboard-top
position: fixed!important display: none
bottom: 0
top: auto
margin: 0
width: 100%
+box-shadow(0 -5px 13px rgba(#111, 0.2))
.modal-wrapper .modal-wrapper
width: 90% width: 90%

8
sass/style.sass
Unescape View File

@ -173,12 +173,16 @@ ul.userMenu-search-profiles
.post-area .post-area
margin-top: 1px margin-top: 1px
margin-bottom: 20px margin-bottom: 20px
padding: .5em
@extend .clear-fix @extend .clear-fix
.modal-header
@extend .modal-header
h3
padding: 0 0 0 20px
.post-area-new .post-area-new
@extend .open @extend .open
padding: 20px
+box-shadow(none) +box-shadow(none)
padding: 0
margin: 0 margin: 0
textarea textarea
width: 100% width: 100%

Write Preview
Loading…
Cancel
Save