perf: 样式调整

This commit is contained in:
rd
2025-08-15 17:15:36 +08:00
parent b655600d53
commit e5c823145d
4 changed files with 125 additions and 119 deletions

View File

@ -9,6 +9,7 @@
html, html,
body { body {
height: 100%;
background: $color-background; background: $color-background;
font-family: $font-family-regular; font-family: $font-family-regular;
font-size: 14px; font-size: 14px;

View File

@ -281,7 +281,7 @@ export default {
}; };
return () => ( return () => (
<section class="py-16px fixed z-3 right-16px w-440px h-full overflow-hidden"> <section class="ai-suggest-wrap py-16px fixed z-3 right-16px w-440px h-full overflow-hidden">
<div class="ai-suggest-box relative py-24px flex flex-col"> <div class="ai-suggest-box relative py-24px flex flex-col">
{!isEmpty(aiReview.value) && ( {!isEmpty(aiReview.value) && (
<div class="relative w-fit ml-24px mb-16px"> <div class="relative w-fit ml-24px mb-16px">

View File

@ -1,5 +1,7 @@
.ai-suggest-wrap {
.ai-suggest-box { top: $navbar-height;
height: calc(100% - ($navbar-height + 12px));
.ai-suggest-box {
width: 440px; width: 440px;
height: fit-content; height: fit-content;
max-height: 100%; max-height: 100%;
@ -115,4 +117,5 @@
background: transparent; background: transparent;
} }
} }
}
} }

View File

@ -1,13 +1,27 @@
.explore-page { .explore-page {
position: relative; position: relative;
padding-top: $navbar-height; // padding-top: $navbar-height;
min-width: 1200px; min-width: 1200px;
height: 100vh; height: 100vh;
background: #fff; background: #fff;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.page-header { .fold-box {
width: 40px;
height: 40px;
border-radius: 30px;
border: 1px solid var(--Border-1, #d7d7d9);
background: #fff;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
position: fixed; position: fixed;
right: 16px;
top: calc($navbar-height + 32px);
display: flex;
justify-content: center;
align-items: center;
}
.page-header {
position: sticky;
left: 0; left: 0;
right: 0; right: 0;
top: 0; top: 0;
@ -31,6 +45,7 @@
} }
.page-wrap { .page-wrap {
width: calc(100% - 456px);
flex: 1; flex: 1;
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -47,20 +62,7 @@
line-height: 40px; /* 142.857% */ line-height: 40px; /* 142.857% */
} }
} }
.fold-box {
width: 40px;
height: 40px;
border-radius: 30px;
border: 1px solid var(--Border-1, #d7d7d9);
background: #fff;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
position: absolute;
right: 16px;
top: 32px;
display: flex;
justify-content: center;
align-items: center;
}
.main-video-box { .main-video-box {
width: 320px; width: 320px;
height: 472px; height: 472px;