improvement: action button style

lib/screens/repository.dart

@@ -164,6 +164,8 @@ class RepositoryScreen extends StatelessWidget {
                 Row(
                   children: <Widget>[
                     MutationButton(
+                      active: repo.viewerSubscription ==
+                          GhRepoSubscriptionState.SUBSCRIBED,
                       text: _buildWatchState(repo.viewerSubscription),
                       onPressed: () async {
                         final vs = GhWatchSubscriptionState.values.where((v) =>
@@ -207,6 +209,7 @@ class RepositoryScreen extends StatelessWidget {
                     ),
                     SizedBox(width: 8),
                     MutationButton(
+                      active: repo.viewerHasStarred,
                       text: repo.viewerHasStarred ? 'Unstar' : 'Star',
                       onPressed: () async {
                         final res = await auth.gqlClient.execute(

lib/screens/user.dart

@@ -74,6 +74,7 @@ class UserScreen extends StatelessWidget {
           bio: p.bio,
           followWidget: p.viewerCanFollow == true
               ? MutationButton(
+                  active: p.viewerIsFollowing,
                   text: p.viewerIsFollowing ? 'Unfollow' : 'Follow',
                   onPressed: () async {
                     final res = await auth.gqlClient.execute(

lib/widgets/mutation_button.dart

@@ -1,12 +1,15 @@
 import 'package:flutter/cupertino.dart';
 import 'package:git_touch/models/theme.dart';
+import 'package:git_touch/widgets/link.dart';
 import 'package:provider/provider.dart';
 
 class MutationButton extends StatelessWidget {
+  final bool active;
   final String text;
   final VoidCallback onPressed;
 
   MutationButton({
+    @required this.active,
     @required this.text,
     @required this.onPressed,
   });
@@ -14,20 +17,24 @@ class MutationButton extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final theme = Provider.of<ThemeModel>(context);
-    return CupertinoButton(
-      onPressed: onPressed,
-      minSize: 0,
-      color: theme.palette.primary,
+    final textColor = active ? theme.palette.background : theme.palette.primary;
+    final backgroundColor =
+        active ? theme.palette.primary : theme.palette.background;
+    return Link(
+      onTap: onPressed,
+      child: Container(
         padding: EdgeInsets.symmetric(
           horizontal: 12,
           vertical: 4,
         ),
+        decoration: BoxDecoration(
+          color: backgroundColor,
           borderRadius: BorderRadius.all(Radius.circular(20)),
+          border: Border.all(color: theme.palette.primary),
+        ),
         child: Text(
           text,
-        style: TextStyle(
-          fontSize: 17,
-          color: theme.palette.background,
+          style: TextStyle(fontSize: 17, color: textColor),
         ),
       ),
     );