style: change card ui

Author: DaveDeveloper117

.idea/deploymentTargetDropDown.xml

@@ -5,5 +5,7 @@ data class GameModel(
     val title: String,
     val thumbnail: String,
     val short_description: String,
-    val game_url: String
+    val game_url: String,
+    val genre: String,
+    val platform: String
 )

.idea/misc.xml

@@ -8,8 +8,10 @@ data class GameItem(
     val title: String,
     val thumbnail: String,
     val short_description: String,
-    val game_url: String
+    val game_url: String,
+    val genre: String,
+    val platform: String
 
 )
 
-fun GameModel.toGameItem() = GameItem(id, title, thumbnail, short_description, game_url)
+fun GameModel.toGameItem() = GameItem(id, title, thumbnail, short_description, game_url, genre, platform)

app/src/main/java/com/davedevab/composetutorial/data/remote/model/GameModel.kt

@@ -6,14 +6,18 @@ import androidx.activity.compose.rememberLauncherForActivityResult
 import androidx.activity.result.contract.ActivityResultContracts
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.shape.CornerSize
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.AssistChip
 import androidx.compose.material3.Button
 import androidx.compose.material3.Card
 import androidx.compose.material3.Text
@@ -23,11 +27,13 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
 import androidx.lifecycle.viewmodel.compose.viewModel
 import coil.compose.rememberAsyncImagePainter
 import com.davedevab.composetutorial.domain.item.GameItem
@@ -57,7 +63,7 @@ fun GameCard(game: GameItem){
     Card(
         shape =  RoundedCornerShape(16.dp),
         modifier = Modifier
-            .padding(10.dp)
+            .padding(16.dp)
             .fillMaxSize()
     ) {
         Column {
@@ -69,27 +75,50 @@ fun GameCard(game: GameItem){
                     .fillMaxWidth()
                     .height(250.dp)
             )
-            Column(modifier = Modifier.padding(8.dp)) {
-                Text(text = game.title, fontWeight = FontWeight.Bold)
+            Column(modifier = Modifier.padding(8.dp),
+                horizontalAlignment = Alignment.CenterHorizontally) {
+                Text(text = game.title, fontWeight = FontWeight.Bold, fontSize = 22.sp, modifier = Modifier.padding(bottom = 8.dp))
                 Text(
                     text = game.short_description,
                     maxLines = if (isExpanded) Int.MAX_VALUE else 2,
                     overflow = TextOverflow.Ellipsis,
+                    fontSize = 16.sp,
                     modifier = Modifier
                         .clickable {
                             isExpanded = !isExpanded
                         }
                 )
+                Row(
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .padding(4.dp),
+                    horizontalArrangement = Arrangement.Center
+                ) {
+                    AssistChip(
+                        modifier = Modifier.padding(end = 8.dp),
+                        onClick = { /* Do something! */ },
+                        label = { Text(game.genre) },
+                        shape = RoundedCornerShape(12.dp)
+                        )
+                    AssistChip(
+                        modifier = Modifier.padding(end = 8.dp),
+                        onClick = { /* Do something! */ },
+                        label = { Text(game.platform) },
+                        shape = RoundedCornerShape(12.dp)
+
+                    )
+                }
                 Button(
                     onClick = {
                         // Acción para el primer botón
                         val url = game.game_url // Supongamos que el modelo proporciona la URL
                         val intent = Intent(Intent.ACTION_VIEW, Uri.parse(url))
                         openUrl.launch(intent)
                     },
-                    modifier = Modifier.padding(6.dp)
+                    modifier = Modifier
+                        .padding(6.dp)
                 ) {
-                    Text(text = "View Site Game")
+                    Text(text = "View Site Game", fontSize = 14.sp)
                 }
             }
         }