style: limit abstract background to exactly 3 large solid shapes
This commit is contained in:
1 parent
9baf3d5b15
commit
f9706eb740
1 file changed
+7
-35
@@ -2,7 +2,7 @@ import 'dart:math' as math;
|
||||
import 'package:flutter/material.dart';
|
||||
import '../../../core/constants/app_colors.dart';
|
||||
|
||||
/// A lightweight, static abstract background decorator featuring large, solid shapes (no outlines).
|
||||
/// A lightweight, static abstract background decorator featuring exactly 3 large, solid shapes (no outlines).
|
||||
/// Fully responsive across Mobile, Web, and Desktop platforms.
|
||||
class AbstractBackground extends StatelessWidget {
|
||||
final Widget child;
|
||||
@@ -45,7 +45,7 @@ class _AbstractShapesCanvas extends StatelessWidget {
|
||||
// Base background tint
|
||||
Container(color: AppColors.pageBackground),
|
||||
|
||||
// Shape 1: Top-Right Extra Large Solid Circle
|
||||
// Shape 1 (Top-Right): Large Solid Circle
|
||||
Positioned(
|
||||
top: -height * 0.12,
|
||||
right: -width * 0.10,
|
||||
@@ -59,7 +59,7 @@ class _AbstractShapesCanvas extends StatelessWidget {
|
||||
),
|
||||
),
|
||||
|
||||
// Shape 2: Top-Left Large Solid Tilted Block
|
||||
// Shape 2 (Top-Left): Large Solid Tilted Rect Block
|
||||
Positioned(
|
||||
top: height * 0.08,
|
||||
left: -width * 0.12,
|
||||
@@ -76,46 +76,18 @@ class _AbstractShapesCanvas extends StatelessWidget {
|
||||
),
|
||||
),
|
||||
|
||||
// Shape 3: Middle-Right Large Solid Circle
|
||||
Positioned(
|
||||
top: height * 0.35,
|
||||
right: -width * 0.08,
|
||||
child: Container(
|
||||
width: math.max(220, width * 0.38),
|
||||
height: math.max(220, width * 0.38),
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: AppColors.primaryGreen.withValues(alpha: 0.065),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Shape 4: Bottom-Left Extra Large Solid Blob
|
||||
Positioned(
|
||||
bottom: -height * 0.15,
|
||||
left: -width * 0.12,
|
||||
child: Container(
|
||||
width: math.max(340, width * 0.60),
|
||||
height: math.max(340, width * 0.60),
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: AppColors.primaryGreen.withValues(alpha: 0.07),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Shape 5: Bottom-Right Large Solid Tilted Pill Capsule
|
||||
// Shape 3 (Bottom-Right): Large Solid Tilted Pill Capsule
|
||||
Positioned(
|
||||
bottom: height * 0.05,
|
||||
right: -width * 0.06,
|
||||
child: Transform.rotate(
|
||||
angle: math.pi / 5,
|
||||
child: Container(
|
||||
width: math.max(280, width * 0.48),
|
||||
height: math.max(120, width * 0.20),
|
||||
width: math.max(280, width * 0.50),
|
||||
height: math.max(120, width * 0.22),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(60),
|
||||
color: AppColors.darkGreen.withValues(alpha: 0.06),
|
||||
color: AppColors.primaryGreen.withValues(alpha: 0.065),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
Reference in new issue
Block a user