Move admin prompt to fixed footer and adjust layout

src/app/App.tsx

@@ -228,6 +228,7 @@ export function App() {
     [appliedSnapshot, currentSnapshot],
   );
   const hasUnappliedChanges = pendingChanges.length > 0;
+  const hasAdminPrompt = Boolean(adminStatus?.canRestartElevated);
   const shellStyle = hasUnappliedChanges
     ? ({ '--change-row-count': String(pendingChanges.length) } as CSSProperties)
     : undefined;
@@ -964,16 +965,16 @@ export function App() {
   }
 
   function renderAdminPrompt() {
-    if (!adminStatus?.canRestartElevated) return null;
+    if (!hasAdminPrompt) return null;
 
     return (
       <aside className="admin-prompt" aria-label="Права администратора">
         <span className="admin-prompt-icon" aria-hidden="true">
-          <ShieldAlert size={18} strokeWidth={1.9} />
+          <ShieldAlert size={15} strokeWidth={1.9} />
         </span>
         <div className="admin-prompt-copy">
-          <strong>Один запрос прав вместо серии UAC</strong>
-          <span>{adminStatus.message}</span>
+          <strong>Права администратора</strong>
+          <span>{adminStatus?.message}</span>
         </div>
         <Button
           type="button"
@@ -1646,7 +1647,14 @@ export function App() {
   }
 
   return (
-    <main className={`simple-shell ${hasUnappliedChanges ? 'has-change-dock' : ''}`} style={shellStyle}>
+    <main
+      className={[
+        'simple-shell',
+        hasUnappliedChanges ? 'has-change-dock' : '',
+        hasAdminPrompt ? 'has-admin-prompt' : '',
+      ].filter(Boolean).join(' ')}
+      style={shellStyle}
+    >
       <section className="simple-panel">
         <header className="simple-header">
           <div>
@@ -1666,7 +1674,6 @@ export function App() {
         </header>
 
         {renderTabs()}
-        {renderAdminPrompt()}
         <div className={`tab-panel-frame swipe-${tabTransitionDirection}`} key={activePanel}>
           {renderActivePanel()}
         </div>
@@ -1681,6 +1688,7 @@ export function App() {
         onToggle={() => setIsLogOpen((current) => !current)}
         formatTime={formatLogTime}
       />
+      {renderAdminPrompt()}
     </main>
   );
 }

src/styles/app.css

@@ -1,6 +1,7 @@
 :root {
   --app-footer-height: 54px;
   --app-change-dock-height: 0px;
+  --app-admin-prompt-height: 0px;
   --change-row-count: 1;
   --app-header-row-height: 50px;
   --app-tab-height: 46px;
@@ -762,18 +763,22 @@ button:disabled {
   height: 100vh;
   overflow: hidden;
   background: #101216;
-  padding: var(--app-header-height) 0 calc(var(--app-footer-height) + var(--app-change-dock-height));
+  padding: var(--app-header-height) 0 calc(var(--app-footer-height) + var(--app-change-dock-height) + var(--app-admin-prompt-height));
 }
 
 .simple-shell.has-change-dock {
   --app-change-dock-height: clamp(60px, calc(20px + (var(--change-row-count) * 26px)), 220px);
 }
 
+.simple-shell.has-admin-prompt {
+  --app-admin-prompt-height: 56px;
+}
+
 .simple-panel {
   display: grid;
   align-content: start;
   min-height: 0;
-  height: calc(100vh - var(--app-header-height) - var(--app-footer-height) - var(--app-change-dock-height));
+  height: calc(100vh - var(--app-header-height) - var(--app-footer-height) - var(--app-change-dock-height) - var(--app-admin-prompt-height));
   width: 100%;
   border: 0;
   border-radius: 0;
@@ -906,24 +911,30 @@ button:disabled {
 }
 
 .admin-prompt {
+  position: fixed;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 40;
   display: grid;
   grid-template-columns: auto minmax(0, 1fr) auto;
-  gap: 10px;
+  gap: 8px;
   align-items: center;
+  height: var(--app-admin-prompt-height);
   min-width: 0;
-  border: 1px solid rgba(245, 158, 11, 0.44);
-  border-radius: 4px;
-  background: rgba(120, 53, 15, 0.18);
-  margin-bottom: 10px;
-  padding: 8px 10px;
+  border-top: 1px solid rgba(245, 158, 11, 0.38);
+  background: #17150f;
+  box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
+  margin: 0;
+  padding: 5px 14px;
 }
 
 .admin-prompt-icon {
   display: grid;
   place-items: center;
-  width: 32px;
-  min-width: 32px;
-  height: 32px;
+  width: 26px;
+  min-width: 26px;
+  height: 26px;
   border: 1px solid rgba(245, 158, 11, 0.28);
   border-radius: 4px;
   background: rgba(15, 23, 42, 0.42);
@@ -932,24 +943,31 @@ button:disabled {
 
 .admin-prompt-copy {
   display: grid;
-  gap: 2px;
+  gap: 1px;
   min-width: 0;
 }
 
 .admin-prompt-copy strong {
   color: #f8fafc;
-  font-size: 13px;
+  font-size: 12px;
   font-weight: 800;
+  line-height: 1.25;
+  white-space: nowrap;
 }
 
 .admin-prompt-copy span {
+  display: -webkit-box;
   color: #c7b489;
-  font-size: 12px;
-  overflow-wrap: anywhere;
+  font-size: 11px;
+  line-height: 1.25;
+  overflow: hidden;
+  white-space: normal;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
 }
 
 .admin-prompt-action {
-  min-width: 230px;
+  min-width: 190px;
   white-space: nowrap;
 }
 
@@ -2081,7 +2099,7 @@ button.summary-card:hover {
 .changes-dock {
   position: fixed;
   right: 0;
-  bottom: var(--app-footer-height);
+  bottom: calc(var(--app-footer-height) + var(--app-admin-prompt-height));
   left: 0;
   z-index: 38;
   display: grid;
@@ -2511,7 +2529,7 @@ button.summary-card:hover {
 .log-dock {
   position: fixed;
   right: 0;
-  bottom: 0;
+  bottom: var(--app-admin-prompt-height);
   left: 0;
   z-index: 40;
   display: grid;
@@ -2774,15 +2792,19 @@ button.summary-card:hover {
 
 @media (max-width: 680px) {
   .simple-shell {
-    padding: var(--app-header-height) 0 calc(var(--app-footer-height) + var(--app-change-dock-height));
+    padding: var(--app-header-height) 0 calc(var(--app-footer-height) + var(--app-change-dock-height) + var(--app-admin-prompt-height));
   }
 
   .simple-shell.has-change-dock {
     --app-change-dock-height: clamp(104px, calc(82px + (var(--change-row-count) * 25px)), 260px);
   }
 
+  .simple-shell.has-admin-prompt {
+    --app-admin-prompt-height: 92px;
+  }
+
   .simple-panel {
-    height: calc(100vh - var(--app-header-height) - var(--app-footer-height) - var(--app-change-dock-height));
+    height: calc(100vh - var(--app-header-height) - var(--app-footer-height) - var(--app-change-dock-height) - var(--app-admin-prompt-height));
     padding: 12px 12px 16px;
   }
 
@@ -2790,6 +2812,15 @@ button.summary-card:hover {
     grid-template-columns: auto minmax(0, 1fr);
     align-items: start;
     gap: 8px;
+    padding: 8px 10px;
+  }
+
+  .admin-prompt-copy span {
+    display: -webkit-box;
+    overflow: hidden;
+    white-space: normal;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
   }
 
   .admin-prompt-action {
@@ -3044,7 +3075,7 @@ button.summary-card:hover {
   .log-dock {
     position: fixed;
     right: 0;
-    bottom: 0;
+    bottom: var(--app-admin-prompt-height);
     left: 0;
     grid-template-columns: minmax(0, 1fr) auto;
     margin: 0;