From e3b25010b29c82357c46ea9a0a991de6eb80c78e Mon Sep 17 00:00:00 2001
From: Mix <public@mixeme.ru>
Date: Sat, 17 Oct 2026 00:03:21 +0300
Subject: [PATCH] design: test-email - the Test message card in the right stack

Health's left stack is one polled element (health_stack, swapped whole
every refresh): a form there would lose the address being typed. Card 09
moves under Configuration, the right stack's static end, as Configuration
itself sits outside the poll for its button. On a phone the cards keep the
order of their numbers (data-order). outlines.json rewritten for health.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 docs/assets/panel-redesign/panel/health.html  | 26 +++++++++----------
 .../assets/panel-redesign/panel/outlines.json |  6 ++---
 .../panel-redesign/panel/src/health.html      | 26 +++++++++----------
 3 files changed, 29 insertions(+), 29 deletions(-)

diff --git a/docs/assets/panel-redesign/panel/health.html b/docs/assets/panel-redesign/panel/health.html
index 69751f6..8dd0a62 100644
--- a/docs/assets/panel-redesign/panel/health.html
+++ b/docs/assets/panel-redesign/panel/health.html
@@ -123,19 +123,6 @@
             </tbody>
           </table></div>
         </div>
-        <div class="box" id="test-message" data-order="9">
-          <div class="sp-box-head"><span class="sp-no">09</span><h2>Test message</h2><div class="sp-end">Shows what the receiving server answers</div><a class="sp-help" href="help.html#test-message" title="What the test proves"><i class="ti ti-help-circle"></i></a></div>
-          <div class="sp-box-body">
-            <form class="sp-form" method="post" action="out-message.html">
-              <div class="field"><label class="label" for="rcpt">Recipient</label>
-                <div class="field has-addons">
-                  <div class="control is-expanded has-icons-left"><input class="input" id="rcpt" name="recipient" type="email" placeholder="you@elsewhere.example" required><span class="icon is-left"><i class="ti ti-mail"></i></span></div>
-                  <div class="control"><button type="submit" class="button is-primary"><i class="ti ti-send"></i>Send</button></div>
-                </div>
-                <p class="help">From <span class="sp-mono">postmaster@mail.example.org</span>, signed with the server's own key, through Postfix as its notifications go. It opens in the <a href="out-log.html">Outbound log</a>, where its page follows it to the receiving server. Ten an hour.</p></div>
-            </form>
-          </div>
-        </div>
       </div>
       <div class="column is-6">
         <div class="box" id="sockets" data-order="2">
@@ -186,6 +173,19 @@
             <form method="post" action="#"><button type="submit" class="button"><i class="ti ti-reload"></i>Reload configuration</button></form>
           </div>
         </div>
+        <div class="box" id="test-message" data-order="9">
+          <div class="sp-box-head"><span class="sp-no">09</span><h2>Test message</h2><div class="sp-end">Shows what the receiving server answers</div><a class="sp-help" href="help.html#test-message" title="What the test proves"><i class="ti ti-help-circle"></i></a></div>
+          <div class="sp-box-body">
+            <form class="sp-form" method="post" action="out-message.html">
+              <div class="field"><label class="label" for="rcpt">Recipient</label>
+                <div class="field has-addons">
+                  <div class="control is-expanded has-icons-left"><input class="input" id="rcpt" name="recipient" type="email" placeholder="you@elsewhere.example" required><span class="icon is-left"><i class="ti ti-mail"></i></span></div>
+                  <div class="control"><button type="submit" class="button is-primary"><i class="ti ti-send"></i>Send</button></div>
+                </div>
+                <p class="help">From <span class="sp-mono">postmaster@mail.example.org</span>, signed with the server's own key, through Postfix as its notifications go. It opens in the <a href="out-log.html">Outbound log</a>, where its page follows it to the receiving server. Ten an hour.</p></div>
+            </form>
+          </div>
+        </div>
       </div>
     </div>
 
diff --git a/docs/assets/panel-redesign/panel/outlines.json b/docs/assets/panel-redesign/panel/outlines.json
index 47c9595..4f4107e 100644
--- a/docs/assets/panel-redesign/panel/outlines.json
+++ b/docs/assets/panel-redesign/panel/outlines.json
@@ -82,8 +82,7 @@
       "box[Processes]:table",
       "box[Sender check]:table+body",
       "box[Hostname and reverse DNS]:body",
-      "box[Machine]:table",
-      "box[Test message]:body"
+      "box[Machine]:table"
      ]
     },
     {
@@ -91,7 +90,8 @@
       "box[Milter sockets]:table",
       "box[TLS certificate]:body",
       "box[Notification mail]:table+body",
-      "box[Configuration]:body"
+      "box[Configuration]:body",
+      "box[Test message]:body"
      ]
     }
    ]
diff --git a/docs/assets/panel-redesign/panel/src/health.html b/docs/assets/panel-redesign/panel/src/health.html
index 678a53b..88a9a6e 100644
--- a/docs/assets/panel-redesign/panel/src/health.html
+++ b/docs/assets/panel-redesign/panel/src/health.html
@@ -57,19 +57,6 @@
             </tbody>
           </table></div>
         </div>
-        <div class="box" id="test-message" data-order="9">
-          <div class="sp-box-head"><span class="sp-no">09</span><h2>Test message</h2><div class="sp-end">Shows what the receiving server answers</div><a class="sp-help" href="help.html#test-message" title="What the test proves"><i class="ti ti-help-circle"></i></a></div>
-          <div class="sp-box-body">
-            <form class="sp-form" method="post" action="out-message.html">
-              <div class="field"><label class="label" for="rcpt">Recipient</label>
-                <div class="field has-addons">
-                  <div class="control is-expanded has-icons-left"><input class="input" id="rcpt" name="recipient" type="email" placeholder="you@elsewhere.example" required><span class="icon is-left"><i class="ti ti-mail"></i></span></div>
-                  <div class="control"><button type="submit" class="button is-primary"><i class="ti ti-send"></i>Send</button></div>
-                </div>
-                <p class="help">From <span class="sp-mono">postmaster@mail.example.org</span>, signed with the server's own key, through Postfix as its notifications go. It opens in the <a href="out-log.html">Outbound log</a>, where its page follows it to the receiving server. Ten an hour.</p></div>
-            </form>
-          </div>
-        </div>
       </div>
       <div class="column is-6">
         <div class="box" id="sockets" data-order="2">
@@ -120,5 +107,18 @@
             <form method="post" action="#"><button type="submit" class="button"><i class="ti ti-reload"></i>Reload configuration</button></form>
           </div>
         </div>
+        <div class="box" id="test-message" data-order="9">
+          <div class="sp-box-head"><span class="sp-no">09</span><h2>Test message</h2><div class="sp-end">Shows what the receiving server answers</div><a class="sp-help" href="help.html#test-message" title="What the test proves"><i class="ti ti-help-circle"></i></a></div>
+          <div class="sp-box-body">
+            <form class="sp-form" method="post" action="out-message.html">
+              <div class="field"><label class="label" for="rcpt">Recipient</label>
+                <div class="field has-addons">
+                  <div class="control is-expanded has-icons-left"><input class="input" id="rcpt" name="recipient" type="email" placeholder="you@elsewhere.example" required><span class="icon is-left"><i class="ti ti-mail"></i></span></div>
+                  <div class="control"><button type="submit" class="button is-primary"><i class="ti ti-send"></i>Send</button></div>
+                </div>
+                <p class="help">From <span class="sp-mono">postmaster@mail.example.org</span>, signed with the server's own key, through Postfix as its notifications go. It opens in the <a href="out-log.html">Outbound log</a>, where its page follows it to the receiving server. Ten an hour.</p></div>
+            </form>
+          </div>
+        </div>
       </div>
     </div>