[gui] redesign forms

Co-Authored-By: Alireza Ahmadi <alireza7@gmail.com>

3 files changed, 24 insertions, 70 deletions

diff --git a/web/assets/css/custom.css b/web/assets/css/custom.css
index ae2dbf16..b633d644 100644
--- a/web/assets/css/custom.css
+++ b/web/assets/css/custom.css
@@ -55,7 +55,7 @@ style attribute {
 }
 .ant-table-tbody > tr > td,
 .ant-table-thead > tr > th {
-    padding: 12px 16px;
+    padding: 12px 8px;
     overflow-wrap: break-word;
 }
 .ant-table-thead > tr > th {
@@ -93,7 +93,6 @@ style attribute {
 .ant-table-body {
     overflow-x: auto !important;
 }
-
 .ant-card-hoverable {
     cursor: auto;
     cursor: pointer;
@@ -133,6 +132,13 @@ style attribute {
         margin: 0.5rem;
         padding: 0.5rem;
     }
+    .ant-modal-body {
+        padding: 10px;
+    }
+    .ant-form-item-label {
+        line-height: 1.5;
+        padding: 8px 0 0;
+    }
 }
 
 .ant-layout-content {
@@ -410,6 +416,10 @@ style attribute {
     background-color: white;
 }
 
+.ant-form-item {
+    margin-bottom: 0;
+}
+
 .ant-setting-textarea {
     margin-top: 1.5rem;
 }
@@ -802,12 +812,6 @@ style attribute {
     border-color: #fec093;
 }
 
-.ant-modal-confirm-confirm .ant-modal-confirm-body>.anticon, .ant-modal-confirm-warning .ant-modal-confirm-body>.anticon,
-.ant-alert-warning .ant-alert-icon,
-.has-warning.has-feedback .ant-form-item-children-icon {
-    color: #f37b24;
-}
-
 .dark .has-warning .ant-input,
 .dark .has-warning .ant-input:hover {
     border-color: #784e1d;
@@ -1045,53 +1049,3 @@ li.ant-select-dropdown-menu-item:empty:after {
 .ant-input-number {
     overflow: clip;
 }
-
-.tag-of-wrap {
-	text-wrap: pretty;
-	overflow-wrap: anywhere;
-	max-width: 200px;
-}
-
-.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;
-}
-
-.ant-calendar-year-panel-year:hover,
-.ant-calendar-decade-panel-decade:hover,
-.ant-calendar-month-panel-month:hover,
-.ant-dropdown-menu-item:hover,
-.ant-dropdown-menu-submenu-title:hover,
-.ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled),
-.ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled),
-.ant-table-tbody
-    > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(
-        .ant-table-row-selected
-    )
-    > td,
-.ant-table-tbody
-    > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
-    > td,
-.ant-table-thead
-    > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(
-        .ant-table-row-selected
-    )
-    > td,
-.ant-table-thead
-    > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
-    > td {
-    background-color: rgb(232 244 242);
-}
-
-.dark .ant-dropdown-menu-item:hover,
-.dark .ant-dropdown-menu-submenu-title:hover,
-.dark .ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled),
-.dark .ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled) {
-    background-color: #313f5a;
-}
diff --git a/web/assets/js/model/outbound.js b/web/assets/js/model/outbound.js
index 75d3b878..5aad52dd 100644
--- a/web/assets/js/model/outbound.js
+++ b/web/assets/js/model/outbound.js
@@ -476,7 +476,7 @@ class Outbound extends CommonClass {
         if(data.length !=2) return null;
         switch(data[0].toLowerCase()){
             case Protocols.VMess:
-                return this.fromVmessLink(JSON.parse(atob(data[1])));
+                return this.fromVmessLink(JSON.parse(Base64.decode(data[1])));
             case Protocols.VLESS:
             case Protocols.Trojan:
             case 'ss':
@@ -493,8 +493,8 @@ class Outbound extends CommonClass {
         if (network === 'tcp') {
             stream.tcp = new TcpStreamSettings(
                 json.type,
-                json.host ? json.host.split(','): [],
-                json.path ? json.path.split(','): []);
+                json.host ?? '',
+                json.path ?? '');
         } else if (network === 'kcp') {
             stream.kcp = new KcpStreamSettings();
             stream.type = json.type;
@@ -505,7 +505,7 @@ class Outbound extends CommonClass {
             stream.network = 'http'
             stream.http = new HttpStreamSettings(
                 json.path,
-                json.host ? json.host.split(',') : []);
+                json.host);
         } else if (network === 'quic') {
             stream.quic = new QuicStreamSettings(
                 json.host ? json.host : 'none',
@@ -570,7 +570,7 @@ class Outbound extends CommonClass {
             let sni=url.searchParams.get('sni') ?? '';
             let sid=url.searchParams.get('sid') ?? '';
             let spx=url.searchParams.get('spx') ?? '';
-            stream.tls = new RealityStreamSettings(pbk, fp, sni, sid, spx);
+            stream.reality  = new RealityStreamSettings(pbk, fp, sni, sid, spx);
         }
 
         let data = link.split('?');
diff --git a/web/assets/js/model/xray.js b/web/assets/js/model/xray.js
index 9478312e..e0c8a912 100644
--- a/web/assets/js/model/xray.js
+++ b/web/assets/js/model/xray.js
@@ -602,7 +602,7 @@ class XtlsStreamSettings extends XrayCommonClass {
                 alpn=[ALPN_OPTION.H2,ALPN_OPTION.HTTP1],
                 settings=new XtlsStreamSettings.Settings()) {
         super();
-        this.server = serverName;
+        this.sni = serverName;
         this.certs = certificates;
         this.alpn = alpn;
         this.settings = settings;
@@ -636,7 +636,7 @@ class XtlsStreamSettings extends XrayCommonClass {
 
     toJson() {
         return {
-            serverName: this.server,
+            serverName: this.sni,
             certificates: XtlsStreamSettings.toJsonArray(this.certs),
             alpn: this.alpn,
             settings: this.settings,
@@ -1081,7 +1081,7 @@ class Inbound extends XrayCommonClass {
 
     get serverName() {
         if (this.stream.isTls) return this.stream.tls.sni;
-        if (this.stream.isXtls) return this.stream.xtls.server;
+        if (this.stream.isXtls) return this.stream.xtls.sni;
         if (this.stream.isReality) return this.stream.reality.serverNames;
         return "";
     }
@@ -1326,8 +1326,8 @@ class Inbound extends XrayCommonClass {
             if(this.stream.xtls.settings.allowInsecure){
                 params.set("allowInsecure", "1");
             }
-            if (!ObjectUtil.isEmpty(this.stream.xtls.server)){
-                params.set("sni", this.stream.xtls.server);
+            if (!ObjectUtil.isEmpty(this.stream.xtls.sni)){
+                params.set("sni", this.stream.xtls.sni);
 			}
             params.set("flow", flow);
         }
@@ -1533,8 +1533,8 @@ class Inbound extends XrayCommonClass {
             if(this.stream.xtls.settings.allowInsecure){
                 params.set("allowInsecure", "1");
             }
-            if (this.stream.xtls.settings.serverName !== ''){
-                params.set("sni", this.stream.xtls.settings.serverName);
+            if (!ObjectUtil.isEmpty(this.stream.xtls.sni)){
+                params.set("sni", this.stream.xtls.sni);
 			}
             params.set("flow", flow);
         }