From 0f7b7100fb59eea83a2bd44b9f11559a91529fd7 Mon Sep 17 00:00:00 2001
From: myleneb <mylene@humain.es>
Date: Tue, 1 Sep 2015 10:54:04 +0200
Subject: [PATCH] fixing modal/prompt for new post

---
 css/style.css                | 49 ++++++++++++++++--------------------
 js/theme_option.js           |  9 ++++++-
 sass/layout/_responsive.sass |  7 +-----
 sass/style.sass              |  8 ++++--
 4 files changed, 37 insertions(+), 36 deletions(-)

diff --git a/css/style.css b/css/style.css
index b7636cf..27111ac 100644
--- a/css/style.css
+++ b/css/style.css
@@ -114,7 +114,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
   font-weight: 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;
   font-family: "Ionicons";
   speak: none;
@@ -128,11 +128,11 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
   -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;
 }
 
-.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;
 }
 
@@ -140,7 +140,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
   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: "";
 }
 
@@ -172,11 +172,11 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
   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: "";
 }
 
-.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: "";
 }
 
@@ -342,7 +342,7 @@ h3 .isFollowing:after, .login .module p span .isFollowing:after {
   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: "";
   display: table;
   clear: both;
@@ -735,7 +735,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
   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;
   background: #212121;
   height: 52px;
@@ -743,7 +743,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
   -webkit-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;
   line-height: 52px;
   font-weight: 500;
@@ -751,10 +751,10 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
   float: left;
   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;
 }
-.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;
   top: 0;
   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);
   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;
 }
-.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;
 }
-.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;
 }
-.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;
   float: left;
   margin-left: 10px;
   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;
 }
 
@@ -834,7 +834,7 @@ button.light:hover, .light.show-more-followers:hover, a.button.light:hover {
   padding: 10px;
   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;
   color: white;
 }
@@ -2159,13 +2159,15 @@ ul.userMenu-search-profiles button, ul.userMenu-search-profiles .show-more-follo
 .mini-profile .post-area {
   margin-top: 1px;
   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 {
+  padding: 20px;
   -moz-box-shadow: none;
   -webkit-box-shadow: none;
   box-shadow: none;
-  padding: 0;
   margin: 0;
 }
 .mini-profile .post-area-new textarea {
@@ -2835,14 +2837,7 @@ ul.dropdown-menu li > li > a {
   }
 
   #postboard-top {
-    position: fixed !important;
-    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);
+    display: none;
   }
 
   .modal-wrapper {
diff --git a/js/theme_option.js b/js/theme_option.js
index 2bcdfc0..d2b36fd 100644
--- a/js/theme_option.js
+++ b/js/theme_option.js
@@ -114,11 +114,18 @@ function reOrganizeTemplates() { // for nin's templating
             else  {$('.mini-profile .post-area').removeClass('display');}
             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').removeClass('display');
     });
-
+    $('.mini-profile .post-area .modal-close').bind( 'click', function() {
+        $('.mini-profile .post-area').removeClass('display');
+    });
 }
 
 function reAppendModules() { // avoid w1200 things
diff --git a/sass/layout/_responsive.sass b/sass/layout/_responsive.sass
index 830786e..6845d89 100644
--- a/sass/layout/_responsive.sass
+++ b/sass/layout/_responsive.sass
@@ -84,12 +84,7 @@
 		.modal-wrapper & 
 			top: auto
 	#postboard-top 
-		position: fixed!important
-		bottom: 0
-		top: auto 
-		margin: 0
-		width: 100%
-		+box-shadow(0 -5px 13px rgba(#111, 0.2))
+		display: none
 	.modal-wrapper
 		width: 90%
 
diff --git a/sass/style.sass b/sass/style.sass
index 1769740..5765a41 100755
--- a/sass/style.sass
+++ b/sass/style.sass
@@ -173,12 +173,16 @@ ul.userMenu-search-profiles
 	.post-area
 		margin-top: 1px
 		margin-bottom: 20px
-		padding: .5em
+		
 		@extend .clear-fix
+		.modal-header 
+			@extend .modal-header 
+			h3 
+				padding: 0 0 0 20px
 	.post-area-new
 		@extend .open
+		padding: 20px
 		+box-shadow(none)
-		padding: 0
 		margin: 0
 		textarea
 			width: 100%