From f79eaf11858ea2215c0f7780fff597c4e0b0f631 Mon Sep 17 00:00:00 2001
From: RainyXeon / <minh15052008@gmail.com>
Date: Sat, 22 Jun 2024 22:06:31 +0700
Subject: [PATCH] improve: ReZygisk webui state

This commit will improve ReZygisk webui state by adding new red color and hide settings/modules card if it's error or not exist
---
 webroot/css/index.css | 18 ++++++++++++------
 webroot/index.html    |  9 +++++----
 webroot/js/main.js    |  8 ++++++--
 3 files changed, 23 insertions(+), 12 deletions(-)
diff --git a/webroot/css/index.css b/webroot/css/index.css
index a30ffc3..b6d7d2a 100644
--- a/webroot/css/index.css
+++ b/webroot/css/index.css
@@ -1,3 +1,9 @@
+:root {
+  --bright: #8d1d19;
+  --dim: #1d2327;
+  --error: #8d1d19;
+}
+
 * {
   background-color: #181c20;
   color: #fff;
@@ -44,18 +50,18 @@ a {
 }
 
 .bright {
-  border: 5px solid #3a4857;
-  background: #3a4857;
+  border: 5px solid var(--bright);
+  background: var(--bright);
 }
 .brightc {
-  background: #3a4857;
+  background: var(--bright);
 }
 
 .dim {
-  border: 5px solid #1d2327;
-  background: #1d2327;
+  border: 5px solid var(--dim);
+  background: var(--dim);
 }
 
 .dimc {
-  background: #1d2327;
+  background: var(--dim);
 }
\ No newline at end of file
diff --git a/webroot/index.html b/webroot/index.html
index 0501666..4b7e353 100644
--- a/webroot/index.html
+++ b/webroot/index.html
@@ -10,9 +10,10 @@
     <script src="js/main.js" type="module"></script>
   </head>
   <body>
+    <div class="error_mode"></div>
     <div class="header">ReZygisk</div>
-    <div name="ghost" style="padding: 40px 0px;"></div>
-    <div name="version" class="bright card">
+    <div style="padding: 40px 0px;"></div>
+    <div id="info_card" class="bright card">
       <div class="brightc content" style="display: flex; align-items: center;">
         <div id="rezygisk_icon_state" class="brightc">
           <img class="brightc" src="assets/mark.svg">
@@ -39,11 +40,11 @@
       </div>
     </div>
 
-    <div name="version" class="dim card" id="modules_list">
+    <div id="modules_list" class="dim card" style="display: none;">
       <!-- N/A -->
     </div>
 
-    <div name="version" class="dim card">
+    <div id="rezygisk_settings" class="dim card" style="display: none;">
       <div class="dimc content" style="font-size: 1.2em;">
         Settings
       </div>
diff --git a/webroot/js/main.js b/webroot/js/main.js
index 9648cc2..fd5881a 100644
--- a/webroot/js/main.js
+++ b/webroot/js/main.js
@@ -2,10 +2,13 @@ import { exec, toast, fullScreen } from './kernelsu.js';
 
 (async () => {
   fullScreen(true)
-
-  const rezygisk_icon_state = document.getElementById('rezygisk_icon_state')
+  const rootCss = document.querySelector(':root');
   const rezygisk_state = document.getElementById('rezygisk_state')
+  const rezygisk_settings = document.getElementById("rezygisk_settings")
+  const rezygisk_icon_state = document.getElementById('rezygisk_icon_state')
   /* TODO: Implement rezygisk state */
+  rezygisk_settings.removeAttribute("style")
+  rootCss.style.setProperty('--bright', '#3a4857');
   rezygisk_state.innerHTML = 'ReZygisk is functioning!'
   rezygisk_icon_state.innerHTML = '<img class="brightc" src="assets/tick.svg">'
 
@@ -44,6 +47,7 @@ import { exec, toast, fullScreen } from './kernelsu.js';
   const { errno: errnoModules, stdout: stdoutModules, stderr: stderrModules } = await exec('find /data/adb/modules -type d -name zygisk -exec dirname {} \\;')
 
   if (errnoModules === 0) {
+    modules_list.removeAttribute("style")
     const modules = stdoutModules.split('\n')
 
     modules_list.innerHTML += 
