EnakShop: katalog toko online

- Beranda toko: pencarian, banner promo, grid kategori, produk promo, dan rekomendasi - Halaman kategori dengan urutan terlaris/terbaru/termurah/termahal - Detail produk: harga diskon, varian, info, deskripsi, produk serupa - Data contoh 14 produk dan 3 banner; keranjang menyusul - DetailSection dan NumberedStep jadi komponen bersama - Tinggi banner EnakPromo dan EnakShop ikut skala font sistem Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-01 02:47:47 +07:00
parent 5ba60747a8
commit e273785268
14 changed files with 1911 additions and 334 deletions
@@ -0,0 +1,74 @@
+import 'package:flutter/material.dart';
+
+import '../../../common/theme/theme.dart';
+
+/// Kotak putih berjudul untuk mengelompokkan isi halaman detail.
+class DetailSection extends StatelessWidget {
+  const DetailSection({super.key, this.title, required this.child});
+
+  final String? title;
+  final Widget child;
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      width: double.infinity,
+      padding: const EdgeInsets.all(16),
+      decoration: BoxDecoration(
+        color: AppColor.white,
+        borderRadius: BorderRadius.circular(16),
+      ),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          if (title != null) ...[
+            Text(
+              title!,
+              style: AppStyle.md.copyWith(fontWeight: FontWeight.w700),
+            ),
+            const SizedBox(height: 12),
+          ],
+          child,
+        ],
+      ),
+    );
+  }
+}
+
+/// Satu langkah bernomor, mis. untuk "Cara dapat" atau "Cara beli".
+class NumberedStep extends StatelessWidget {
+  const NumberedStep({super.key, required this.number, required this.text});
+
+  final int number;
+  final String text;
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.only(bottom: 10),
+      child: Row(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Container(
+            width: 22,
+            height: 22,
+            alignment: Alignment.center,
+            decoration: BoxDecoration(
+              color: AppColor.primary.withOpacity(0.1),
+              shape: BoxShape.circle,
+            ),
+            child: Text(
+              '$number',
+              style: AppStyle.xs.copyWith(
+                color: AppColor.primary,
+                fontWeight: FontWeight.w800,
+              ),
+            ),
+          ),
+          const SizedBox(width: 10),
+          Expanded(child: Text(text, style: AppStyle.md.copyWith(height: 1.4))),
+        ],
+      ),
+    );
+  }
+}