Style and layout changes, fix document title.

sanic/pages/base.py

@@ -8,11 +8,11 @@ from sanic.pages.css import CSS
 
 
 class BasePage(ABC, metaclass=CSS):  # no cov
-    TITLE = "Unknown"
+    TITLE = "Sanic"
     CSS: str
 
     def __init__(self, debug: bool = True) -> None:
-        self.doc = Document(self.TITLE, lang="en")
+        self.doc = None
         self.debug = debug
 
     @property
@@ -20,6 +20,7 @@ class BasePage(ABC, metaclass=CSS):  # no cov
         return self.CSS
 
     def render(self) -> str:
+        self.doc = Document(self.TITLE, lang="en")
         self._head()
         self._body()
         self._foot()

sanic/pages/error.py

@@ -26,11 +26,17 @@ class ErrorPage(BasePage):
         full: bool,
     ) -> None:
         super().__init__()
-        # Internal server errors come with the text of the exception, which we don't want to show to the user.
+        # Internal server errors come with the text of the exception,
-        # FIXME: This needs to be done some place else but I am not digging into that now.
+        # which we don't want to show to the user.
+        # FIXME: Needs to be done in a better way, elsewhere
         if "Internal Server Error" in title:
-            text = "The application encountered an unexpected error and could not continue."
+            text = "The application encountered an unexpected error and could not continue."  # noqa: E501
-        self.TITLE = E.strong(request.app.name)(" cannot handle your request")
+        name = request.app.name.replace("_", " ").strip()
+        if name.islower():
+            name = name.title()
+        self.TITLE = E("Application ").strong(name)(
+            " cannot handle your request"
+        )
         self.title = title
         self.text = text
         self.request = request

sanic/pages/styles/BasePage.css

@@ -29,7 +29,9 @@ body>* {
         font-size: calc(6px + 10 * 100vw / 1000);
     }
 }
-
+main {
+    min-height: 70vh;  /* Make sure the footer is closer to bottom */
+}
 .smalltext {
     font-size: 1.0rem;
 }

sanic/pages/styles/ErrorPage.css

@@ -1,5 +1,6 @@
 /** ErrorPage **/
 summary {
+    margin-top: 3em;
     color: #888;
 }
 
@@ -15,7 +16,7 @@ dl.key-value-table {
     width: 100%;
     display: grid;
     grid-template-columns: 1fr 5fr;
-    grid-gap: 0.5rem;
+    grid-gap: .3em;
     white-space: pre-wrap;
 }
 dl.key-value-table * {