Update design of dangerous buttons (#1758)

In the before, the group buttons look way too similar:

| Before | After |
|--------|--------|
|
![image](https://github.com/user-attachments/assets/f93b9b44-4d85-4e8f-8274-15e643b7c0f2)
|
![image](https://github.com/user-attachments/assets/28e98de2-3866-457b-be09-0308e4bc5e8d)
|

`my_profile_page`:

| Before | After |
|--------|--------|
|
![image](https://github.com/user-attachments/assets/141b9b43-17bd-40c0-93b6-b66a9ba4b8c9)
|
![image](https://github.com/user-attachments/assets/b840fc13-fa85-428a-80b5-43e7f4b62541)
|

app/lib/groups/src/widgets/danger_section.dart

@@ -57,16 +57,17 @@ class _LeaveButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return _DangerButton(
+    return DangerButtonOutlined(
       onPressed: onPressed,
       label: label,
       icon: const Icon(Icons.exit_to_app),
     );
   }
 }
 
-class _DangerButton extends StatelessWidget {
-  const _DangerButton({
+class DangerButtonOutlined extends StatelessWidget {
+  const DangerButtonOutlined({
+    super.key,
     this.onPressed,
     required this.label,
     required this.icon,
@@ -85,7 +86,44 @@ class _DangerButton extends StatelessWidget {
         style: FilledButton.styleFrom(
           shadowColor: Colors.transparent,
           foregroundColor: Colors.red,
-          backgroundColor: Colors.red.withOpacity(0.2),
+          backgroundColor: Colors.transparent,
+          shape: RoundedRectangleBorder(
+            side: BorderSide(
+              color: Colors.red.withOpacity(0.5),
+              width: 2,
+            ),
+            borderRadius: BorderRadius.circular(512),
+          ),
+        ),
+        onPressed: onPressed,
+        label: label,
+      ),
+    );
+  }
+}
+
+class DangerButtonFilled extends StatelessWidget {
+  const DangerButtonFilled({
+    super.key,
+    this.onPressed,
+    required this.label,
+    required this.icon,
+  });
+
+  final VoidCallback? onPressed;
+  final Widget label;
+  final Widget icon;
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.only(bottom: 12),
+      child: FilledButton.icon(
+        icon: icon,
+        style: FilledButton.styleFrom(
+          shadowColor: Colors.transparent,
+          foregroundColor: Colors.white,
+          backgroundColor: Colors.red,
         ),
         onPressed: onPressed,
         label: label,
@@ -105,7 +143,7 @@ class _DeleteSchoolClassButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return _DangerButton(
+    return DangerButtonFilled(
       icon: const Icon(Icons.delete),
       onPressed: onPressed,
       label: label,

app/lib/settings/src/subpages/my_profile/my_profile_page.dart

@@ -22,6 +22,7 @@ import 'package:sharezone/account/account_page.dart';
 import 'package:sharezone/account/change_data_bloc.dart';
 import 'package:sharezone/account/profile/user_edit/user_edit_page.dart';
 import 'package:sharezone/activation_code/activation_code_page.dart';
+import 'package:sharezone/groups/src/widgets/danger_section.dart';
 import 'package:sharezone/main/application_bloc.dart';
 import 'package:sharezone/navigation/drawer/sign_out_dialogs/sign_out_dialogs.dart';
 import 'package:sharezone/navigation/drawer/sign_out_dialogs/src/sign_out_and_delete_anonymous_user.dart';
@@ -70,9 +71,8 @@ class MyProfilePage extends StatelessWidget {
                       _UserId(user.id),
                       _EnterActivationTile(),
                       _PrivacyOptOut(),
-                      const Divider(),
+                      const Divider(height: 32),
                       SignOutButton(isAnonymous: user.isAnonymous),
-                      const SizedBox(height: 8),
                       _DeleteAccountButton(),
                     ],
                   );
@@ -325,14 +325,9 @@ class SignOutButton extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Center(
-      child: ElevatedButton.icon(
+      child: DangerButtonOutlined(
         key: const ValueKey('sign-out-button-E2E'),
         icon: const Icon(Icons.exit_to_app),
-        style: ElevatedButton.styleFrom(
-          shadowColor: Colors.transparent,
-          backgroundColor: Colors.red.withOpacity(0.2),
-          foregroundColor: Colors.red,
-        ),
         onPressed: () => signOut(context, isAnonymous),
         label: Text("Abmelden".toUpperCase()),
       ),
@@ -345,10 +340,10 @@ class _DeleteAccountButton extends StatelessWidget {
   Widget build(BuildContext context) {
     return Padding(
       padding: const EdgeInsets.only(bottom: 12),
-      child: _DangerButton(
+      child: DangerButtonFilled(
         icon: const Icon(Icons.delete),
-        title: "Konto löschen",
-        onTap: () => showDialog(
+        label: Text("Konto löschen".toUpperCase()),
+        onPressed: () => showDialog(
           context: context,
           builder: (context) => _DeleteAccountDialogContent(),
         ),
@@ -357,33 +352,6 @@ class _DeleteAccountButton extends StatelessWidget {
   }
 }
 
-class _DangerButton extends StatelessWidget {
-  const _DangerButton({this.onTap, this.title, this.icon});
-
-  final VoidCallback? onTap;
-  final String? title;
-  final Icon? icon;
-
-  @override
-  Widget build(BuildContext context) {
-    return Padding(
-      padding: const EdgeInsets.fromLTRB(12, 0, 12, 0),
-      child: ButtonTheme(
-        minWidth: getScreenSize(context).width,
-        child: ElevatedButton.icon(
-          icon: icon!,
-          label: Text(title!.toUpperCase()),
-          style: ElevatedButton.styleFrom(
-            foregroundColor: Colors.white,
-            backgroundColor: Colors.redAccent,
-          ),
-          onPressed: onTap,
-        ),
-      ),
-    );
-  }
-}
-
 class _DeleteAccountDialogContent extends StatefulWidget {
   @override
   _DeleteAccountDialogContentState createState() =>