fix: 修复样式问题

This commit is contained in:
imeepos 2025-09-04 22:38:24 +08:00
parent a11932e2bd
commit 870991d81d
3 changed files with 42 additions and 15 deletions

View File

@ -46,28 +46,42 @@
} }
.generate-success { .generate-success {
text-align: center; position: relative;
padding: 60rpx; width: 100%;
height: 100vh;
display: flex;
flex-direction: column;
} }
.result-container { .result-container {
margin-bottom: 60rpx; flex: 1;
position: relative;
width: 100%;
height: 100%;
} }
.success-text { .success-text {
position: absolute;
top: 60rpx;
left: 50%;
transform: translateX(-50%);
font-size: 40rpx; font-size: 40rpx;
color: #34c759; color: white;
font-weight: 600; font-weight: 600;
margin-bottom: 40rpx; z-index: 10;
background: rgba(0, 0, 0, 0.5);
padding: 20rpx 40rpx;
border-radius: 25rpx;
}
.result-media {
width: 100%;
height: 100%;
} }
.result-image { .result-image {
width: 500rpx; width: 100%;
height: 500rpx; height: 100%;
margin: 0 auto;
border-radius: 12rpx;
overflow: hidden;
box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.1);
} }
.result-image image { .result-image image {
@ -75,6 +89,11 @@
height: 100%; height: 100%;
} }
.result-video {
width: 100%;
height: 100%;
}
.generate-error { .generate-error {
text-align: center; text-align: center;
padding: 60rpx; padding: 60rpx;
@ -106,6 +125,16 @@
margin-top: 60rpx; margin-top: 60rpx;
} }
.generate-success .action-buttons {
position: absolute;
bottom: 80rpx;
left: 50%;
transform: translateX(-50%);
z-index: 10;
padding: 0 40rpx;
box-sizing: border-box;
}
.btn-primary { .btn-primary {
flex: 1; flex: 1;
background-color: #FFD67A; background-color: #FFD67A;

View File

@ -123,7 +123,6 @@
align-items: center; align-items: center;
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08); box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
border: 1rpx solid #f0f0f0; border: 1rpx solid #f0f0f0;
transition: all 0.3s ease;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
} }

View File

@ -129,18 +129,17 @@ export default function History() {
<Text className='empty-desc'>{'\n'}</Text> <Text className='empty-desc'>{'\n'}</Text>
</View> </View>
) : ( ) : (
records.map((record, index) => ( records.map((record) => (
<View <View
key={record.id} key={record.id}
className='history-item' className='history-item'
onClick={() => handleItemClick(record)} onClick={() => handleItemClick(record)}
style={{ animationDelay: `${index * 0.1}s` }}
> >
<View className='item-thumbnail'> <View className='item-thumbnail'>
{record.status === 'completed' && record.outputResult ? ( {record.status === 'completed' && record.outputResult ? (
<Image <Image
className='thumbnail-image' className='thumbnail-image'
src={Array.isArray(record.outputResult) ? record.outputResult[0] : record.outputResult} src={record.outputUrl || record.inputImageUrl}
mode='aspectFill' mode='aspectFill'
/> />
) : ( ) : (