Keep status dot inline next to server name

Author: ddrayko

public/css/style.css

@@ -1090,6 +1090,9 @@ cap-widget {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  display: flex;
+  align-items: center;
+  gap: 6px;
 }
 
 .nav-sub-egg-name {
@@ -1116,6 +1119,7 @@ cap-widget {
   height: 6px;
   border-radius: 50%;
   flex-shrink: 0;
+  display: inline-block;
 }
 
 .nav-sub-dot.dot-active {

public/js/app.js

@@ -1692,10 +1692,9 @@ function buildServerSubList() {
       <a class="nav-sub-item ${isActive ? 'active' : ''}" data-server-nav="${s.id}" href="/server/${s.id}">
         <span class="nav-sub-nest-icon">${renderNestLogoSmall(s.nestLogo)}</span>
         <span class="nav-sub-server-info">
-          <span class="nav-sub-server-name">${escapeHtml(s.name)}</span>
+          <span class="nav-sub-server-name"><span class="nav-sub-dot ${dotClass}"></span>${escapeHtml(s.name)}</span>
           ${eggName ? html`<span class="nav-sub-egg-name">${escapeHtml(eggName)}</span>` : ''}
         </span>
-        <span class="nav-sub-dot ${dotClass}"></span>
       </a>
     `;
   }).join('');