From eb7fda21be930279d46cef3a866a98d8eb9712f1 Mon Sep 17 00:00:00 2001
From: Hamidreza Ghavami <70919649+hamid-gh98@users.noreply.github.com>
Date: Mon, 15 May 2023 23:12:52 +0430
Subject: [PATCH] fix styles

---
 web/assets/css/custom.css       | 31 ++++++++++++++++++++++++++++++-
 web/assets/js/axios-init.js     |  4 ++--
 web/assets/js/util/common.js    | 22 +++++++++++-----------
 web/assets/js/util/date-util.js |  3 +--
 web/assets/js/util/utils.js     | 11 +++--------
 5 files changed, 47 insertions(+), 24 deletions(-)

diff --git a/web/assets/css/custom.css b/web/assets/css/custom.css
index 99461563..8a958009 100644
--- a/web/assets/css/custom.css
+++ b/web/assets/css/custom.css
@@ -1,5 +1,23 @@
-#app {
+html,
+body {
     height: 100vh;
+    width: 100vw;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+}
+
+#app {
+    height: 100%;
+    min-height: 100vh;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    margin: 0;
+    padding: 0;
+    overflow: auto;
 }
 
 .ant-space {
@@ -10,6 +28,12 @@
     display: none;
 }
 
+@media (max-width: 768px) {
+    .ant-layout-sider {
+        display: none;
+    }
+}
+
 .ant-card {
     border-radius: 30px;
 }
@@ -216,6 +240,7 @@
 .ant-card-dark .ant-input-group-addon {
     color: hsla(0,0%,100%,.65);
     background-color: #262f3d;
+    border: 1px solid rgb(0 150 112 / 0%);
 }
 
 .ant-card-dark .ant-list-item-meta-title,
@@ -253,6 +278,10 @@
     background-color: #1a212a; 
 }
 
+.ant-input-number {
+    min-width: 100px;
+}
+
 .ant-card-dark .ant-input,
 .ant-card-dark .ant-input-number,
 .ant-card-dark .ant-input-number-handler-wrap,
diff --git a/web/assets/js/axios-init.js b/web/assets/js/axios-init.js
index bd55c3cf..b864b714 100644
--- a/web/assets/js/axios-init.js
+++ b/web/assets/js/axios-init.js
@@ -2,7 +2,7 @@ axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded
 axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
 
 axios.interceptors.request.use(
-    config => {
+    (config) => {
         if (config.data instanceof FormData) {
             config.headers['Content-Type'] = 'multipart/form-data';
         } else {
@@ -12,5 +12,5 @@ axios.interceptors.request.use(
         }
         return config;
     },
-    error => Promise.reject(error)
+    (error) => Promise.reject(error),
 );
diff --git a/web/assets/js/util/common.js b/web/assets/js/util/common.js
index 34c3cf56..e4f6a95c 100644
--- a/web/assets/js/util/common.js
+++ b/web/assets/js/util/common.js
@@ -69,40 +69,40 @@ function debounce(fn, delay) {
 }
 
 function getCookie(cname) {
-    let name = cname + '=';
+    let name = cname + "=";
     let decodedCookie = decodeURIComponent(document.cookie);
-    let ca = decodedCookie.split(';');
+    let ca = decodedCookie.split(";");
     for (let i = 0; i < ca.length; i++) {
         let c = ca[i];
-        while (c.charAt(0) == ' ') {
+        while (c.charAt(0) == " ") {
             c = c.substring(1);
         }
         if (c.indexOf(name) == 0) {
             return c.substring(name.length, c.length);
         }
     }
-    return '';
+    return "";
 }
 
 function setCookie(cname, cvalue, exdays) {
     const d = new Date();
     d.setTime(d.getTime() + exdays * 24 * 60 * 60 * 1000);
-    let expires = 'expires=' + d.toUTCString();
-    document.cookie = cname + '=' + cvalue + ';' + expires + ';path=/';
+    let expires = "expires=" + d.toUTCString();
+    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
 }
 
 function usageColor(data, threshold, total) {
     switch (true) {
         case data === null:
-            return 'blue';
+            return "blue";
         case total <= 0:
-            return 'blue';
+            return "blue";
         case data < total - threshold:
-            return 'cyan';
+            return "cyan";
         case data < total:
-            return 'orange';
+            return "orange";
         default:
-            return 'red';
+            return "red";
     }
 }
 
diff --git a/web/assets/js/util/date-util.js b/web/assets/js/util/date-util.js
index e451df32..b330ccbd 100644
--- a/web/assets/js/util/date-util.js
+++ b/web/assets/js/util/date-util.js
@@ -128,7 +128,6 @@ Date.prototype.formatDateTime = function (split = ' ') {
 };
 
 class DateUtil {
-
     // String string to date object
     static parseDate(str) {
         return new Date(str.replace(/-/g, '/'));
@@ -144,4 +143,4 @@ class DateUtil {
         date.setMinTime();
         return date;
     }
-}
\ No newline at end of file
+}
diff --git a/web/assets/js/util/utils.js b/web/assets/js/util/utils.js
index 0ae5b21b..b56207ab 100644
--- a/web/assets/js/util/utils.js
+++ b/web/assets/js/util/utils.js
@@ -68,13 +68,11 @@ class HttpUtil {
 }
 
 class PromiseUtil {
-
     static async sleep(timeout) {
         await new Promise(resolve => {
             setTimeout(resolve, timeout)
         });
     }
-
 }
 
 const seq = [
@@ -90,7 +88,6 @@ const seq = [
 ];
 
 class RandomUtil {
-
     static randomIntRange(min, max) {
         return parseInt(Math.random() * (max - min) + min, 10);
     }
@@ -140,14 +137,14 @@ class RandomUtil {
     static randomText() {
         var chars = 'abcdefghijklmnopqrstuvwxyz1234567890';
         var string = '';
-        var len = 6 + Math.floor(Math.random() * 5)
-        for(var ii=0; ii<len; ii++){
+        var len = 6 + Math.floor(Math.random() * 5);
+        for (var ii = 0; ii < len; ii++) {
             string += chars[Math.floor(Math.random() * chars.length)];
         }
         return string;
     }
 
-    static randomShadowsocksPassword(){
+    static randomShadowsocksPassword() {
         let array = new Uint8Array(32);
         window.crypto.getRandomValues(array);
         return btoa(String.fromCharCode.apply(null, array));
@@ -155,7 +152,6 @@ class RandomUtil {
 }
 
 class ObjectUtil {
-
     static getPropIgnoreCase(obj, prop) {
         for (const name in obj) {
             if (!obj.hasOwnProperty(name)) {
@@ -303,5 +299,4 @@ class ObjectUtil {
         }
         return true;
     }
-
 }