对话框加入关闭按钮，统一用户体验

_locales/en/messages.json

@@ -300,7 +300,7 @@
     "description": "Close button"
   },
   "createEnvBtn": {
-    "message": "+ New Environment",
+    "message": "New Environment",
     "description": "Create env button"
   },
   "envManageEmpty": {

_locales/zh_CN/messages.json

@@ -300,7 +300,7 @@
     "description": "关闭按钮"
   },
   "createEnvBtn": {
-    "message": "+ 新建环境",
+    "message": "新建环境",
     "description": "新建环境按钮"
   },
   "envManageEmpty": {

popup.css

@@ -981,6 +981,30 @@ h2 {
   width: 100%;
   max-width: 360px;
   box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
+  position: relative;
+}
+
+.modal-close {
+  position: absolute;
+  top: 8px;
+  right: 10px;
+  background: none;
+  border: none;
+  color: #888;
+  font-size: 18px;
+  cursor: pointer;
+  line-height: 1;
+  padding: 2px 6px;
+  border-radius: 4px;
+}
+
+.modal-close:hover {
+  color: #e94560;
+  background: rgba(233, 69, 96, 0.1);
+}
+
+.btn-block {
+  width: 100%;
 }
 
 .modal-content h3 {
@@ -1100,12 +1124,12 @@ h2 {
 
 .env-manage-actions {
   display: flex;
-  gap: 6px;
+  gap: 2px;
+  margin-right: -8px;
 }
 
 .env-manage-actions button {
-  padding: 4px 10px;
-  font-size: 12px;
+  padding: 4px 6px;
 }
 
 .env-manage-empty {

popup.html

@@ -166,18 +166,19 @@
   <!-- 环境管理对话框 -->
   <div id="envManageModal" class="modal">
     <div class="modal-content">
+      <button type="button" class="modal-close" id="envManageCloseX" aria-label="×">×</button>
       <h3 data-i18n="envManageTitle">环境管理</h3>
       <div id="envManageList" class="env-manage-list"></div>
       <div class="modal-warn" id="envManageWarn" style="display:none;"></div>
       <div class="modal-actions">
-        <button type="button" id="envManageClose" class="btn-edit" data-i18n="closeBtn">关闭</button>
-        <button type="button" id="envManageAdd" class="btn-primary" data-i18n="createEnvBtn">+ 新建环境</button>
+        <button type="button" id="envManageAdd" class="btn-primary btn-block" data-i18n="createEnvBtn">新建环境</button>
       </div>
     </div>
   </div>
 
   <div id="envModal" class="modal">
     <div class="modal-content">
+      <button type="button" class="modal-close" id="envModalCloseX" aria-label="×">×</button>
       <h3 id="envModalTitle" data-i18n="envCreateTitle">新建环境</h3>
       <div class="form-group">
         <label for="envNameInput" data-i18n="envNameLabel">环境名称</label>
@@ -244,6 +245,7 @@
   <!-- 编辑域名配置对话框 -->
   <div id="editConfigModal" class="modal">
     <div class="modal-content edit-config-content">
+      <button type="button" class="modal-close" id="editConfigCloseX" aria-label="×">×</button>
       <h3 id="editConfigModalTitle" data-i18n="editConfigTitle">编辑域名配置</h3>
       <div class="form-group">
         <label for="editDomain" data-i18n="domainLabel">域名 / URL 匹配规则</label>

popup.js

@@ -118,7 +118,7 @@ document.addEventListener("DOMContentLoaded", () => {
   const envManageModal = $("envManageModal");
   const envManageList = $("envManageList");
   const envManageWarn = $("envManageWarn");
-  const envManageClose = $("envManageClose");
+  const envManageCloseX = $("envManageCloseX");
   const envManageAdd = $("envManageAdd");
   const envModal = $("envModal");
   const envModalTitle = $("envModalTitle");
@@ -126,6 +126,7 @@ document.addEventListener("DOMContentLoaded", () => {
   const presetEnvTags = $("presetEnvTags");
   const envModalWarn = $("envModalWarn");
   const envModalCancel = $("envModalCancel");
+  const envModalCloseX = $("envModalCloseX");
   const envModalConfirm = $("envModalConfirm");
 
   const pwdModal = $("pwdModal");
@@ -512,10 +513,12 @@ document.addEventListener("DOMContentLoaded", () => {
     });
   });
 
-  envModalCancel.addEventListener("click", () => {
+  function closeEnvModalWithResolve() {
     if (envModalResolve) envModalResolve(null);
     closeEnvModal();
-  });
+  }
+  envModalCancel.addEventListener("click", closeEnvModalWithResolve);
+  envModalCloseX.addEventListener("click", closeEnvModalWithResolve);
 
   envModalConfirm.addEventListener("click", async () => {
     if (!envModalResolve) return;
@@ -646,7 +649,7 @@ document.addEventListener("DOMContentLoaded", () => {
   }
 
   envManageBtn.addEventListener("click", openEnvManageModal);
-  envManageClose.addEventListener("click", closeEnvManageModal);
+  envManageCloseX.addEventListener("click", closeEnvManageModal);
 
   envManageAdd.addEventListener("click", async () => {
     const name = await openEnvModal("create");
@@ -1001,10 +1004,13 @@ document.addEventListener("DOMContentLoaded", () => {
   });
 
   // 编辑配置弹窗：取消
-  editConfigCancel.addEventListener("click", () => {
+  const editConfigCloseX = $("editConfigCloseX");
+  function closeEditConfigModal() {
     editConfigModal.classList.remove("show");
     editModalEditingId = null;
-  });
+  }
+  editConfigCancel.addEventListener("click", closeEditConfigModal);
+  editConfigCloseX.addEventListener("click", closeEditConfigModal);
 
   // 点击遮罩关闭编辑弹窗
   editConfigModal.addEventListener("click", (e) => {