feat: 优化页面布局和交互体验

- 使用sticky定位替代fixed定位,提升滚动体验
- 添加视频播放图标和图片展示功能
- 实现搜索框热门关键词轮播效果
- 优化编辑器链接插入功能
- 调整组件样式和布局细节
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-11-10 19:06:58 +08:00
parent b7feedb350
commit 5cdbeb249f
26 changed files with 517 additions and 373 deletions

View File

@@ -291,6 +291,32 @@ body {
margin-bottom: 15px;
display: block;
}
.picture {
overflow: auto;
.picture-videos {
position: relative;
.icon-play {
position: absolute;
left: calc(50% - 5px);
top: 50%;
transform: translate(-50%, -50%);
width: 40px;
}
}
.picture-item {
// width: 120px;
height: 100px;
border-radius: 10px;
display: block;
&:not(:last-child) {
margin-right: 10px;
}
}
}
}
&.item-offer {
@@ -679,7 +705,7 @@ body {
.picture {
overflow: auto;
.picture-item {
width: 120px;
// width: 120px;
height: 100px;
border-radius: 10px;
@@ -1725,6 +1751,8 @@ body {
.head-top {
margin-top: 20px;
margin-bottom: 30px;
position: relative;
z-index: 2;
.logo {
height: 52px;
@@ -1741,17 +1769,36 @@ body {
margin-right: 20px;
transition: all 0.3s;
position: relative;
overflow: hidden;
&.pitch {
border-color: #000;
}
.placeholder-box {
position: absolute;
top: 0;
left: 0;
width: calc(100% - 33px);
height: 100%;
z-index: 1;
.item {
height: 100%;
line-height: 40px;
padding: 0 15px;
color: #7f7f7f;
font-size: 14px;
}
}
.input {
border: none;
outline: none;
height: 100%;
background-color: transparent;
font-size: 14px;
z-index: 2;
}
.icon {