完善前端UI

core/frontend/src/models-page.css

@@ -105,8 +105,8 @@
 
 .models-page .ml-grid {
   display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-  gap: 18px;
+  grid-template-columns: repeat(5, minmax(0, 1fr));
+  gap: 14px;
 }
 .models-page .ml-card {
   position: relative;
@@ -142,7 +142,7 @@
   border: 0;
   border-radius: 0;
 }
-.models-page .ml-meta { padding: 15px 16px 17px; }
+.models-page .ml-meta { padding: 12px 13px 14px; }
 .models-page .ml-meta h3 {
   margin: 0 0 6px;
   font-size: 15px;
@@ -152,21 +152,6 @@
   white-space: nowrap;
 }
 .models-page .ml-meta p { margin: 0; color: var(--ml-muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.models-page .ml-triview {
-  width: 100%;
-  aspect-ratio: 16 / 9;
-  margin-top: 10px;
-  overflow: hidden;
-  border-radius: 8px;
-  background: rgba(34, 42, 54, 0.06);
-}
-.models-page .ml-triview.has-mock-media {
-  background-image: var(--mock-media-url);
-  background-size: cover;
-  background-position: center;
-  border: 0;
-}
-.models-page .ml-triview .ph-frame { font-size: 11px; }
 .models-page .ml-line {
   display: flex;
   align-items: center;
@@ -232,7 +217,7 @@
 
 .models-page .ml-sel-bar {
   position: fixed;
-  left: calc(164px + (100vw - 164px) / 2);
+  left: calc(var(--sidebar-width) + (100vw - var(--sidebar-width)) / 2);
   bottom: 26px;
   z-index: 100;
   min-width: 410px;
@@ -269,6 +254,9 @@
 .models-page .ml-sel-confirm { color: #fff; background: #002fa7; }
 .models-page .ml-sel-confirm:disabled { opacity: 0.4; cursor: not-allowed; }
 
+@media (max-width: 1280px) {
+  .models-page .ml-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
+}
 @media (max-width: 1100px) {
   .models-page .ml-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
   .models-page .ml-sel-bar { left: 50%; }