diff --git a/module/webroot/index.html b/module/webroot/index.html
index 7290a72..aa4128f 100644
--- a/module/webroot/index.html
+++ b/module/webroot/index.html
@@ -23,7 +23,12 @@
-
+
+
+
Control Panel
Update
@@ -33,7 +38,7 @@
-
+
Action Redirect
-
Custom Rules
diff --git a/module/webroot/styles.css b/module/webroot/styles.css
index c6c15b8..a9ef052 100644
--- a/module/webroot/styles.css
+++ b/module/webroot/styles.css
@@ -108,66 +108,46 @@ body.input-focused {
font-size: 14px;
}
-.controlPanel {
- position: relative;
- width: calc(85vw + 30px);
- max-width: 830px;
- background-color: transparent;
- padding: 0;
- margin: 0;
- padding-top: 5px;
- border: none;
- display: flex;
- flex-wrap: wrap;
- justify-content: flex-start;
-}
-
.action-redirect-container {
display: none;
align-items: center;
- margin-top: 5px;
- margin-right: auto;
+ margin-bottom: 5px;
background-color: #fff;
padding: 2px 10px;
border-radius: 10px;
- box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
+ border: 1px solid #ccc;
height: 38px;
white-space: nowrap;
text-align: left;
- flex-shrink: 0;
}
.toggle-container {
display: flex;
align-items: center;
- margin-top: 5px;
- margin-right: 7px;
+ margin-bottom: 5px;
background-color: #fff;
padding: 2px 10px;
border-radius: 10px;
- box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
+ border: 1px solid #ccc;
height: 38px;
white-space: nowrap;
text-align: left;
- flex-shrink: 0;
}
#action-redirect-text {
font-size: 16px;
font-weight: bold;
- padding-right: 7px;
- padding-left: 6px;
+ padding-left: 13px;
}
#action-icon {
- font-size: 17px;
+ font-size: 20px;
}
#update-text {
font-size: 16px;
font-weight: bold;
- padding-right: 7px;
- padding-left: 5px;
+ padding-left: 10px;
}
#update-icon {
@@ -178,6 +158,7 @@ body.input-focused {
.toggle-switch {
position: relative;
display: inline-block;
+ margin-left: auto;
width: 40px;
height: 25px;
}
@@ -423,7 +404,6 @@ label {
color: white;
font-size: 15px;
padding: 5px 15px;
- z-index: 1000;
transform: translateY(100%);
transition: transform 0.5s ease, background-color 0.2s ease;
white-space: nowrap;
@@ -507,8 +487,6 @@ label {
color: #eee
}
- .action-redirect-container,
- .toggle-container,
.box {
background-color: #343434;
}
@@ -524,6 +502,12 @@ label {
border: 1px solid #6E6E6E;
}
+ .action-redirect-container,
+ .toggle-container {
+ background-color: #343434;
+ border: 1px solid #6E6E6E;
+ }
+
.controlPanel {
background-color: none;
}