align RemoveBackground page styling with Tools page

This commit is contained in:
jingrow 2025-11-19 06:11:45 +08:00
parent 77982b66ff
commit 6d861a2829

View File

@ -1,17 +1,7 @@
<template> <template>
<div class="remove-background-page"> <div class="remove-background-page">
<div class="page-header"> <div class="page-header">
<div class="header-content"> <h2>{{ t('Remove Background') }}</h2>
<div class="header-left">
<div class="page-icon">
<i class="fa fa-magic"></i>
</div>
<div>
<h1>{{ t('Remove Background') }}</h1>
<p class="page-description">{{ t('Remove background from images using AI technology') }}</p>
</div>
</div>
</div>
</div> </div>
<div class="page-content"> <div class="page-content">
@ -385,13 +375,24 @@ const handleDownload = () => {
<style scoped lang="scss"> <style scoped lang="scss">
.remove-background-page { .remove-background-page {
min-height: 100vh; width: 100%;
background: #f8fafc;
padding: 16px; padding: 16px;
min-height: 100vh;
} }
.page-header { .page-header {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 24px; margin-bottom: 24px;
padding: 0;
}
.page-header h2 {
font-size: 24px;
font-weight: 700;
color: #1f2937;
margin: 0;
} }
.header-content { .header-content {
@ -436,8 +437,7 @@ h1 {
} }
.page-content { .page-content {
max-width: 1400px; position: relative;
margin: 0 auto;
} }
.tool-container { .tool-container {