Fix missing form-control classes & some padding

- Missing `form-control` on a textbox gave it weird padding,
  this fixes it.
- Add new server is set up as a [button addon](https://getbootstrap.com/docs/5.3/forms/input-group/#button-addons)
- Add a little right margin to the username in the navbar,
  just before the logout button. Otherwise they were 'stuck'
  to each other

share/jupyterhub/templates/home.html

@@ -39,12 +39,16 @@ <h2>Named Servers</h2>
         <tbody>
           <tr class="home-server-row add-server-row">
             <td colspan="4">
-              <input class="new-server-name"
-                     aria-label="server name"
-                     placeholder="name-your-server">
-              <button role="button"
-                      type="button"
-                      class="new-server-btn btn btn-xs btn-primary">Add New Server</button>
+              <div class="input-group">
+                <input
+                  class="new-server-name form-control"
+                  aria-label="server name"
+                  placeholder="name-your-server">
+                <button role="button"
+                  type="button"
+                  class="new-server-btn btn btn-xs btn-primary">Add New Server</button>
+              </div>
+
             </td>
           </tr>
           {% for spawner in named_spawners %}

share/jupyterhub/templates/page.html

@@ -167,7 +167,7 @@ <h2 class="modal-title" id="{{ key }}-label">{{ title }}</h2>
                   {% block login_widget %}
                     <span id="login_widget">
                       {% if user %}
-                        <span class="navbar-text">{{ user.name }}</span>
+                        <span class="navbar-text me-1">{{ user.name }}</span>
                         <a id="logout"
                            role="button"
                            class="btn btn-sm btn-outline-dark"