rating options

lib/main.dart

@@ -31,7 +31,7 @@ class MyApp extends StatelessWidget {
                 surface: Colors.white,
                 onSurface: Color.fromRGBO(60, 60, 60, 1),
                 brightness: Brightness.light,
-                tertiary: Color.fromRGBO(251, 216, 17, 0),
+                tertiary: Color.fromRGBO(251, 216, 17, 1),
                 onTertiary: Color.fromRGBO(60, 60, 60, 1)),
             useMaterial3: true,
           ),

lib/modules/ratingEmote.dart

@@ -0,0 +1,39 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_rating_bar/flutter_rating_bar.dart';
+
+class RatingEmote extends StatelessWidget {
+  const RatingEmote({super.key, required this.onRate});
+
+  final Function onRate;
+
+  @override
+  Widget build(BuildContext context) {
+    return RatingBar.builder(
+      initialRating: 0,
+      itemCount: 3,
+      itemSize: 80,
+      itemBuilder: (context, index) {
+        switch (index) {
+          case 0:
+            return const Icon(
+              Icons.sentiment_very_dissatisfied,
+              color: Color.fromRGBO(236, 91, 91, 1.0),
+            );
+          case 1:
+            return const Icon(
+              Icons.sentiment_neutral,
+              color: Color.fromRGBO(236, 173, 91, 1.0),
+            );
+          case 2:
+            return const Icon(
+              Icons.sentiment_very_satisfied,
+              color: Color.fromRGBO(95, 175, 72, 1.0),
+            );
+        }
+        return const Icon(Icons.error);
+      },
+
+      onRatingUpdate: (rating) {},
+    );
+  }
+}

lib/modules/ratingStars.dart

@@ -0,0 +1,30 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_rating_bar/flutter_rating_bar.dart';
+
+class RatingStars extends StatelessWidget {
+  const RatingStars({super.key, required this.onRate});
+
+  final Function onRate;
+
+  @override
+  Widget build(BuildContext context) {
+    return RatingBar.builder(
+      initialRating: 0,
+      minRating: 1,
+      itemSize: 80,
+      direction: Axis.horizontal,
+      allowHalfRating: false,
+      itemCount: 5,
+      itemPadding: const EdgeInsets.symmetric(horizontal: 4),
+      itemBuilder: (context, index) {
+        return Icon(
+          Icons.star_rounded,
+          color: Theme.of(context).colorScheme.tertiary,
+        );
+      },
+      onRatingUpdate: (rating) {
+        onRate();
+      },
+    );
+  }
+}

lib/pages/pageEssen.dart

@@ -1,10 +1,19 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_rating_bar/flutter_rating_bar.dart';
+import 'package:mensaapp/modules/ratingEmote.dart';
+import 'package:mensaapp/modules/ratingStars.dart';
 
 class PageEssen extends StatelessWidget {
   const PageEssen({super.key});
 
   @override
   Widget build(BuildContext context) {
-    return const Placeholder();
+    return Center(
+      child: Column(
+        children: [
+          RatingStars(onRate: () {})
+        ],
+      ),
+    );
   }
 }