From 330c3a6d224ffefbe442742c5a019b42689565e4 Mon Sep 17 00:00:00 2001
From: Harsh Shandilya <me@msfjarvis.dev>
Date: Tue, 9 Mar 2021 10:32:34 +0530
Subject: [PATCH] LobstersItem: improve clickability of save icon

Signed-off-by: Harsh Shandilya <me@msfjarvis.dev>
---
 .../lobsters/ui/posts/LobstersItem.kt         | 34 +++++++++----------
 1 file changed, 17 insertions(+), 17 deletions(-)

diff --git a/app/src/main/java/dev/msfjarvis/lobsters/ui/posts/LobstersItem.kt b/app/src/main/java/dev/msfjarvis/lobsters/ui/posts/LobstersItem.kt
index 41f4d461..b54e28b9 100644
--- a/app/src/main/java/dev/msfjarvis/lobsters/ui/posts/LobstersItem.kt
+++ b/app/src/main/java/dev/msfjarvis/lobsters/ui/posts/LobstersItem.kt
@@ -7,20 +7,24 @@ import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.absoluteOffset
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.requiredSize
 import androidx.compose.foundation.layout.requiredWidth
-import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.sizeIn
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.IconToggleButton
+import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Surface
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
@@ -64,9 +68,10 @@ fun LobstersItem(
     Row(
       modifier = Modifier.padding(start = 12.dp, end = 12.dp),
       verticalAlignment = Alignment.CenterVertically,
+      horizontalArrangement = Arrangement.SpaceBetween,
     ) {
       Column(
-        modifier = Modifier.width(LocalConfiguration.current.screenWidthDp.dp.times(0.9f))
+        modifier = Modifier.fillMaxWidth(),
       ) {
         Text(
           text = post.title,
@@ -105,21 +110,16 @@ fun LobstersItem(
       IconToggleButton(
         checked = isSaved,
         onCheckedChange = { onSaveButtonClick.invoke() },
+        modifier = Modifier
+          .requiredSize(24.dp)
+          .absoluteOffset(x = (-24).dp),
       ) {
-        Crossfade(targetState = isSaved) {
-          if (it) {
-            IconResource(
-              resourceId = R.drawable.ic_favorite_24px,
-              tint = Color(0xFFD97373),
-              contentDescription = stringResource(R.string.remove_from_saved_posts),
-            )
-          } else {
-            IconResource(
-              resourceId = R.drawable.ic_favorite_border_24px,
-              tint = Color(0xFFD97373),
-              contentDescription = stringResource(R.string.add_to_saved_posts),
-            )
-          }
+        Crossfade(targetState = isSaved) { saved ->
+          IconResource(
+            resourceId = if (saved) R.drawable.ic_favorite_24px else R.drawable.ic_favorite_border_24px,
+            tint = MaterialTheme.colors.secondary,
+            contentDescription = stringResource(if (saved) R.string.remove_from_saved_posts else R.string.add_to_saved_posts),
+          )
         }
       }
     }