置顶消息下拉框添加背景模糊、推荐服务器卡片修改、修复部分UI偏移、添加聊天界面背景模糊

- 置顶消息下拉框添加背景模糊
- 推荐服务器卡片修改
- 修复部分UI偏移
- 添加聊天界面背景模糊

Nameless.css

@@ -120,15 +120,103 @@ body{
     opacity: 0;
 }
 
-.guild-card-item:hover{ /* 让卡片上移的更明显 */
-    margin-top: -15px !important;
+.guild-card-item:hover{
+    margin-top: 0 !important;
+    transform: scale(1.1);
 }
 
-.guild-card-item{ /* 添加卡片上移动画 */
-    transition-property: margin;
+.guild-card-item:hover .back:after{
+    opacity: 1 !important;
+}
+
+.guild-card-item:hover .back-top{
+    filter: blur(10px);
+}
+
+.guild-card-item:hover .front-info .card-title{
+    background: none;
+    height: 24px !important;
+}
+
+.guild-card-item .front-info .card-title{
+    height: 38px !important;
+    margin: 0 -16px;
+    padding: 0 16px;
+    transition-property: height;
+    transition-duration: 0.2s;
+    transition-timing-function: ease-in-out;
+}
+
+.guild-card-item:hover .front-info .card-title:before{
+    opacity: 0;
+}
+
+.guild-card-item .front-info .card-title:before {
+    background: linear-gradient(0, rgba(0, 0, 0, 0.55), transparent);
+    content: "";
+    position: absolute;
+    top: 33px;
+    left: 0;
+    height: 38px;
+    width: 100%;
+    z-index: -1;
+}
+
+.guild-card-item .outer-tag{
+    bottom: 10px !important;
+}
+
+.guild-card-item:hover .front-info .card-desc{
+    transform: translate(0, 0);
+}
+
+.guild-card-item:hover .front-info{
+    transform: translate(0, 0);
+}
+
+.guild-card-item .back-top{
+    transition-property: filter;
     transition-duration: 0.1s;
     transition-timing-function: ease-in-out;
-    backdrop-filter: blur(1rem);
+}
+
+.guild-card-item .back:after{
+    opacity: 0;
+    content: "";
+    height: 100%;
+    width: 100%;
+    position: absolute;
+    left: 0;
+    top: 0;
+    background: var(--background-primary);
+    transition-property: opacity;
+    transition-duration: 0.1s;
+    transition-timing-function: ease-in-out;
+}
+
+.guild-card-item .front-info .card-desc{
+    transform: translate(0, 10px);
+    transition-property: transform;
+    transition-duration: 0.2s;
+    transition-timing-function: ease-in-out;
+}
+
+.guild-card-item .front-info{
+    transform: translate(0, 58.5%);
+    transition-property: transform;
+    transition-duration: 0.2s;
+    transition-timing-function: ease-in-out;
+}
+
+.guild-logo{
+    visibility: collapse;
+}
+
+.guild-card-item{
+    transition-property: transform;
+    transition-duration: 0.2s;
+    transition-timing-function: ease-in-out;
+    height: auto !important;
 }
 
 .discover-input-wrapper{ /* 给搜索框加个背景模糊 */
@@ -141,24 +229,33 @@ body{
 }
 
 /* -- 置顶消息 -- */
+.prompt-stick-messaage{
+    background: var(--background-primary) !important;
+    backdrop-filter: blur(1rem);
+}
+
+.prompt-stick-messaage .close-btn-box{
+    background: transparent !important;
+}
+
 .message-item{ /* 重设置顶消息背景 */
     background-color: var(--background-primary) !important;
-    backdrop-filter: blur(1rem) !important;
+    backdrop-filter: blur(1rem) ;
 }
 
 .theme-stick-message-box-bg{
     background-color: var(--background-primary) !important;
-    backdrop-filter: blur(1rem) !important;
+    backdrop-filter: blur(1rem);
 }
 
 /* -- 消息 -- */
 .message-context-menu{ /* 消息上下文菜单列表 e.g 举报 */
-    backdrop-filter: blur(1rem) !important;
+    backdrop-filter: blur(6px);
 }
 
 /* -- 设置界面 -- */
 .setting-mask{ /* 设置界面的背景模糊 */
-    backdrop-filter: blur(0.3rem) !important;
+    backdrop-filter: blur(0.3rem);
 }
 
 /* -- 提示气泡 ToolTip -- */
@@ -274,10 +371,6 @@ body{
     backdrop-filter: blur(1rem);
 }
 
-.message-context-menu-button{
-    backdrop-filter: blur(1rem);
-}
-
 .invite-message-box{
     backdrop-filter: blur(1rem);
 }
@@ -289,4 +382,21 @@ body{
 
 .user-search-box{
     backdrop-filter: blur(1rem);
-}
+}
+
+.pointerMenu, .contentMenu{
+    transform: translate(-350px, -42px);
+}
+
+.emoji-item-info{
+    transform: translate(-965px, -570px) !important;
+    backdrop-filter: blur(1rem);
+}
+
+.emoji-item-info .layer-arrow{
+    visibility: collapse;
+}
+
+/* .emoji-wrapper:hover>.text-message-box.__react_component_tooltip{
+    transform: translate(-352px, -33px);
+} */