diff --git a/app/src/main/java/org/shirabox/app/ui/activity/search/SearchActivity.kt b/app/src/main/java/org/shirabox/app/ui/activity/search/SearchActivity.kt
index 5ad6922..699d37e 100644
--- a/app/src/main/java/org/shirabox/app/ui/activity/search/SearchActivity.kt
+++ b/app/src/main/java/org/shirabox/app/ui/activity/search/SearchActivity.kt
@@ -16,6 +16,7 @@ import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
@@ -25,12 +26,14 @@ import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Close
 import androidx.compose.material.icons.filled.History
 import androidx.compose.material.icons.filled.Search
-import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
+import androidx.compose.material3.LinearProgressIndicator
+import androidx.compose.material3.ListItemDefaults
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.SearchBar
+import androidx.compose.material3.SearchBarDefaults
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -47,7 +50,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.focus.FocusRequester
 import androidx.compose.ui.focus.focusRequester
-import androidx.compose.ui.graphics.StrokeCap
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
@@ -141,116 +144,131 @@ fun SearchScreen() {
         queryText.value = text
     }
 
-    SearchBar(
-        modifier = Modifier
-            .fillMaxWidth()
-            .focusRequester(focusRequester),
-        query = text,
-        onQueryChange = { text = it },
-        onSearch = { searchHistory.add(text) },
-        active = true,
-        onActiveChange = {},
-        placeholder = {
-            Text(text = stringResource(id = R.string.search_by_name))
-        },
-        leadingIcon = {
-            Icon(imageVector = Icons.Default.Search, contentDescription = "Search icon")
-        },
-        trailingIcon = {
-            IconButton(onClick = {
-                if (text.isNotEmpty()) {
-                    searchHistory.add(text)
-                    text = ""
-                } else activity?.finish()
-            }) {
-                Icon(imageVector = Icons.Default.Close, contentDescription = "Close icon")
-            }
-        }) {
-
-        LazyColumn(
-            horizontalAlignment = Alignment.CenterHorizontally,
-        ) {
-            if (text.isEmpty()) {
-                items(searchHistory) {
-                    if (it.isNotEmpty()) {
-                        androidx.compose.material3.ListItem(
-                            modifier = Modifier.clickable {
-                                text = it
-                            },
-                            headlineContent = {
-                                Text(it)
-                            },
-                            leadingContent = {
-                                Icon(imageVector = Icons.Default.History, contentDescription = null)
-                            },
-                        )
+    Column {
+        SearchBar(
+            inputField = {
+                SearchBarDefaults.InputField(
+                    query = text,
+                    onQueryChange = { text = it },
+                    onSearch = { searchHistory.add(text) },
+                    expanded = true,
+                    onExpandedChange = {  },
+                    enabled = true,
+                    placeholder = {
+                        Text(text = stringResource(id = R.string.search_by_name))
+                    },
+                    leadingIcon = {
+                        Icon(imageVector = Icons.Default.Search, contentDescription = "Search icon")
+                    },
+                    trailingIcon = {
+                        IconButton(onClick = {
+                            if (text.isNotEmpty()) {
+                                searchHistory.add(text)
+                                text = ""
+                            } else activity?.finish()
+                        }) {
+                            Icon(imageVector = Icons.Default.Close, contentDescription = "Close icon")
+                        }
+                    },
+                    interactionSource = null,
+                )
+            },
+            expanded = true,
+            onExpandedChange = {},
+            modifier = Modifier
+                .fillMaxWidth()
+                .focusRequester(focusRequester),
+            shape = SearchBarDefaults.inputFieldShape,
+            tonalElevation = SearchBarDefaults.TonalElevation,
+            shadowElevation = SearchBarDefaults.ShadowElevation,
+            windowInsets = SearchBarDefaults.windowInsets,
+            content = {
+                LazyColumn(
+                    horizontalAlignment = Alignment.CenterHorizontally,
+                ) {
+                    if (text.isEmpty()) {
+                        items(searchHistory) {
+                            if (it.isNotEmpty()) {
+                                androidx.compose.material3.ListItem(
+                                    modifier = Modifier.clickable {
+                                        text = it
+                                    },
+                                    headlineContent = {
+                                        Text(it)
+                                    },
+                                    leadingContent = {
+                                        Icon(
+                                            imageVector = Icons.Default.History,
+                                            contentDescription = null
+                                        )
+                                    },
+                                    colors = ListItemDefaults.colors(containerColor = Color.Transparent)
+                                )
+                            }
+                        }
+                        return@LazyColumn
                     }
-                }
-                return@LazyColumn
-            }
 
-            item {
-                if(showProgressIndicator && !noResultsState.value) {
-                    Box(
-                        modifier = Modifier
-                            .fillMaxWidth()
-                            .padding(32.dp),
-                        contentAlignment = Alignment.Center
-                    ) {
-                        CircularProgressIndicator(
-                            strokeCap = StrokeCap.Round
-                        )
+                    item {
+                        AnimatedVisibility(
+                            visible = showProgressIndicator && !noResultsState.value
+                        ) {
+                            LinearProgressIndicator(
+                                modifier = Modifier.fillMaxWidth()
+                            )
+                        }
                     }
-                }
-            }
 
-            item {
-                AnimatedVisibility(
-                    visible = noResultsState.value,
-                    enter = fadeIn(),
-                    exit = fadeOut()
-                ) {
-                    Box(
-                        modifier = Modifier
-                            .fillMaxWidth()
-                            .padding(32.dp),
-                        contentAlignment = Alignment.Center
-                    ) {
-                        DespondencyEmoticon(text = stringResource(id = R.string.nothing_found))
+                    item {
+                        AnimatedVisibility(
+                            visible = noResultsState.value,
+                            enter = fadeIn(),
+                            exit = fadeOut()
+                        ) {
+                            Box(
+                                modifier = Modifier
+                                    .fillMaxWidth()
+                                    .padding(32.dp),
+                                contentAlignment = Alignment.Center
+                            ) {
+                                DespondencyEmoticon(text = stringResource(id = R.string.nothing_found))
+                            }
+                        }
                     }
-                }
-            }
 
-            items(resultsList) {
-                AnimatedVisibility(
-                    visible = !showProgressIndicator,
-                    enter = fadeIn(
-                        animationSpec = tween(300, easing = LinearEasing)
-                    )
-                ) {
-                    ListItem(
-                        headlineContent = {
-                            Text(
-                                text = it.name.ifBlank { it.enName }, fontWeight = FontWeight.Bold
+                    items(resultsList) {
+                        AnimatedVisibility(
+                            visible = !showProgressIndicator,
+                            enter = fadeIn(
+                                animationSpec = tween(300, easing = LinearEasing)
                             )
-                        },
-                        supportingString = "${it.releaseYear}, ${
-                            ValuesHelper.decodeKind(
-                                it.kind,
-                                context
-                            )
-                        }",
-                        coverImage = it.image
-                    ) {
-                        context.startActivity(Intent(
-                            context, ResourceActivity::class.java
-                        ).apply {
-                            putExtra("id", it.shikimoriId)
-                            putExtra("type", it.type)
-                        })
+                        ) {
+                            ListItem(
+                                headlineContent = {
+                                    Text(
+                                        text = it.name.ifBlank { it.enName },
+                                        fontWeight = FontWeight.Bold
+                                    )
+                                },
+                                supportingString = "${it.releaseYear}, ${
+                                    ValuesHelper.decodeKind(
+                                        it.kind,
+                                        context
+                                    )
+                                }",
+                                coverImage = it.image,
+                            ) {
+                                context.startActivity(Intent(
+                                    context, ResourceActivity::class.java
+                                ).apply {
+                                    putExtra("id", it.shikimoriId)
+                                    putExtra("type", it.type)
+                                })
+                            }
+                        }
                     }
                 }
-            }
-        }
+            },
+        )
     }
 }
\ No newline at end of file
diff --git a/app/src/main/java/org/shirabox/app/ui/activity/settings/category/playback/Dialogs.kt b/app/src/main/java/org/shirabox/app/ui/activity/settings/category/playback/Dialogs.kt
index 4023b50..b4c38c6 100644
--- a/app/src/main/java/org/shirabox/app/ui/activity/settings/category/playback/Dialogs.kt
+++ b/app/src/main/java/org/shirabox/app/ui/activity/settings/category/playback/Dialogs.kt
@@ -13,6 +13,7 @@ import androidx.compose.material.icons.outlined.Sd
 import androidx.compose.material3.AlertDialog
 import androidx.compose.material3.Icon
 import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
 import androidx.compose.material3.RadioButton
@@ -150,7 +151,8 @@ private fun QualityListItem(
             RadioButton(
                 selected = selected,
                 onClick = { onClick() })
-        }
+        },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent)
     )
 }
 
diff --git a/app/src/main/java/org/shirabox/app/ui/component/general/ListItem.kt b/app/src/main/java/org/shirabox/app/ui/component/general/ListItem.kt
index 15df8ae..2111c84 100644
--- a/app/src/main/java/org/shirabox/app/ui/component/general/ListItem.kt
+++ b/app/src/main/java/org/shirabox/app/ui/component/general/ListItem.kt
@@ -86,7 +86,8 @@ fun ListItem(
                 contentDescription = stringResource(id = R.string.history),
                 contentScale = ContentScale.Crop
             )
-        }
+        },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent)
     )
 }