moving remaining time / for your eyes only message from nav bar into

status alert in bootstrap theme, to ensure it is seen even with a
collapsed nav bar as in the mobile view

js/zerobin.js

@@ -553,7 +553,8 @@ $(function() {
                 }
             }
 
-            // Display paste expiration.
+            // Display paste expiration / for your eyes only.
+            var content = this.remainingTime.contents();
             if (comments[0].meta.expire_date)
             {
                 var expiration = helper.secondsToHuman(comments[0].meta.remaining_time),
@@ -561,9 +562,9 @@ $(function() {
                         'This document will expire in %d ' + expiration[1] + '.',
                         'This document will expire in %d ' + expiration[1] + 's.'
                     ];
+                content[content.length - 1].nodeValue = ' ' + i18n._(expirationLabel, expiration[0]);
                 this.remainingTime.removeClass('foryoureyesonly')
-                                   .text(i18n._(expirationLabel, expiration[0]))
-                                   .removeClass('hidden');
+                                  .removeClass('hidden');
             }
             if (comments[0].meta.burnafterreading)
             {
@@ -571,9 +572,11 @@ $(function() {
                 .fail(function() {
                     zerobin.showError(i18n._('Could not delete the paste, it was not stored in burn after reading mode.'));
                 });
+                content[content.length - 1].nodeValue = ' ' + i18n._(
+                    'FOR YOUR EYES ONLY. Don\'t close this window, this message can\'t be displayed again.'
+                );
                 this.remainingTime.addClass('foryoureyesonly')
-                                   .text(i18n._('FOR YOUR EYES ONLY. Don\'t close this window, this message can\'t be displayed again.'))
-                                   .removeClass('hidden');
+                                  .removeClass('hidden');
                 // Discourage cloning (as it can't really be prevented).
                 this.cloneButton.addClass('hidden');
             }

tpl/bootstrap.html

@@ -80,9 +80,6 @@
 								<input type="password" id="passwordinput" placeholder="{function="t('Password (recommended)')"}" class="form-control" size="19"/>
 							</div>
 						</li>{/if}
-						<li>
-							<p id="remainingtime" class="hidden navbar-text"></p>
-						</li>
 					</ul>
 					<ul class="nav navbar-nav pull-right">
 						<li>
@@ -97,8 +94,13 @@
 		<header class="container">{if="strlen($NOTICE)"}
 			<div role="alert" class="alert alert-info">
 				<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span> {$NOTICE|htmlspecialchars}
-			</div>{/if}{if="strlen($STATUS)"}
-			<div id="status" role="alert" class="alert alert-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> {$STATUS|htmlspecialchars}</div>{/if}
+			</div>{/if}
+			<div id="remainingtime" role="alert" class="hidden alert alert-info">
+				<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
+			</div>{if="strlen($STATUS)"}
+			<div id="status" role="alert" class="alert alert-success">
+				<span class="glyphicon glyphicon-ok" aria-hidden="true"></span> {$STATUS|htmlspecialchars}
+			</div>{/if}
 			<div id="errormessage" role="alert" class="{if="!strlen($ERROR)"}hidden {/if}alert alert-danger"><span class="glyphicon glyphicon-alert" aria-hidden="true"></span> {$ERROR|htmlspecialchars}</div>
 			<div id="noscript" role="alert" class="nonworking alert alert-warning"><span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span> {function="t('Javascript is required for ZeroBin to work.<br />Sorry for the inconvenience.')"}</div>
 			<div id="oldienotice" role="alert" class="hidden nonworking alert alert-danger"><span class="glyphicon glyphicon-alert" aria-hidden="true"></span> {function="t('ZeroBin requires a modern browser to work.')"}</div>