Refine sidepanel plus payment visibility

sidepanel/sidepanel.css

@@ -657,6 +657,7 @@ header {
   display: flex;
   align-items: center;
   min-height: 34px;
+  margin-bottom: 14px;
   padding: 7px 46px;
   border: 1px solid color-mix(in srgb, var(--amber) 24%, var(--border));
   border-radius: var(--radius-sm);
@@ -683,6 +684,11 @@ header {
   letter-spacing: 0.08em;
 }
 
+.auto-run-ad-badge--end {
+  left: auto;
+  right: 10px;
+}
+
 .auto-run-ad-viewport {
   width: 100%;
   min-width: 0;
@@ -702,7 +708,8 @@ header {
   display: block;
   font-size: 12px;
   line-height: 1.4;
-  color: var(--text-secondary);
+  color: var(--text-primary);
+  font-weight: 500;
   white-space: nowrap;
 }
 
@@ -712,7 +719,8 @@ header {
 }
 
 .auto-run-ad-link {
-  color: color-mix(in srgb, var(--amber) 80%, var(--link));
+  color: color-mix(in srgb, var(--amber) 88%, var(--text-primary));
+  font-weight: 700;
   text-decoration: underline;
   text-decoration-thickness: 1px;
   text-underline-offset: 2px;

sidepanel/sidepanel.html

@@ -80,6 +80,17 @@
     </div>
   </header>
 
+  <div id="auto-run-ad-bar" class="auto-run-ad-bar" hidden aria-live="polite">
+    <span class="auto-run-ad-badge">作者自营</span>
+    <div id="auto-run-ad-viewport" class="auto-run-ad-viewport">
+      <div id="auto-run-ad-track" class="auto-run-ad-track">
+        <span id="auto-run-ad-text" class="auto-run-ad-text"></span>
+        <span id="auto-run-ad-text-clone" class="auto-run-ad-text auto-run-ad-text--clone" aria-hidden="true"></span>
+      </div>
+    </div>
+    <span class="auto-run-ad-badge auto-run-ad-badge--end">售后保障</span>
+  </div>
+
   <div id="contribution-update-layer" class="contribution-update-layer" hidden>
     <div id="contribution-update-hint" class="contribution-update-hint" aria-live="polite" hidden>
       <p id="contribution-update-hint-text" class="contribution-update-hint-text">
@@ -124,15 +135,6 @@
           <option value="sub2api">SUB2API</option>
           <option value="codex2api">Codex2API</option>
         </select>
-      </div>
-      <div id="auto-run-ad-bar" class="auto-run-ad-bar" hidden aria-live="polite">
-        <span class="auto-run-ad-badge">广告</span>
-        <div id="auto-run-ad-viewport" class="auto-run-ad-viewport">
-          <div id="auto-run-ad-track" class="auto-run-ad-track">
-            <span id="auto-run-ad-text" class="auto-run-ad-text"></span>
-            <span id="auto-run-ad-text-clone" class="auto-run-ad-text auto-run-ad-text--clone" aria-hidden="true"></span>
-          </div>
-        </div>
       </div>
         <div id="contribution-mode-panel" class="contribution-mode-panel" hidden>
           <div class="contribution-mode-panel-header">
@@ -326,8 +328,10 @@
         <div class="data-inline">
           <select id="select-plus-payment-method" class="data-select">
             <option value="paypal">PayPal</option>
+            <!--
             <option value="gopay">GoPay</option>
             <option value="gpc-helper">GPC</option>
+            -->
           </select>
           <button id="btn-gpc-card-key-purchase" class="btn btn-outline btn-sm data-inline-btn" type="button" style="display:none;">购买卡密</button>
           <span class="setting-caption" id="plus-payment-method-caption">PayPal 订阅链路</span>

tests/sidepanel-contribution-button.test.js

@@ -5,13 +5,20 @@ const fs = require('node:fs');
 test('sidepanel html keeps a single contribution mode button in header', () => {
   const html = fs.readFileSync('sidepanel/sidepanel.html', 'utf8');
   const matches = html.match(/id="btn-contribution-mode"/g) || [];
+  const headerEndIndex = html.indexOf('</header>');
+  const adBarIndex = html.indexOf('id="auto-run-ad-bar"');
+  const contributionLayerIndex = html.indexOf('id="contribution-update-layer"');
   const serviceIndex = html.indexOf('<script src="contribution-content-update-service.js"></script>');
   const sidepanelIndex = html.indexOf('<script src="sidepanel.js"></script>');
 
   assert.equal(matches.length, 1);
   assert.match(html, /id="btn-contribution-mode"[^>]*title="进入贡献模式并打开官网页"/);
   assert.match(html, />贡献\/使用教程<\/button>/);
-  assert.match(html, /<\/header>\s*<div id="contribution-update-layer"/);
+  assert.notEqual(headerEndIndex, -1);
+  assert.notEqual(adBarIndex, -1);
+  assert.notEqual(contributionLayerIndex, -1);
+  assert.ok(headerEndIndex < adBarIndex);
+  assert.ok(adBarIndex < contributionLayerIndex);
   assert.match(html, /id="contribution-update-layer"/);
   assert.match(html, /id="contribution-update-hint"/);
   assert.match(html, /id="contribution-update-hint-text"/);