From e300fbc7cb18acd7239844c9ac7aac698dbd7cb5 Mon Sep 17 00:00:00 2001
From: Tara Rostami <132676256+TaraRostami@users.noreply.github.com>
Date: Tue, 12 Dec 2023 20:03:29 +0330
Subject: [PATCH] Update inbound_info_modal.html (#1342)

* Update login.html

* Update custom.css

* Update inbound_info_modal.html

* Update custom.css

* Update custom.css
---
 web/assets/css/custom.css            |  9 ++++++++-
 web/html/login.html                  |  4 ++--
 web/html/xui/form/client.html        |  2 +-
 web/html/xui/form/tls_settings.html  |  8 ++++----
 web/html/xui/inbound_info_modal.html | 26 +++++++++++++-------------
 5 files changed, 28 insertions(+), 21 deletions(-)

diff --git a/web/assets/css/custom.css b/web/assets/css/custom.css
index 667f9f03..ae2dbf16 100644
--- a/web/assets/css/custom.css
+++ b/web/assets/css/custom.css
@@ -1052,7 +1052,14 @@ li.ant-select-dropdown-menu-item:empty:after {
 	max-width: 200px;
 }
 
-.ant-modal-body {
+.tag-of-wrap-l {
+	text-wrap: pretty;
+	overflow-wrap: anywhere;
+	max-width: 350px;
+}
+
+.ant-modal-body,
+.ant-collapse-content>.ant-collapse-content-box {
     overflow-x: auto;
 }
 
diff --git a/web/html/login.html b/web/html/login.html
index 8f5a6f4d..11fff20b 100644
--- a/web/html/login.html
+++ b/web/html/login.html
@@ -102,8 +102,8 @@
   }
   .ant-btn-primary-login {
     color: #008771;
-    background-color: #eef9f7;
-    border-color: #89d9cc;
+    background-color: #e8f4f2;
+    border-color: #a2d3cb;
     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.12);
     box-shadow: none;
     width: 100%;
diff --git a/web/html/xui/form/client.html b/web/html/xui/form/client.html
index 30bf6566..0ade5241 100644
--- a/web/html/xui/form/client.html
+++ b/web/html/xui/form/client.html
@@ -39,7 +39,7 @@
         <tr v-if="inbound.protocol === Protocols.VMESS || inbound.protocol === Protocols.VLESS">
             <td>ID <a-icon @click="client.id = RandomUtil.randomUUID()" type="sync"></a-icon></td>
             <td>
-                <a-input v-model.trim="client.id" style="width: 300px;"></a-input>
+                <a-input v-model.trim="client.id" style="width: 250px;"></a-input>
             </td>
         </tr>
         <tr v-if="client.email && app.subSettings.enable">
diff --git a/web/html/xui/form/tls_settings.html b/web/html/xui/form/tls_settings.html
index d277df79..1aa53193 100644
--- a/web/html/xui/form/tls_settings.html
+++ b/web/html/xui/form/tls_settings.html
@@ -327,7 +327,7 @@
                 </td>
                 <td>
                     <a-form-item>
-                        <a-input v-model.trim="inbound.stream.reality.dest" style="width: 300px"></a-input>
+                        <a-input v-model.trim="inbound.stream.reality.dest" style="width: 250px"></a-input>
                     </a-form-item>
                 </td>
             </tr>
@@ -337,7 +337,7 @@
                 </td>
                 <td>
                     <a-form-item>
-                        <a-input v-model.trim="inbound.stream.reality.serverNames" style="width: 300px"></a-input>
+                        <a-input v-model.trim="inbound.stream.reality.serverNames" style="width: 250px"></a-input>
                     </a-form-item>
                 </td>
             </tr>
@@ -369,7 +369,7 @@
                 </td>
                 <td>
                     <a-form-item>
-                        <a-input v-model.trim="inbound.stream.reality.privateKey" style="width: 300px"></a-input>
+                        <a-input v-model.trim="inbound.stream.reality.privateKey" style="width: 250px"></a-input>
                     </a-form-item>
                 </td>
             </tr>
@@ -380,7 +380,7 @@
                 <td>
                     <a-form-item>
                         <a-input v-model.trim="inbound.stream.reality.settings.publicKey"
-                            style="width: 300px"></a-input>
+                            style="width: 250px"></a-input>
                     </a-form-item>
                 </td>
             </tr>
diff --git a/web/html/xui/inbound_info_modal.html b/web/html/xui/inbound_info_modal.html
index 9d1527b0..1a9c4ac0 100644
--- a/web/html/xui/inbound_info_modal.html
+++ b/web/html/xui/inbound_info_modal.html
@@ -11,7 +11,7 @@
         <tr><td>
                 <table>
                     <tr><td>{{ i18n "protocol" }}</td><td><a-tag color="purple">[[ dbInbound.protocol ]]</a-tag></td></tr>
-                    <tr><td>{{ i18n "pages.inbounds.address" }}</td><td><a-tag>[[ dbInbound.address ]]</a-tag></td></tr>
+                    <tr><td>{{ i18n "pages.inbounds.address" }}</td><td><a-tag class="tag-of-wrap">[[ dbInbound.address ]]</a-tag></td></tr>
                     <tr><td>{{ i18n "pages.inbounds.port" }}</td><td><a-tag>[[ dbInbound.port ]]</a-tag></td></tr>
                 </table>
             </td>
@@ -24,28 +24,28 @@
                         <tr>
                             <td>{{ i18n "host" }}</td>
                             <td v-if="inbound.host"><a-tag>[[ inbound.host ]]</a-tag></td>
-                            <td v-else><a-tag color="orange">{{ i18n "none" }}</a-tag></td></tr>
+                            <td v-else><a-tag class="tag-of-wrap" color="orange">{{ i18n "none" }}</a-tag></td></tr>
                         </tr>
                         <tr>
                             <td>{{ i18n "path" }}</td>
-                            <td v-if="inbound.path"><a-tag>[[ inbound.path ]]</a-tag></td>
+                            <td v-if="inbound.path"><a-tag class="tag-of-wrap">[[ inbound.path ]]</a-tag></td>
                             <td v-else><a-tag color="orange">{{ i18n "none" }}</a-tag></td>
                         </tr>
                     </template>
 
                     <template v-if="inbound.isQuic">
-                        <tr><td>quic {{ i18n "encryption" }}</td><td><a-tag>[[ inbound.quicSecurity ]]</a-tag></td></tr>
-                        <tr><td>quic {{ i18n "password" }}</td><td><a-tag>[[ inbound.quicKey ]]</a-tag></td></tr>
-                        <tr><td>quic {{ i18n "camouflage" }}</td><td><a-tag>[[ inbound.quicType ]]</a-tag></td></tr>
+                        <tr><td>quic {{ i18n "encryption" }}</td><td><a-tag class="tag-of-wrap">[[ inbound.quicSecurity ]]</a-tag></td></tr>
+                        <tr><td>quic {{ i18n "password" }}</td><td><a-tag class="tag-of-wrap">[[ inbound.quicKey ]]</a-tag></td></tr>
+                        <tr><td>quic {{ i18n "camouflage" }}</td><td><a-tag class="tag-of-wrap">[[ inbound.quicType ]]</a-tag></td></tr>
                     </template>
         
                     <template v-if="inbound.isKcp">
-                        <tr><td>kcp {{ i18n "encryption" }}</td><td><a-tag>[[ inbound.kcpType ]]</a-tag></td></tr>
-                        <tr><td>kcp {{ i18n "password" }}</td><td><a-tag>[[ inbound.kcpSeed ]]</a-tag></td></tr>
+                        <tr><td>kcp {{ i18n "encryption" }}</td><td><a-tag class="tag-of-wrap">[[ inbound.kcpType ]]</a-tag></td></tr>
+                        <tr><td>kcp {{ i18n "password" }}</td><td><a-tag class="tag-of-wrap">[[ inbound.kcpSeed ]]</a-tag></td></tr>
                     </template>
         
                     <template v-if="inbound.isGrpc">
-                        <tr><td>grpc serviceName</td><td><a-tag>[[ inbound.serviceName ]]</a-tag></td></tr>
+                        <tr><td>grpc serviceName</td><td><a-tag class="tag-of-wrap">[[ inbound.serviceName ]]</a-tag></td></tr>
                         <tr><td>grpc multiMode</td><td><a-tag>[[ inbound.stream.grpc.multiMode ]]</a-tag></td></tr>
                     </template>
                 </table>
@@ -68,7 +68,7 @@
             <td><a-tag color="green">[[ inbound.settings.method ]]</a-tag></td>
         </tr><tr v-if="inbound.isSS2022">
             <td>{{ i18n "password" }}</td>
-            <td><a-tag>[[ inbound.settings.password ]]</a-tag></td>
+            <td><a-tag class="tag-of-wrap-l">[[ inbound.settings.password ]]</a-tag></td>
         </tr><tr>
             <td>{{ i18n "pages.inbounds.network" }}</td>
             <td><a-tag color="green">[[ inbound.settings.network ]]</a-tag></td>
@@ -83,7 +83,7 @@
             </tr>
             <tr v-if="infoModal.clientSettings.id">
                 <td>ID</td>
-                <td><a-tag>[[ infoModal.clientSettings.id ]]</a-tag></td>
+                <td><a-tag class="tag-of-wrap-l">[[ infoModal.clientSettings.id ]]</a-tag></td>
             </tr>
             <tr v-if="infoModal.inbound.canEnableTlsFlow()">
                 <td>Flow</td>
@@ -91,7 +91,7 @@
             </tr>
             <tr v-if="infoModal.clientSettings.password">
                 <td>Password</td>
-                <td><a-tag>[[ infoModal.clientSettings.password ]]</a-tag></td>
+                <td><a-tag class="tag-of-wrap-l">[[ infoModal.clientSettings.password ]]</a-tag></td>
             </tr>
             <tr>
                 <td>{{ i18n "status" }}</td>
@@ -324,4 +324,4 @@
     });
 
 </script>
-{{end}}
\ No newline at end of file
+{{end}}