From 92b295193fa6a36a253ef76382b56acf99a89721 Mon Sep 17 00:00:00 2001
From: Richard Hansen <rhansen@rhansen.org>
Date: Fri, 27 Nov 2020 22:37:59 -0500
Subject: [PATCH] css: Apply font formatting to the text, not the high-level
 div

This makes it possible for plugins to add new items without them
rendering centered, at a ridiculous size, or at an awkward location.
---
 src/static/css/pad/loadingbox.css | 10 +++++-----
 src/templates/pad.html            | 16 +++++++++++++---
 2 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/src/static/css/pad/loadingbox.css b/src/static/css/pad/loadingbox.css
index dcd00f469..0c295007d 100644
--- a/src/static/css/pad/loadingbox.css
+++ b/src/static/css/pad/loadingbox.css
@@ -1,13 +1,13 @@
 #editorloadingbox {
+  width: 100%;
+  z-index: 100;
+}
+
+.editorloadingbox-message {
   padding-top: 100px;
-  padding-bottom: 100px;
   font-size: 2.5em;
   color: #aaa;
   text-align: center;
-  position: absolute;
-  width: 100%;
-  height: 30px;
-  z-index: 100;
 }
 
 #editorloadingbox input{
diff --git a/src/templates/pad.html b/src/templates/pad.html
index 9624975ab..28d53c43d 100644
--- a/src/templates/pad.html
+++ b/src/templates/pad.html
@@ -92,12 +92,22 @@
 
       <div id="editorloadingbox">
         <div id="permissionDenied">
-          <p data-l10n-id="pad.permissionDenied">You do not have permission to access this pad</p>
+          <p data-l10n-id="pad.permissionDenied" class="editorloadingbox-message">
+            You do not have permission to access this pad
+          </p>
         </div>
         <% e.begin_block("loading"); %>
-        <p data-l10n-id="pad.loading" id="loading">Loading...</p>
+        <p data-l10n-id="pad.loading" id="loading" class="editorloadingbox-message">
+          Loading...
+        </p>
         <% e.end_block(); %>
-        <noscript><strong>Sorry, you have to enable Javascript in order to use this.</strong></noscript>
+        <noscript>
+          <p class="editorloadingbox-message">
+            <strong>
+              Sorry, you have to enable Javascript in order to use this.
+            </strong>
+          </p>
+        </noscript>
       </div>