Commit a146eb3d by liangjianmin

style(mine): Add decorative gradient overlays to profile header

- Add overflow hidden property to contain pseudo-elements
- Add ::before pseudo-element with radial gradient circle overlay positioned at top-right
- Add ::after pseudo-element with radial gradient circle overlay positioned at bottom-left
- Enhance visual depth and modern aesthetic of profile header section
parent 6d3c7899
Showing with 23 additions and 0 deletions
......@@ -16,6 +16,29 @@
height: 148rpx;
background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);
border-radius: 0 0 32rpx 32rpx;
overflow: hidden;
&::before {
content: '';
position: absolute;
top: -50%;
right: -20%;
width: 200rpx;
height: 200rpx;
background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 70%);
border-radius: 50%;
}
&::after {
content: '';
position: absolute;
bottom: -30%;
left: -10%;
width: 160rpx;
height: 160rpx;
background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
border-radius: 50%;
}
}
.profile-card {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment