diff --git a/resources/html/help/help.css b/resources/html/help/help.css
index 733d297..6f3c1d5 100644
--- a/resources/html/help/help.css
+++ b/resources/html/help/help.css
@@ -68,21 +68,26 @@ body {
border-radius: 15px;
margin-top: 20px;
margin-bottom: 15px;
- padding: 20px 0px 5px 0px;
- background: transparent;
- box-shadow: 0 0 1px 0 #ccc, 2px 2px 4px 0 rgba(50, 50, 50, 0.8);
+ padding: 20px 10px 5px 10px;
+ background: rgba(255, 255, 255, 0.05);
+ backdrop-filter: blur(5px);
+ -webkit-backdrop-filter: blur(5px);
+ box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
+ border: 1px solid rgba(255, 255, 255, 0.18);
position: relative;
}
.tab_lable {
position: absolute;
- top: -10px;
+ top: -12px;
left: -8px;
- background-color: rgb(76, 76, 76);
- box-shadow: 0 0 1px 0 #ccc, 2px 2px 4px 0 rgba(50, 50, 50, 0.8);
+ background-color: rgba(76, 76, 76, 0.8);
+ backdrop-filter: blur(5px);
+ -webkit-backdrop-filter: blur(5px);
+ box-shadow: 0 4px 16px 0 rgba(31, 38, 135, 0.37);
color: #fff;
font-size: 14px;
- padding: 3px 10px;
+ padding: 5px 12px;
border-radius: 15px 0px 15px 15px;
z-index: 20;
}
@@ -115,23 +120,32 @@ body {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
+ margin: -5px;
}
.list .item {
- width: 235px;
+ width: calc(50% - 10px);
display: flex;
align-items: center;
color: white;
- background: transparent;
- box-shadow: 0 0 1px 0 #ccc, 2px 2px 4px 0 rgba(50, 50, 50, 0.8);
- padding: 8px 6px 8px 6px;
- border-radius: 8px;
- margin: 0 0px 10px 10px;
+ background: rgba(255, 255, 255, 0.1);
+ backdrop-filter: blur(10px);
+ -webkit-backdrop-filter: blur(10px);
+ box-shadow: 0 4px 16px 0 rgba(31, 38, 135, 0.2);
+ padding: 10px;
+ border-radius: 10px;
+ margin: 5px;
+ transition: all 0.3s ease;
+}
+
+.list .item:hover {
+ transform: translateY(-2px);
+ box-shadow: 0 6px 20px 0 rgba(31, 38, 135, 0.3);
}
.list .item .icon {
- width: 24px;
- height: 24px;
+ width: 28px;
+ height: 28px;
background-repeat: no-repeat;
background-size: 100% 100%;
position: relative;
@@ -140,17 +154,15 @@ body {
.list .item .title {
font-size: 16px;
- margin-left: 6px;
+ margin-left: 10px;
line-height: 20px;
+ flex-grow: 1;
}
-/* .list .item .title .text{
- white-space: nowrap;
-} */
.list .item .title .dec {
font-size: 12px;
- color: #999;
- margin-top: 2px;
+ color: rgba(255, 255, 255, 0.7);
+ margin-top: 4px;
}
.logo {