Resolve "Create styled widgets"

Closes #67 (closed)

lib/ui/screens/demo_page.dart

@@ -6,6 +6,7 @@ import 'package:random/config/theme.dart';
 import 'package:random/cubit/data_cubit.dart';
 import 'package:random/cubit/settings_cubit.dart';
 import 'package:random/ui/widgets/header_app.dart';
+import 'package:random/ui/widgets/styles_widget.dart';
 
 class DemoPage extends StatelessWidget {
   const DemoPage({super.key});
@@ -29,6 +30,30 @@ class DemoPage extends StatelessWidget {
           fakeApiCall(),
           const SizedBox(height: 20),
           const AppHeader(text: 'BOTTOM'),
+          const StyledWidget(
+            child: SizedBox.square(
+              dimension: 40,
+              child: Center(child: Text('default')),
+            ),
+          ),
+          const SizedBox(height: 8),
+          const StyledWidget(
+            borderRadius: 0,
+            borderWidth: 12,
+            // depth: 8,
+            lowerColor: Colors.red,
+            upperColor: Colors.yellow,
+            child: Center(child: Text('custom 1')),
+          ),
+          const SizedBox(height: 8),
+          const StyledWidget(
+            borderRadius: 10,
+            borderWidth: 20,
+            depth: 20,
+            lowerColor: Colors.blueGrey,
+            upperColor: Colors.blue,
+            child: Center(child: Text('custom 2')),
+          ),
         ],
       ),
     );