二列卡片视图布局调整

src/css/app.css

@@ -1,31 +1,4 @@
 /* app global css */
-@font-face {
-  font-family: "iconfont";
-  src: url("../fonts/iconfont.woff2?t=1649900426635") format("woff2"),
-    url("../fonts/iconfont.woff?t=1649900426635") format("woff"),
-    url("../fonts/iconfont.ttf?t=1649900426635") format("truetype");
-}
-
-.iconfont {
-  font-family: "iconfont" !important;
-  font-size: 16px;
-  font-style: normal;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-.icon-linux:before {
-  content: "\e6c1";
-}
-
-.icon-macos1:before {
-  content: "\e6b2";
-}
-
-.icon-windows1:before {
-  content: "\e6bb";
-}
-
 :root {
   --q-dark: #464646;
   --q-dark-page: #303133;
@@ -221,3 +194,53 @@ body.body--dark.glass-effect-menu .q-menu {
 .body--dark .q-menu .q-field__control {
   background: rgba(0, 0, 0, 0.3) !important;
 }
+
+/* 添加图标光晕效果 */
+.featureIco {
+  transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
+  will-change: transform;
+  position: relative;
+  z-index: 1;
+}
+
+.featureIcoHover {
+  transform: scale(1.08) translateY(-2px);
+}
+
+.featureIco::after {
+  content: "";
+  position: absolute;
+  z-index: -1;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
+  opacity: 0;
+  background-image: var(--icon-url);
+  background-size: contain;
+  background-position: center;
+  background-repeat: no-repeat;
+  filter: blur(8px) brightness(1.1);
+  transform: scale(1.05);
+  pointer-events: none;
+}
+
+.featureIcoHover::after {
+  opacity: 0.8;
+  transform: scale(1.1);
+}
+
+.feature-disabled,
+.platform-icons-disabled {
+  opacity: 0.5;
+  filter: grayscale(100%);
+}
+
+.platform-icons {
+  display: flex;
+  gap: 2px;
+  align-items: center;
+  justify-content: flex-end;
+  font-size: 12px;
+}