Update themes and styles to Material Design 3

This commit transitions all layouts and views to the use the new stuff from MD3.

app/src/main/java/emu/skyline/MainActivity.kt

@@ -131,8 +131,8 @@ class MainActivity : AppCompatActivity() {
         setupAppList()
 
         binding.swipeRefreshLayout.apply {
-            setProgressBackgroundColorSchemeColor(getColor(R.color.backgroundColorVariant))
+            setProgressBackgroundColorSchemeColor(obtainStyledAttributes(intArrayOf(R.attr.colorSurfaceVariant)).use { it.getColor(0, Color.BLACK) })
-            setColorSchemeColors(obtainStyledAttributes(intArrayOf(R.attr.colorAccent)).use { it.getColor(0, Color.BLACK) })
+            setColorSchemeColors(obtainStyledAttributes(intArrayOf(R.attr.colorPrimary)).use { it.getColor(0, Color.WHITE) })
             post { setDistanceToTriggerSync(binding.swipeRefreshLayout.height / 3) }
             setOnRefreshListener { loadRoms(false) }
         }

app/src/main/java/emu/skyline/input/ControllerActivity.kt

@@ -7,6 +7,7 @@ package emu.skyline.input
 
 import android.content.Intent
 import android.graphics.Canvas
+import android.graphics.Color
 import android.os.Bundle
 import android.view.KeyEvent
 import android.view.ViewTreeObserver
@@ -236,7 +237,7 @@ class ControllerActivity : AppCompatActivity() {
             }
         }
 
-        dividerItemDecoration.drawable.let { it?.setTint(getColor(R.color.dividerColor)); it }
+        dividerItemDecoration.drawable.let { it?.setTint(obtainStyledAttributes(intArrayOf(R.attr.colorOutlineVariant)).use { attr -> attr.getColor(0, Color.BLACK) }); it }
         binding.controllerList.addItemDecoration(dividerItemDecoration)
 
         update()

app/src/main/java/emu/skyline/input/dialog/StickDialog.kt

@@ -12,7 +12,6 @@ import android.os.Looper
 import android.util.TypedValue
 import android.view.*
 import android.view.animation.LinearInterpolator
-import androidx.coordinatorlayout.widget.CoordinatorLayout
 import androidx.fragment.app.commit
 import com.google.android.material.bottomsheet.BottomSheetBehavior
 import com.google.android.material.bottomsheet.BottomSheetDialogFragment

app/src/main/java/emu/skyline/views/SearchBarView.kt

@@ -5,35 +5,30 @@ import android.text.Editable
 import android.text.TextWatcher
 import android.util.AttributeSet
 import android.view.LayoutInflater
-import android.view.inputmethod.InputMethodManager
 import com.google.android.material.card.MaterialCardView
 import emu.skyline.databinding.ViewSearchBarBinding
 
 class SearchBarView @JvmOverloads constructor(context : Context, attrs : AttributeSet? = null, defStyleAttr : Int = com.google.android.material.R.attr.materialCardViewStyle) : MaterialCardView(context, attrs, defStyleAttr) {
     private val binding = ViewSearchBarBinding.inflate(LayoutInflater.from(context), this)
 
-    init {
-        useCompatPadding = true
-    }
-
     var text : CharSequence
         get() = binding.searchField.text
         set(value) = binding.searchField.setText(value)
 
     fun addTextChangedListener(
-            beforeTextChanged : (
+        beforeTextChanged : (
-                    text : CharSequence?,
+            text : CharSequence?,
-                    start : Int,
+            start : Int,
-                    count : Int,
+            count : Int,
-                    after : Int
+            after : Int
-            ) -> Unit = { _, _, _, _ -> },
+        ) -> Unit = { _, _, _, _ -> },
-            onTextChanged : (
+        onTextChanged : (
-                    text : CharSequence?,
+            text : CharSequence?,
-                    start : Int,
+            start : Int,
-                    before : Int,
+            before : Int,
-                    count : Int
+            count : Int
-            ) -> Unit = { _, _, _, _ -> },
+        ) -> Unit = { _, _, _, _ -> },
-            afterTextChanged : (text : Editable?) -> Unit = {}
+        afterTextChanged : (text : Editable?) -> Unit = {}
     ) : TextWatcher {
         val textWatcher = object : TextWatcher {
             override fun afterTextChanged(s : Editable?) {

app/src/main/res/drawable/skyline_text.xml

@@ -4,24 +4,24 @@
     android:viewportWidth="306.8"
     android:viewportHeight="86.4">
   <path
-      android:fillColor="#FF000000"
+      android:fillColor="?attr/colorOnSurface"
       android:pathData="M25.3,69.4c-4.7,0.1 -9.4,-0.7 -13.8,-2.6c-3.4,-1.5 -6.3,-3.8 -8.4,-6.8c-1.8,-2.6 -2.9,-5.6 -3.1,-8.8c0,-0.5 0.2,-1 0.5,-1.4c0.3,-0.4 0.8,-0.6 1.3,-0.6h7.9c0.6,0 1.2,0.1 1.7,0.5c0.4,0.4 0.7,0.8 1,1.3c0.4,1.3 1.1,2.5 2,3.5c1.1,1.3 2.6,2.2 4.1,2.9c2.1,0.8 4.3,1.2 6.6,1.1c4.3,0 7.4,-0.8 9.5,-2.3c2,-1.4 3.2,-3.7 3.1,-6.1c0.1,-1.6 -0.5,-3.2 -1.7,-4.4c-1.5,-1.3 -3.3,-2.3 -5.2,-3c-3,-1.1 -6.1,-2.1 -9.3,-2.9c-3.8,-0.9 -7.6,-2.3 -11.1,-4.1c-2.7,-1.4 -5.1,-3.5 -6.7,-6.1c-1.6,-2.8 -2.4,-6.1 -2.3,-9.3c-0.1,-3.4 0.9,-6.8 2.8,-9.7c2,-2.9 4.8,-5.3 8,-6.7c3.9,-1.7 8.1,-2.6 12.3,-2.4C28.3,1.5 31.7,2 35,3.2c2.7,1 5.2,2.4 7.4,4.3c1.8,1.6 3.3,3.6 4.5,5.8c1,1.9 1.5,3.9 1.6,6c0,0.5 -0.2,1 -0.5,1.4c-0.3,0.4 -0.8,0.6 -1.4,0.6h-8.3c-0.5,0 -1,-0.1 -1.4,-0.4c-0.5,-0.3 -0.9,-0.8 -1.2,-1.4c-0.4,-2.1 -1.7,-3.9 -3.5,-5c-2.2,-1.5 -4.9,-2.2 -7.5,-2.1c-2.7,-0.1 -5.4,0.5 -7.7,1.9c-2,1.3 -3.1,3.5 -2.9,5.8c-0.1,1.6 0.5,3.1 1.5,4.4c1.3,1.4 2.9,2.4 4.7,3.1c2.8,1.1 5.7,2 8.6,2.8c4.2,0.9 8.4,2.3 12.3,4.1c2.9,1.3 5.3,3.4 7,6c1.6,2.8 2.3,6 2.2,9.2c0.1,3.8 -1,7.5 -3.2,10.6c-2.2,3 -5.3,5.4 -8.8,6.8C34.3,68.7 29.8,69.5 25.3,69.4z"/>
   <path
-      android:fillColor="#FF000000"
+      android:fillColor="?attr/colorOnSurface"
       android:pathData="M61.8,68.5c-0.6,0 -1.1,-0.2 -1.5,-0.7c-0.4,-0.4 -0.6,-1 -0.6,-1.6V3.8c0,-0.6 0.2,-1.2 0.6,-1.6c0.4,-0.4 0.9,-0.7 1.5,-0.7H69c0.6,0 1.2,0.2 1.6,0.7c0.4,0.4 0.6,1 0.6,1.6V36L86,21c0.4,-0.4 0.9,-0.8 1.4,-1.2c0.6,-0.3 1.2,-0.5 1.9,-0.4h8.2c0.5,0 1,0.2 1.4,0.6c0.4,0.4 0.6,1 0.5,1.5c0,0.3 -0.1,0.6 -0.2,0.9c-0.1,0.3 -0.4,0.6 -0.7,0.9L80.3,41.4l20.5,23.4c0.5,0.4 0.8,1 0.9,1.6c0,0.6 -0.2,1.1 -0.6,1.5c-0.4,0.4 -0.9,0.6 -1.4,0.6h-8.4c-0.7,0.1 -1.3,-0.1 -1.9,-0.4c-0.5,-0.4 -0.9,-0.8 -1.4,-1.2l-16.9,-19v18.3c0,0.6 -0.2,1.2 -0.6,1.6c-0.4,0.4 -1,0.7 -1.6,0.7L61.8,68.5z"/>
   <path
-      android:fillColor="#FF000000"
+      android:fillColor="?attr/colorOnSurface"
       android:pathData="M116.6,86.4c-0.5,0 -0.9,-0.2 -1.2,-0.6c-0.3,-0.3 -0.5,-0.8 -0.5,-1.3c0,-0.2 0,-0.5 0,-0.7c0.1,-0.3 0.2,-0.6 0.3,-0.8l6.9,-17.4l-17,-42.7c-0.2,-0.4 -0.3,-0.9 -0.4,-1.3c0.1,-0.5 0.3,-1 0.6,-1.5c0.3,-0.4 0.8,-0.6 1.3,-0.6h7.2c0.6,0 1.2,0.2 1.6,0.6c0.3,0.4 0.6,0.8 0.8,1.2L128,52.1l12.2,-30.9c0.2,-0.5 0.4,-0.9 0.8,-1.2c0.4,-0.4 1,-0.6 1.6,-0.5h7.1c0.5,0 1,0.2 1.3,0.5c0.4,0.3 0.6,0.8 0.6,1.3c0,0.5 -0.2,1 -0.4,1.5l-25.1,61.8c-0.2,0.5 -0.5,0.9 -0.9,1.3c-0.4,0.4 -1,0.6 -1.6,0.5L116.6,86.4z"/>
   <path
-      android:fillColor="#FF000000"
+      android:fillColor="?attr/colorOnSurface"
       android:pathData="M161.4,68.5c-0.6,0 -1.1,-0.2 -1.5,-0.7c-0.4,-0.4 -0.6,-1 -0.6,-1.6V3.8c0,-0.6 0.2,-1.2 0.6,-1.6c0.4,-0.4 0.9,-0.7 1.5,-0.7h7.4c0.6,0 1.1,0.2 1.5,0.7c0.4,0.4 0.6,1 0.6,1.6v62.5c0,0.6 -0.2,1.2 -0.6,1.6c-0.4,0.4 -0.9,0.7 -1.5,0.7L161.4,68.5z"/>
   <path
-      android:fillColor="#FF000000"
+      android:fillColor="?attr/colorOnSurface"
       android:pathData="M186.4,11.3c-0.6,0 -1.1,-0.2 -1.6,-0.6c-0.4,-0.5 -0.6,-1 -0.6,-1.6V2.3c0,-0.6 0.2,-1.2 0.6,-1.6c0.4,-0.4 1,-0.7 1.6,-0.7h8.1c0.6,0 1.2,0.2 1.6,0.7c0.4,0.4 0.6,1 0.6,1.6v6.8c0,0.6 -0.2,1.2 -0.6,1.6c-0.4,0.4 -1,0.6 -1.6,0.6H186.4zM186.7,68.5c-0.6,0 -1.1,-0.2 -1.5,-0.7c-0.4,-0.4 -0.6,-1 -0.6,-1.6V21.7c0,-0.6 0.2,-1.2 0.6,-1.6c0.4,-0.4 0.9,-0.7 1.5,-0.7h7.4c0.6,0 1.2,0.2 1.6,0.7c0.4,0.4 0.6,1 0.6,1.6v44.5c0,0.6 -0.2,1.2 -0.6,1.6c-0.4,0.4 -1,0.7 -1.6,0.7L186.7,68.5z"/>
   <path
-      android:fillColor="#FF000000"
+      android:fillColor="?attr/colorOnSurface"
       android:pathData="M211.9,68.5c-0.6,0 -1.1,-0.2 -1.5,-0.7c-0.4,-0.4 -0.6,-1 -0.6,-1.6V21.7c0,-0.6 0.2,-1.2 0.6,-1.6c0.4,-0.4 0.9,-0.7 1.5,-0.7h7.3c0.6,0 1.1,0.2 1.5,0.7c0.4,0.4 0.6,1 0.6,1.6v3.9c1.6,-2.1 3.6,-3.8 5.9,-5c2.7,-1.4 5.8,-2.1 8.9,-2c6.7,-0.2 12.9,3.7 15.6,9.9c1.5,3.6 2.3,7.4 2.2,11.3v26.5c0,0.6 -0.2,1.2 -0.6,1.6c-0.4,0.4 -0.9,0.7 -1.5,0.7h-7.8c-0.6,0 -1.1,-0.2 -1.5,-0.7c-0.4,-0.4 -0.6,-1 -0.6,-1.6V40.3c0,-3.7 -0.8,-6.5 -2.5,-8.6c-1.8,-2.1 -4.5,-3.3 -7.3,-3.1c-2.8,-0.1 -5.5,1 -7.4,3.1c-1.8,2.1 -2.7,4.9 -2.8,8.6v25.9c0,0.6 -0.2,1.2 -0.6,1.6c-0.4,0.4 -0.9,0.7 -1.5,0.7L211.9,68.5z"/>
   <path
-      android:fillColor="#FF000000"
+      android:fillColor="?attr/colorOnSurface"
       android:pathData="M284.9,69.4c-6.6,0 -11.8,-2 -15.6,-6s-5.9,-9.7 -6.2,-17.2c-0.1,-0.6 -0.1,-1.4 -0.1,-2.4s0,-1.7 0.1,-2.3c0.1,-4.3 1.2,-8.4 3.1,-12.3c1.7,-3.3 4.3,-6.1 7.5,-8c3.4,-1.9 7.3,-2.9 11.2,-2.8c4.2,-0.2 8.4,0.9 12.1,3.1c3.3,2.1 5.8,5.2 7.4,8.8c1.7,4.1 2.6,8.5 2.5,13v2c0,0.6 -0.2,1.2 -0.6,1.6c-0.4,0.4 -1,0.7 -1.6,0.7h-29.5v0.8c0,2.1 0.4,4.1 1.2,6.1c0.7,1.8 1.8,3.3 3.3,4.5c1.5,1.1 3.3,1.7 5.2,1.7c1.4,0 2.9,-0.2 4.2,-0.8c1,-0.5 1.9,-1.1 2.8,-1.9c0.6,-0.5 1.1,-1.1 1.5,-1.7c0.3,-0.5 0.8,-1 1.3,-1.3c0.5,-0.2 1,-0.3 1.5,-0.2h7.6c0.5,0 1.1,0.2 1.5,0.6c0.4,0.4 0.6,0.9 0.5,1.4c-0.2,1.3 -0.7,2.6 -1.5,3.7c-1.1,1.6 -2.4,3.1 -3.9,4.2c-1.9,1.5 -4.1,2.7 -6.4,3.4C290.9,69.1 287.9,69.5 284.9,69.4zM275.2,39.7h19.6v-0.3c0,-2.2 -0.3,-4.4 -1.2,-6.4c-0.7,-1.7 -1.9,-3.2 -3.4,-4.3c-3.2,-2.1 -7.4,-2.1 -10.6,0c-1.5,1.1 -2.6,2.6 -3.3,4.3c-0.8,2 -1.2,4.2 -1.1,6.4V39.7z"/>
 </vector>

app/src/main/res/layout/app_dialog.xml

@@ -28,7 +28,7 @@
             app:layout_constraintBottom_toBottomOf="@+id/constraintLayout"
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintTop_toTopOf="@+id/constraintLayout"
-            app:shapeAppearance="?attr/shapeAppearanceSmallComponent"
+            app:shapeAppearance="?attr/shapeAppearanceCornerLarge"
             tools:src="@drawable/default_icon" />
 
         <androidx.constraintlayout.widget.ConstraintLayout
@@ -43,44 +43,39 @@
 
             <TextView
                 android:id="@+id/game_title"
+                style="?attr/textAppearanceTitleMedium"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:textAlignment="viewStart"
-                android:textAppearance="?android:attr/textAppearanceListItem"
+                android:textSize="20sp"
-                android:textSize="18sp"
                 app:layout_constraintStart_toStartOf="parent"
                 app:layout_constraintTop_toTopOf="parent"
                 tools:text="The Legend of Zelda: Breath of the Wild" />
 
             <TextView
                 android:id="@+id/game_title_id"
+                style="?attr/textAppearanceBodyMedium"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:textAppearance="?android:attr/textAppearanceListItemSecondary"
+                android:layout_marginTop="4dp"
-                android:textColor="@android:color/tertiary_text_light"
-                android:textSize="14sp"
                 app:layout_constraintStart_toStartOf="@id/game_title"
                 app:layout_constraintTop_toBottomOf="@id/game_title"
                 tools:text="0100000000010000" />
 
             <TextView
                 android:id="@+id/game_version"
+                style="?attr/textAppearanceBodyMedium"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:textAppearance="?android:attr/textAppearanceListItemSecondary"
-                android:textColor="@android:color/tertiary_text_light"
-                android:textSize="14sp"
                 app:layout_constraintStart_toStartOf="@id/game_title_id"
                 app:layout_constraintTop_toBottomOf="@id/game_title_id"
                 tools:text="1.0.0" />
 
             <TextView
                 android:id="@+id/game_author"
+                style="?attr/textAppearanceBodyMedium"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:textAppearance="?android:attr/textAppearanceListItemSecondary"
-                android:textColor="@android:color/tertiary_text_light"
-                android:textSize="14sp"
                 app:layout_constraintStart_toStartOf="@id/game_version"
                 app:layout_constraintTop_toBottomOf="@id/game_version"
                 tools:text="Nintendo" />
@@ -88,9 +83,10 @@
         </androidx.constraintlayout.widget.ConstraintLayout>
 
         <com.google.android.flexbox.FlexboxLayout
+            style="@style/ThemeOverlay.Material3.Button.IconButton.Filled.Tonal"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
+            android:layout_marginTop="16dp"
             app:flexWrap="nowrap"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintEnd_toEndOf="parent"
@@ -98,45 +94,38 @@
             app:layout_constraintTop_toBottomOf="@id/game_icon"
             app:layout_constraintVertical_bias="1">
 
-            <Button
+            <com.google.android.material.button.MaterialButton
                 android:id="@+id/game_play"
-                style="@style/Widget.MaterialComponents.Button.OutlinedButton.Icon"
+                style="@style/Widget.Material3.Button.Icon"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:contentDescription="@string/play"
                 android:focusedByDefault="true"
                 android:text="@string/play"
-                android:textColor="?attr/colorAccent"
                 app:icon="@drawable/ic_play"
-                app:iconTint="?attr/colorAccent"
                 app:layout_flexGrow="1"
                 app:layout_maxWidth="140dp" />
 
-            <Button
+            <com.google.android.material.button.MaterialButton
                 android:id="@+id/game_settings"
-                style="@style/Widget.MaterialComponents.Button.OutlinedButton.Icon"
+                style="@style/Widget.Material3.Button.IconButton.Filled.Tonal"
                 android:layout_width="48dp"
                 android:layout_height="wrap_content"
                 android:layout_marginStart="8dp"
                 android:contentDescription="@string/settings"
-                android:padding="0dp"
                 android:textColor="?attr/colorAccent"
                 app:icon="@drawable/ic_settings"
-                app:iconGravity="textStart"
+                app:iconGravity="textStart" />
-                app:iconPadding="0dp" />
 
-            <Button
+            <com.google.android.material.button.MaterialButton
                 android:id="@+id/game_pin"
-                style="@style/Widget.MaterialComponents.Button.OutlinedButton.Icon"
+                style="@style/Widget.Material3.Button.IconButton.Filled.Tonal"
                 android:layout_width="48dp"
                 android:layout_height="wrap_content"
                 android:layout_marginStart="8dp"
                 android:contentDescription="@string/pin"
-                android:padding="0dp"
-                android:textColor="?attr/colorAccent"
                 app:icon="@drawable/ic_add_home"
-                app:iconGravity="textStart"
+                app:iconGravity="textStart" />
-                app:iconPadding="0dp" />
 
         </com.google.android.flexbox.FlexboxLayout>
     </androidx.constraintlayout.widget.ConstraintLayout>

app/src/main/res/layout/app_item_grid.xml

@@ -11,11 +11,11 @@
 
     <com.google.android.material.card.MaterialCardView
         android:id="@+id/item_card"
+        style="@style/Widget.Material3.CardView.Elevated"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_margin="10dp"
-        app:cardCornerRadius="@dimen/cornerRadiusMedium"
+        app:shapeAppearance="?attr/shapeAppearanceCornerLarge">
-        app:cardElevation="2dp">
 
         <ImageView
             android:id="@+id/icon"
@@ -28,6 +28,7 @@
 
     <TextView
         android:id="@+id/text_title"
+        style="?attr/textAppearanceTitleSmall"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginStart="10dp"
@@ -35,13 +36,11 @@
         android:ellipsize="marquee"
         android:marqueeRepeatLimit="marquee_forever"
         android:singleLine="true"
-        android:textAppearance="?android:attr/textAppearanceListItem"
-        android:textColor="?android:attr/textColorPrimary"
-        android:textSize="14sp"
         tools:text="Title" />
 
     <TextView
         android:id="@+id/text_version"
+        style="?attr/textAppearanceBodySmall"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginStart="10dp"
@@ -49,13 +48,11 @@
         android:ellipsize="marquee"
         android:marqueeRepeatLimit="marquee_forever"
         android:singleLine="true"
-        android:textAppearance="?android:attr/textAppearanceListItemSecondary"
-        android:textColor="?android:attr/textColorSecondary"
-        android:textSize="12sp"
         tools:text="Version" />
 
     <TextView
         android:id="@+id/text_author"
+        style="?attr/textAppearanceBodySmall"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginStart="10dp"
@@ -64,8 +61,5 @@
         android:ellipsize="marquee"
         android:marqueeRepeatLimit="marquee_forever"
         android:singleLine="true"
-        android:textAppearance="?android:attr/textAppearanceListItemSecondary"
-        android:textColor="?android:attr/textColorSecondary"
-        android:textSize="12sp"
         tools:text="Author" />
 </LinearLayout>

app/src/main/res/layout/app_item_grid_compact.xml

@@ -3,11 +3,11 @@
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
     android:id="@+id/item_click_layout"
+    style="@style/Widget.Material3.CardView.Elevated"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_margin="7.5dp"
-    app:cardCornerRadius="@dimen/cornerRadiusMedium"
+    app:shapeAppearance="?attr/shapeAppearanceCornerLarge">
-    app:cardElevation="2dp">
 
     <androidx.constraintlayout.widget.ConstraintLayout
         android:layout_width="match_parent"
@@ -28,6 +28,7 @@
 
         <TextView
             android:id="@+id/text_title"
+            style="?attr/textAppearanceTitleSmall"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
             android:ellipsize="marquee"
@@ -35,10 +36,7 @@
             android:paddingHorizontal="8dp"
             android:singleLine="true"
             android:textAlignment="viewStart"
-            android:textAppearance="?android:attr/textAppearanceListItem"
             android:textColor="@android:color/white"
-            android:textSize="15sp"
-            android:textStyle="bold"
             app:layout_constrainedWidth="true"
             app:layout_constraintBottom_toTopOf="@id/text_version"
             app:layout_constraintEnd_toEndOf="@id/icon"
@@ -47,6 +45,7 @@
 
         <TextView
             android:id="@+id/text_version"
+            style="?attr/textAppearanceBodySmall"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
             android:alpha="0.95"
@@ -55,7 +54,6 @@
             android:paddingHorizontal="8dp"
             android:singleLine="true"
             android:textAlignment="viewStart"
-            android:textAppearance="?android:attr/textAppearanceListItemSecondary"
             android:textColor="@android:color/white"
             app:layout_constraintBottom_toTopOf="@id/text_author"
             app:layout_constraintEnd_toEndOf="@id/icon"
@@ -64,6 +62,7 @@
 
         <TextView
             android:id="@+id/text_author"
+            style="?attr/textAppearanceBodySmall"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
             android:layout_marginBottom="8dp"
@@ -73,9 +72,7 @@
             android:paddingHorizontal="8dp"
             android:singleLine="true"
             android:textAlignment="viewStart"
-            android:textAppearance="?android:attr/textAppearanceListItemSecondary"
             android:textColor="@android:color/white"
-            android:textSize="12sp"
             app:layout_constraintBottom_toBottomOf="@id/icon"
             app:layout_constraintEnd_toEndOf="@id/icon"
             app:layout_constraintStart_toStartOf="@id/icon"

app/src/main/res/layout/app_item_linear.xml

@@ -13,25 +13,25 @@
 
     <com.google.android.material.imageview.ShapeableImageView
         android:id="@+id/icon"
-        android:layout_width="56dp"
+        android:layout_width="64dp"
-        android:layout_height="56dp"
+        android:layout_height="64dp"
         android:contentDescription="@string/icon"
         android:focusable="false"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintTop_toTopOf="parent"
-        app:shapeAppearance="?attr/shapeAppearanceSmallComponent"
+        app:shapeAppearance="?attr/shapeAppearanceMediumComponent"
         tools:src="@drawable/default_icon" />
 
     <TextView
         android:id="@+id/text_title"
+        style="?attr/textAppearanceTitleMedium"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginStart="12dp"
         android:ellipsize="marquee"
         android:marqueeRepeatLimit="marquee_forever"
         android:singleLine="true"
-        android:textAppearance="?android:attr/textAppearanceListItem"
         app:layout_constrainedWidth="true"
         app:layout_constraintBottom_toTopOf="@id/text_version"
         app:layout_constraintEnd_toEndOf="parent"
@@ -42,13 +42,12 @@
 
     <TextView
         android:id="@+id/text_version"
+        style="?attr/textAppearanceBodyMedium"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:ellipsize="marquee"
         android:marqueeRepeatLimit="marquee_forever"
         android:singleLine="true"
-        android:textAppearance="?android:attr/textAppearanceListItemSecondary"
-        android:textColor="@android:color/tertiary_text_light"
         app:layout_constrainedWidth="true"
         app:layout_constraintBottom_toTopOf="@id/text_author"
         app:layout_constraintEnd_toEndOf="parent"
@@ -59,13 +58,12 @@
 
     <TextView
         android:id="@+id/text_author"
+        style="?attr/textAppearanceBodyMedium"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:ellipsize="marquee"
         android:marqueeRepeatLimit="marquee_forever"
         android:singleLine="true"
-        android:textAppearance="?android:attr/textAppearanceListItemSecondary"
-        android:textColor="@android:color/tertiary_text_light"
         app:layout_constrainedWidth="true"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"

app/src/main/res/layout/button_dialog.xml

@@ -16,14 +16,13 @@
 
     <TextView
         android:id="@+id/button_title"
+        style="?attr/textAppearanceBodyLarge"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="center_horizontal"
         android:animateLayoutChanges="true"
         android:text="@string/use_button_axis"
-        android:textAlignment="center"
+        android:textAlignment="center" />
-        android:textAppearance="@style/TextAppearance.AppCompat.Display1"
-        android:textSize="16sp" />
 
     <RelativeLayout
         android:id="@+id/button_container"
@@ -72,13 +71,12 @@
         android:visibility="gone"
         tools:visibility="visible" />
 
-    <Button
+    <com.google.android.material.button.MaterialButton
         android:id="@+id/button_reset"
-        style="@style/Widget.MaterialComponents.Button.OutlinedButton"
+        style="@style/Widget.Material3.Button.TonalButton"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="end"
         android:layout_marginEnd="10dp"
-        android:text="@string/reset"
+        android:text="@string/reset" />
-        android:textColor="?attr/colorAccent" />
 </LinearLayout>

app/src/main/res/layout/controller_checkbox_item.xml

@@ -22,20 +22,19 @@
 
         <TextView
             android:id="@+id/text_title"
+            style="?attr/textAppearanceTitleMedium"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:ellipsize="marquee"
             android:singleLine="true"
-            android:textAppearance="?android:attr/textAppearanceListItem"
             tools:text="Title" />
 
         <TextView
             android:id="@+id/text_author"
+            style="?attr/textAppearanceBodyMedium"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:maxLines="10"
-            android:textAppearance="?android:attr/textAppearanceListItemSecondary"
-            android:textColor="?android:attr/textColorSecondary"
             tools:text="Summary" />
     </LinearLayout>
 

app/src/main/res/layout/controller_header.xml

@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <TextView xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
+    style="?attr/textAppearanceTitleSmall"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_marginTop="16dp"
@@ -8,6 +9,5 @@
     android:paddingStart="72dp"
     android:paddingEnd="?android:attr/listPreferredItemPaddingEnd"
     android:textAlignment="viewStart"
-    android:textAppearance="@style/TextAppearance.AppCompat.Body2"
     android:textColor="?attr/colorAccent"
     tools:text="Header" />

app/src/main/res/layout/controller_item.xml

@@ -19,19 +19,18 @@
 
     <TextView
         android:id="@+id/text_title"
+        style="@style/TextAppearance.Material3.TitleMedium"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:ellipsize="marquee"
         android:singleLine="true"
-        android:textAppearance="?android:attr/textAppearanceListItem"
         tools:text="@string/config_controller" />
 
     <TextView
         android:id="@+id/text_author"
+        style="?attr/textAppearanceBodyMedium"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:maxLines="10"
-        android:textAppearance="?android:attr/textAppearanceListItemSecondary"
-        android:textColor="?android:attr/textColorSecondary"
         tools:text="@string/handheld_procon" />
 </LinearLayout>

app/src/main/res/layout/gpu_driver_activity.xml

@@ -21,14 +21,11 @@
 
     <com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
         android:id="@+id/add_driver_button"
-        style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton.Icon"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="end|bottom"
         android:layout_margin="16dp"
         android:contentDescription="@string/add_gpu_driver"
-        android:elevation="@dimen/mtrl_extended_fab_elevation"
-        android:stateListAnimator="@null"
         android:text="@string/install"
         app:icon="@drawable/ic_add"
         tools:ignore="PrivateResource" />

app/src/main/res/layout/gpu_driver_item.xml

@@ -2,7 +2,7 @@
 <com.google.android.material.card.MaterialCardView xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
-    style="@style/Widget.App.OutlinedCard"
+    style="@style/Widget.Material3.CardView.Elevated"
     android:layout_width="match_parent"
     android:layout_height="wrap_content">
 
@@ -22,12 +22,11 @@
 
         <TextView
             android:id="@+id/name"
+            style="?attr/textAppearanceTitleMedium"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
             android:layout_marginHorizontal="8dp"
-            android:includeFontPadding="false"
             android:textAlignment="viewStart"
-            android:textAppearance="@style/TextAppearance.MaterialComponents.Subtitle1"
             app:layout_constraintEnd_toStartOf="@+id/delete_button"
             app:layout_constraintStart_toEndOf="@id/radio_button"
             app:layout_constraintTop_toTopOf="parent"
@@ -35,16 +34,12 @@
 
         <TextView
             android:id="@+id/author_package_version"
+            style="?attr/textAppearanceTitleSmall"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
             android:layout_marginTop="4dp"
-            android:fontFamily="sans-serif-medium"
             android:includeFontPadding="false"
             android:textAlignment="viewStart"
-            android:textAppearance="@style/TextAppearance.MaterialComponents.Subtitle1"
-            android:textColor="?android:attr/textColorSecondary"
-            android:textSize="14sp"
-            android:textStyle="italic"
             app:layout_constraintEnd_toEndOf="@+id/name"
             app:layout_constraintStart_toStartOf="@id/name"
             app:layout_constraintTop_toBottomOf="@id/name"
@@ -52,16 +47,13 @@
 
         <TextView
             android:id="@+id/vendor_driver_version"
+            style="?attr/textAppearanceTitleSmall"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
             android:layout_marginTop="4dp"
             android:fontFamily="sans-serif-medium"
             android:includeFontPadding="false"
             android:textAlignment="viewStart"
-            android:textAppearance="@style/TextAppearance.MaterialComponents.Subtitle1"
-            android:textColor="?android:attr/textColorSecondary"
-            android:textSize="14sp"
-            android:textStyle="italic"
             app:layout_constraintEnd_toEndOf="@+id/name"
             app:layout_constraintStart_toStartOf="@id/name"
             app:layout_constraintTop_toBottomOf="@id/author_package_version"
@@ -69,6 +61,7 @@
 
         <TextView
             android:id="@+id/description"
+            style="?attr/textAppearanceBodyMedium"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
             android:layout_marginTop="6dp"

app/src/main/res/layout/keyboard_dialog.xml

@@ -4,7 +4,7 @@
     android:id="@+id/input_dialog"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    android:background="@color/backgroundColor"
+    android:background="?attr/colorSurface"
     app:layout_anchorGravity="center_vertical">
 
     <LinearLayout
@@ -49,7 +49,7 @@
 
             <com.google.android.material.button.MaterialButton
                 android:id="@+id/cancel_button"
-                style="@style/Widget.MaterialComponents.Button.OutlinedButton"
+                style="@style/Widget.Material3.Button.TonalButton"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_marginTop="@dimen/grid_padding"
@@ -60,7 +60,7 @@
 
             <com.google.android.material.button.MaterialButton
                 android:id="@+id/ok_button"
-                style="@style/Widget.MaterialComponents.Button.OutlinedButton"
+                style="@style/Widget.Material3.Button"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_marginTop="@dimen/grid_padding"
@@ -80,6 +80,7 @@
 
                 <com.google.android.material.textfield.TextInputEditText
                     android:id="@+id/text_input"
+                    style="@style/ThemeOverlay.Material3.TextInputEditText.OutlinedBox"
                     android:layout_width="match_parent"
                     android:layout_height="wrap_content"
                     android:imeOptions="flagNoExtractUi|flagNoFullscreen"

app/src/main/res/layout/license_dialog.xml

@@ -17,37 +17,35 @@
 
         <TextView
             android:id="@+id/library_title"
+            style="?attr/textAppearanceDisplaySmall"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:textAlignment="center"
-            android:textAppearance="@style/TextAppearance.MaterialComponents.Headline6"
-            android:textSize="32sp"
             tools:text="Skyline" />
 
         <TextView
             android:id="@+id/library_url"
+            style="?attr/textAppearanceTitleMedium"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:autoLink="web"
             android:paddingTop="6dp"
             android:textAlignment="center"
-            android:textAppearance="@style/TextAppearance.MaterialComponents.Headline5"
-            android:textSize="15sp"
             tools:ignore="TouchTargetSizeCheck"
             tools:text="https://github.com/skyline-emu/skyline" />
 
         <TextView
             android:id="@+id/library_copyright"
+            style="?attr/textAppearanceTitleMedium"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:paddingTop="4dp"
+            android:paddingTop="6dp"
             android:textAlignment="center"
-            android:textAppearance="@style/TextAppearance.MaterialComponents.Headline4"
-            android:textSize="15sp"
             tools:text="Copyright © 2019-2021\nSkyline Team and Contributors" />
 
         <TextView
             android:id="@+id/license_content"
+            style="?attr/textAppearanceBodyMedium"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:autoLink="web"
@@ -56,7 +54,6 @@
             android:paddingTop="15dp"
             android:paddingBottom="15dp"
             android:textAlignment="viewStart"
-            android:textAppearance="@style/TextAppearance.MaterialComponents.Body1"
             tools:text="@string/mpl2_license" />
 
     </LinearLayout>

app/src/main/res/layout/main_activity.xml

@@ -21,6 +21,7 @@
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:fitsSystemWindows="true"
+            app:contentScrim="?android:attr/colorBackground"
             app:layout_scrollFlags="scroll">
 
             <androidx.constraintlayout.widget.ConstraintLayout
@@ -33,7 +34,6 @@
                     android:id="@+id/refresh_icon"
                     android:layout_width="30dp"
                     android:layout_height="30dp"
-                    android:layout_gravity="center_vertical"
                     android:layout_marginEnd="4dp"
                     android:background="?attr/selectableItemBackgroundBorderless"
                     android:contentDescription="@string/refresh"
@@ -43,14 +43,13 @@
                     app:layout_constraintEnd_toStartOf="@id/log_icon"
                     app:layout_constraintTop_toTopOf="@id/title_text"
                     app:srcCompat="@drawable/ic_refresh"
-                    app:tint="?android:attr/textColorSecondary"
+                    app:tint="?attr/colorOnBackground"
                     tools:visibility="visible" />
 
                 <ImageView
                     android:id="@+id/log_icon"
                     android:layout_width="30dp"
                     android:layout_height="30dp"
-                    android:layout_gravity="center_vertical"
                     android:layout_marginEnd="4dp"
                     android:background="?attr/selectableItemBackgroundBorderless"
                     android:contentDescription="@string/share_logs"
@@ -59,13 +58,13 @@
                     app:layout_constraintEnd_toStartOf="@id/settings_icon"
                     app:layout_constraintTop_toTopOf="@id/title_text"
                     app:srcCompat="@drawable/ic_log"
-                    app:tint="?android:attr/textColorSecondary" />
+                    app:tint="?attr/colorOnBackground" />
 
                 <ImageView
                     android:id="@+id/settings_icon"
+                    style="@style/Widget.Material3.Button.IconButton.Filled"
                     android:layout_width="30dp"
                     android:layout_height="30dp"
-                    android:layout_gravity="center_vertical"
                     android:layout_marginEnd="16dp"
                     android:background="?attr/selectableItemBackgroundBorderless"
                     android:contentDescription="@string/settings"
@@ -74,11 +73,11 @@
                     app:layout_constraintEnd_toEndOf="parent"
                     app:layout_constraintTop_toTopOf="@id/title_text"
                     app:srcCompat="@drawable/ic_settings"
-                    app:tint="?android:attr/textColorSecondary" />
+                    app:tint="?attr/colorOnBackground" />
 
                 <ImageView
                     android:id="@+id/title_text"
-                    android:layout_width="85dp"
+                    android:layout_width="0dp"
                     android:layout_height="24dp"
                     android:layout_marginStart="16dp"
                     android:layout_marginTop="16dp"
@@ -89,8 +88,7 @@
                     app:layout_constraintHorizontal_bias="0.0"
                     app:layout_constraintStart_toStartOf="@id/search_bar"
                     app:layout_constraintTop_toTopOf="parent"
-                    app:srcCompat="@drawable/skyline_text"
+                    app:srcCompat="@drawable/skyline_text" />
-                    app:tint="?android:attr/textColorPrimary" />
 
                 <TextView
                     android:id="@+id/sub_text"
@@ -100,20 +98,21 @@
                     android:letterSpacing="0.1"
                     android:text="@string/emulator"
                     android:textAllCaps="true"
+                    android:textColor="?attr/colorOnBackground"
                     android:textSize="12sp"
                     app:layout_constraintStart_toStartOf="@+id/title_text"
                     app:layout_constraintTop_toBottomOf="@id/title_text" />
 
                 <emu.skyline.views.SearchBarView
                     android:id="@+id/search_bar"
+                    style="@style/Widget.Material3.CardView.Elevated"
                     android:layout_width="match_parent"
-                    android:layout_height="64dp"
+                    android:layout_height="72dp"
-                    android:layout_marginStart="10dp"
+                    android:layout_marginHorizontal="8dp"
-                    android:layout_marginTop="10dp"
+                    android:layout_marginTop="8dp"
-                    android:layout_marginEnd="10dp"
+                    app:cardUseCompatPadding="true"
-                    app:cardCornerRadius="@dimen/cornerRadiusMedium"
+                    app:layout_constraintTop_toBottomOf="@id/sub_text"
-                    app:cardElevation="2dp"
+                    app:shapeAppearance="@style/ShapeAppearance.Material3.Corner.ExtraLarge" />
-                    app:layout_constraintTop_toBottomOf="@id/sub_text" />
             </androidx.constraintlayout.widget.ConstraintLayout>
         </com.google.android.material.appbar.CollapsingToolbarLayout>
     </com.google.android.material.appbar.AppBarLayout>

app/src/main/res/layout/on_screen_edit_mini_fab.xml

@@ -4,9 +4,8 @@
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
-    app:backgroundTint="?attr/colorPrimary"
-    app:ensureMinTouchTargetSize="false"
     android:layout_margin="4dp"
+    app:ensureMinTouchTargetSize="false"
     app:fabSize="mini"
-    app:tint="@android:color/white"
+    app:shapeAppearance="@style/ShapeAppearance.Material3.Corner.ExtraLarge"
     tools:ignore="ContentDescription" />

app/src/main/res/layout/rumble_dialog.xml

@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
     android:id="@+id/rumble_layout"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
@@ -14,14 +15,13 @@
 
     <TextView
         android:id="@+id/rumble_title"
+        style="?attr/textAppearanceBodyLarge"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="center_horizontal"
         android:animateLayoutChanges="true"
         android:text="@string/press_any_button"
-        android:textAlignment="center"
+        android:textAlignment="center" />
-        android:textAppearance="@style/TextAppearance.AppCompat.Display1"
-        android:textSize="16sp" />
 
     <RelativeLayout
         android:id="@+id/rumble_controller"
@@ -68,23 +68,22 @@
         android:gravity="end"
         android:orientation="horizontal">
 
+        <Button
+            android:id="@+id/rumble_reset"
+            style="@style/Widget.Material3.Button.TonalButton"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginEnd="10dp"
+            android:text="@string/reset" />
+
         <Button
             android:id="@+id/rumble_builtin"
-            style="@style/Widget.MaterialComponents.Button.OutlinedButton"
+            style="@style/Widget.Material3.Button"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_marginEnd="10dp"
             android:text="@string/builtin"
-            android:textColor="?attr/colorAccent"
+            android:visibility="gone"
-            android:visibility="gone" />
+            tools:visibility="visible" />
-
-        <Button
-            android:id="@+id/rumble_reset"
-            style="@style/Widget.MaterialComponents.Button.OutlinedButton"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginEnd="10dp"
-            android:text="@string/reset"
-            android:textColor="?attr/colorAccent" />
     </LinearLayout>
 </LinearLayout>

app/src/main/res/layout/section_item.xml

@@ -2,11 +2,10 @@
 <TextView xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
     android:id="@+id/text_title"
+    style="?attr/textAppearanceTitleLarge"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_marginHorizontal="16dp"
     android:layout_marginVertical="8dp"
     android:textAlignment="viewStart"
-    android:textAppearance="@style/SectionTitle"
-    android:textSize="18sp"
     tools:text="NSP" />

app/src/main/res/layout/stick_dialog.xml

@@ -16,26 +16,23 @@
 
     <TextView
         android:id="@+id/stick_title"
+        style="?attr/textAppearanceHeadlineSmall"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="start"
         android:layout_marginBottom="10dp"
         android:animateLayoutChanges="true"
-        android:text="@string/stick_button"
+        android:text="@string/stick_button" />
-        android:textAppearance="@style/TextAppearance.AppCompat.Display1"
-        android:textColor="?android:attr/textColorPrimary"
-        android:textSize="16sp" />
 
     <TextView
         android:id="@+id/stick_subtitle"
+        style="?attr/textAppearanceBodyLarge"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="center_horizontal"
         android:animateLayoutChanges="true"
         android:text="@string/use_button_axis"
-        android:textAlignment="center"
+        android:textAlignment="center" />
-        android:textAppearance="@style/TextAppearance.AppCompat.Display1"
-        android:textSize="16sp" />
 
     <RelativeLayout
         android:id="@+id/stick_circle_container"
@@ -112,19 +109,17 @@
 
         <Button
             android:id="@+id/stick_reset"
-            style="@style/Widget.MaterialComponents.Button.OutlinedButton"
+            style="@style/Widget.Material3.Button.TonalButton"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_marginEnd="10dp"
-            android:text="@string/reset"
+            android:text="@string/reset" />
-            android:textColor="?attr/colorAccent" />
 
         <Button
             android:id="@+id/stick_next"
-            style="@style/Widget.MaterialComponents.Button.OutlinedButton"
+            style="@style/Widget.Material3.Button"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:text="@string/next"
+            android:text="@string/next" />
-            android:textColor="?attr/colorAccent" />
     </LinearLayout>
 </LinearLayout>

app/src/main/res/layout/view_search_bar.xml

@@ -4,13 +4,15 @@
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    tools:parentTag="com.google.android.material.card.MaterialCardView">
+    tools:parentTag="com.google.android.material.card.MaterialCardView"
+    tools:style="@style/Widget.Material3.CardView.Elevated">
 
     <androidx.constraintlayout.widget.ConstraintLayout
         android:id="@+id/motion_layout"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         app:motionProgress="1"
+        tools:style="@style/Widget.Material3.SearchBar"
         tools:motionDebug="SHOW_ALL">
 
         <ImageView

app/src/main/res/values-night/colors.xml

@@ -1,8 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="colorPrimary">#FF4285F4</color>
-    <color name="backgroundColor">#FF121212</color>
-    <color name="backgroundColorVariant">#323232</color>
-    <color name="dividerColor">@android:color/white</color>
     <color name="onBackgroundLight">#1AFFFFFF</color>
 </resources>

app/src/main/res/values-night/themes.xml

@@ -1,8 +1,37 @@
 <?xml version="1.0" encoding="utf-8"?>
-<resources xmlns:tools="http://schemas.android.com/tools">
+<resources>
+    <style name="ColorAppTheme" parent="Theme.Material3.Dark.NoActionBar">
+        <item name="colorPrimary">@color/md_theme_dark_primary</item>
+        <item name="colorOnPrimary">@color/md_theme_dark_onPrimary</item>
+        <item name="colorPrimaryContainer">@color/md_theme_dark_primaryContainer</item>
+        <item name="colorOnPrimaryContainer">@color/md_theme_dark_onPrimaryContainer</item>
+        <item name="colorSecondary">@color/md_theme_dark_secondary</item>
+        <item name="colorOnSecondary">@color/md_theme_dark_onSecondary</item>
+        <item name="colorSecondaryContainer">@color/md_theme_dark_secondaryContainer</item>
+        <item name="colorOnSecondaryContainer">@color/md_theme_dark_onSecondaryContainer</item>
+        <item name="colorTertiary">@color/md_theme_dark_tertiary</item>
+        <item name="colorOnTertiary">@color/md_theme_dark_onTertiary</item>
+        <item name="colorTertiaryContainer">@color/md_theme_dark_tertiaryContainer</item>
+        <item name="colorOnTertiaryContainer">@color/md_theme_dark_onTertiaryContainer</item>
+        <item name="colorError">@color/md_theme_dark_error</item>
+        <item name="colorErrorContainer">@color/md_theme_dark_errorContainer</item>
+        <item name="colorOnError">@color/md_theme_dark_onError</item>
+        <item name="colorOnErrorContainer">@color/md_theme_dark_onErrorContainer</item>
+        <item name="android:colorBackground">@color/md_theme_dark_background</item>
+        <item name="colorOnBackground">@color/md_theme_dark_onBackground</item>
+        <item name="colorSurface">@color/md_theme_dark_surface</item>
+        <item name="colorOnSurface">@color/md_theme_dark_onSurface</item>
+        <item name="colorSurfaceVariant">@color/md_theme_dark_surfaceVariant</item>
+        <item name="colorOnSurfaceVariant">@color/md_theme_dark_onSurfaceVariant</item>
+        <item name="colorOutline">@color/md_theme_dark_outline</item>
+        <item name="colorOutlineVariant">@color/md_theme_dark_outlineVariant</item>
+        <item name="colorOnSurfaceInverse">@color/md_theme_dark_inverseOnSurface</item>
+        <item name="colorSurfaceInverse">@color/md_theme_dark_inverseSurface</item>
+        <item name="colorPrimaryInverse">@color/md_theme_dark_inversePrimary</item>
+    </style>
 
     <style name="AppTheme" parent="BaseAppTheme">
-        <item name="android:windowLightNavigationBar" tools:targetApi="o_mr1">false</item>
+        <item name="android:windowLightNavigationBar">false</item>
         <item name="android:windowLightStatusBar">false</item>
     </style>
 </resources>

app/src/main/res/values/colors.xml

@@ -1,12 +1,71 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
     <color name="logoBackground">#121212</color>
-    <color name="colorPrimary">#FF1E58F0</color>
-    <color name="backgroundColor">@android:color/white</color>
-    <color name="backgroundColorVariant">#F8F8F8</color>
-    <color name="dividerColor">@android:color/black</color>
     <color name="onBackgroundLight">#1E000000</color>
 
     <color name="colorPerfStatsPrimary">#9FFFFF00</color>
     <color name="colorPerfStatsSecondary">#9F00FFFF</color>
+
+    <color name="seed">#1973E7</color>
+    <color name="md_theme_light_primary">#005BBF</color>
+    <color name="md_theme_light_onPrimary">#FFFFFF</color>
+    <color name="md_theme_light_primaryContainer">#D7E2FF</color>
+    <color name="md_theme_light_onPrimaryContainer">#001A40</color>
+    <color name="md_theme_light_secondary">#565E71</color>
+    <color name="md_theme_light_onSecondary">#FFFFFF</color>
+    <color name="md_theme_light_secondaryContainer">#DAE2F9</color>
+    <color name="md_theme_light_onSecondaryContainer">#131B2C</color>
+    <color name="md_theme_light_tertiary">#715574</color>
+    <color name="md_theme_light_onTertiary">#FFFFFF</color>
+    <color name="md_theme_light_tertiaryContainer">#FBD7FC</color>
+    <color name="md_theme_light_onTertiaryContainer">#29132D</color>
+    <color name="md_theme_light_error">#BA1A1A</color>
+    <color name="md_theme_light_errorContainer">#FFDAD6</color>
+    <color name="md_theme_light_onError">#FFFFFF</color>
+    <color name="md_theme_light_onErrorContainer">#410002</color>
+    <color name="md_theme_light_background">#FEFBFF</color>
+    <color name="md_theme_light_onBackground">#1B1B1F</color>
+    <color name="md_theme_light_surface">#FEFBFF</color>
+    <color name="md_theme_light_onSurface">#1B1B1F</color>
+    <color name="md_theme_light_surfaceVariant">#E1E2EC</color>
+    <color name="md_theme_light_onSurfaceVariant">#44474F</color>
+    <color name="md_theme_light_outline">#74777F</color>
+    <color name="md_theme_light_inverseOnSurface">#F2F0F4</color>
+    <color name="md_theme_light_inverseSurface">#2F3033</color>
+    <color name="md_theme_light_inversePrimary">#ACC7FF</color>
+    <color name="md_theme_light_shadow">#000000</color>
+    <color name="md_theme_light_surfaceTint">#005BBF</color>
+    <color name="md_theme_light_outlineVariant">#C4C6D0</color>
+    <color name="md_theme_light_scrim">#000000</color>
+
+    <color name="md_theme_dark_primary">#ACC7FF</color>
+    <color name="md_theme_dark_onPrimary">#002E68</color>
+    <color name="md_theme_dark_primaryContainer">#004492</color>
+    <color name="md_theme_dark_onPrimaryContainer">#D7E2FF</color>
+    <color name="md_theme_dark_secondary">#BEC6DC</color>
+    <color name="md_theme_dark_onSecondary">#283041</color>
+    <color name="md_theme_dark_secondaryContainer">#3F4759</color>
+    <color name="md_theme_dark_onSecondaryContainer">#DAE2F9</color>
+    <color name="md_theme_dark_tertiary">#DEBCDF</color>
+    <color name="md_theme_dark_onTertiary">#402844</color>
+    <color name="md_theme_dark_tertiaryContainer">#583E5B</color>
+    <color name="md_theme_dark_onTertiaryContainer">#FBD7FC</color>
+    <color name="md_theme_dark_error">#FFB4AB</color>
+    <color name="md_theme_dark_errorContainer">#93000A</color>
+    <color name="md_theme_dark_onError">#690005</color>
+    <color name="md_theme_dark_onErrorContainer">#FFDAD6</color>
+    <color name="md_theme_dark_background">#1B1B1F</color>
+    <color name="md_theme_dark_onBackground">#E3E2E6</color>
+    <color name="md_theme_dark_surface">#1B1B1F</color>
+    <color name="md_theme_dark_onSurface">#E3E2E6</color>
+    <color name="md_theme_dark_surfaceVariant">#44474F</color>
+    <color name="md_theme_dark_onSurfaceVariant">#C4C6D0</color>
+    <color name="md_theme_dark_outline">#8E9099</color>
+    <color name="md_theme_dark_inverseOnSurface">#1B1B1F</color>
+    <color name="md_theme_dark_inverseSurface">#E3E2E6</color>
+    <color name="md_theme_dark_inversePrimary">#005BBF</color>
+    <color name="md_theme_dark_shadow">#000000</color>
+    <color name="md_theme_dark_surfaceTint">#ACC7FF</color>
+    <color name="md_theme_dark_outlineVariant">#44474F</color>
+    <color name="md_theme_dark_scrim">#000000</color>
 </resources>

app/src/main/res/values/styles.xml

@@ -1,56 +1,14 @@
 <?xml version="1.0" encoding="utf-8"?>
-<resources xmlns:tools="http://schemas.android.com/tools">
+<resources>
-    <style name="SectionTitle" parent="TextAppearance.MaterialComponents.Headline6">
+    <!-- Workaround for AndroidX PreferenceScreen since it doesn't use MaterialAlertDialogs -->
-        <item name="android:textSize">16sp</item>
+    <style name="ThemeOverlay.App.MaterialAlertDialog" parent="ThemeOverlay.Material3.MaterialAlertDialog">
-    </style>
+        <item name="dialogCornerRadius">28dp</item>
-
-    <style name="ShapeAppearance.App.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
         <item name="cornerFamily">rounded</item>
-        <item name="cornerSize">@dimen/cornerRadius</item>
+        <item name="android:colorBackground">?attr/colorSurface</item>
     </style>
 
-    <style name="ShapeAppearance.App.MediumComponent" parent="ShapeAppearance.MaterialComponents.MediumComponent">
+    <!-- Override of the MD3 Chip style to make text all caps -->
-        <item name="cornerFamily">rounded</item>
+    <style name="ChipChoice" parent="Widget.Material3.Chip.Filter.Elevated">
-        <item name="cornerSize">@dimen/cornerRadiusMedium</item>
-    </style>
-
-    <!-- android:elevation makes BottomSheetDialog background color brighter than it should be -->
-    <style name="ThemeOverlay.App.BottomSheetDialog" parent="ThemeOverlay.MaterialComponents.BottomSheetDialog">
-        <item name="bottomSheetStyle">@style/Widget.App.BottomSheet</item>
-    </style>
-    <style name="Widget.App.BottomSheet" parent="Widget.MaterialComponents.BottomSheet.Modal">
-        <item name="android:elevation">@null</item>
-        <item name="shapeAppearanceOverlay">@style/ShapeAppearance.App.BottomSheetDialog</item>
-    </style>
-
-    <style name="ShapeAppearance.App.BottomSheetDialog" parent="">
-        <item name="cornerSizeTopLeft">@dimen/cornerRadiusMedium</item>
-        <item name="cornerSizeTopRight">@dimen/cornerRadiusMedium</item>
-    </style>
-
-    <!-- Workaround for AndroidX Preference as it doesn't use MaterialAlertDialogBuilder -->
-    <style name="ThemeOverlay.App.MaterialAlertDialog" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
-        <item name="android:dialogCornerRadius">@dimen/cornerRadiusMedium</item>
-    </style>
-
-    <style name="ChipChoice.Material">
-        <item name="colorPrimary">@color/colorPrimary</item>
-        <item name="colorOnPrimary">@color/colorPrimary</item>
-    </style>
-
-    <style name="ChipChoice" parent="Widget.MaterialComponents.Chip.Choice">
         <item name="android:textAllCaps">true</item>
-        <item name="chipStartPadding">8dp</item>
-        <item name="chipEndPadding">8dp</item>
-        <item name="materialThemeOverlay">@style/ChipChoice.Material</item>
-        <item name="shapeAppearance">@style/ShapeAppearance.MaterialComponents.LargeComponent</item>
-    </style>
-
-    <style name="Widget.App.OutlinedCard" parent="Widget.MaterialComponents.CardView">
-        <item name="cardBackgroundColor">@android:color/transparent</item>
-        <item name="cardElevation">0dp</item>
-        <item name="strokeColor" tools:ignore="PrivateResource">@color/mtrl_btn_stroke_color_selector</item>
-        <item name="strokeWidth">1dp</item>
-        <item name="android:clickable">true</item>
     </style>
 </resources>

app/src/main/res/values/themes.xml

@@ -1,23 +1,44 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <style name="BaseAppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
+    <style name="ColorAppTheme" parent="Theme.Material3.Light.NoActionBar">
-        <item name="colorPrimary">@color/colorPrimary</item>
+        <item name="colorPrimary">@color/md_theme_light_primary</item>
-        <item name="colorOnPrimary">@android:color/white</item>
+        <item name="colorOnPrimary">@color/md_theme_light_onPrimary</item>
-        <item name="colorSecondary">@color/colorPrimary</item>
+        <item name="colorPrimaryContainer">@color/md_theme_light_primaryContainer</item>
-        <item name="colorOnSecondary">@android:color/white</item>
+        <item name="colorOnPrimaryContainer">@color/md_theme_light_onPrimaryContainer</item>
-        <item name="android:statusBarColor">@color/backgroundColor</item>
+        <item name="colorSecondary">@color/md_theme_light_secondary</item>
-        <item name="android:navigationBarColor">@android:color/transparent</item>
+        <item name="colorOnSecondary">@color/md_theme_light_onSecondary</item>
-        <item name="android:colorBackground">@color/backgroundColor</item>
+        <item name="colorSecondaryContainer">@color/md_theme_light_secondaryContainer</item>
-        <item name="colorBackgroundFloating">@color/backgroundColor</item>
+        <item name="colorOnSecondaryContainer">@color/md_theme_light_onSecondaryContainer</item>
-        <item name="colorSurface">@color/backgroundColor</item>
+        <item name="colorTertiary">@color/md_theme_light_tertiary</item>
+        <item name="colorOnTertiary">@color/md_theme_light_onTertiary</item>
+        <item name="colorTertiaryContainer">@color/md_theme_light_tertiaryContainer</item>
+        <item name="colorOnTertiaryContainer">@color/md_theme_light_onTertiaryContainer</item>
+        <item name="colorError">@color/md_theme_light_error</item>
+        <item name="colorErrorContainer">@color/md_theme_light_errorContainer</item>
+        <item name="colorOnError">@color/md_theme_light_onError</item>
+        <item name="colorOnErrorContainer">@color/md_theme_light_onErrorContainer</item>
+        <item name="android:colorBackground">@color/md_theme_light_background</item>
+        <item name="colorOnBackground">@color/md_theme_light_onBackground</item>
+        <item name="colorSurface">@color/md_theme_light_surface</item>
+        <item name="colorOnSurface">@color/md_theme_light_onSurface</item>
+        <item name="colorSurfaceVariant">@color/md_theme_light_surfaceVariant</item>
+        <item name="colorOnSurfaceVariant">@color/md_theme_light_onSurfaceVariant</item>
+        <item name="colorOutline">@color/md_theme_light_outline</item>
+        <item name="colorOutlineVariant">@color/md_theme_light_outlineVariant</item>
+        <item name="colorOnSurfaceInverse">@color/md_theme_light_inverseOnSurface</item>
+        <item name="colorSurfaceInverse">@color/md_theme_light_inverseSurface</item>
+        <item name="colorPrimaryInverse">@color/md_theme_light_inversePrimary</item>
+    </style>
 
+    <style name="BaseAppTheme" parent="ColorAppTheme">
+        <item name="android:statusBarColor">?android:attr/colorBackground</item>
+        <item name="android:navigationBarColor">@android:color/transparent</item>
         <item name="chipChoiceStyle">@style/ChipChoice</item>
 
+        <!-- Workaround for AndroidX PreferenceScreen since it doesn't use MaterialAlertDialogs -->
         <item name="alertDialogTheme">@style/ThemeOverlay.App.MaterialAlertDialog</item>
-        <item name="bottomSheetDialogTheme">@style/ThemeOverlay.App.BottomSheetDialog</item>
+        <!-- Workaround for AndroidX PreferenceScreen since it uses colorAccent as categories text color -->
-
+        <item name="colorAccent">?attr/colorPrimary</item>
-        <item name="shapeAppearanceSmallComponent">@style/ShapeAppearance.App.SmallComponent</item>
-        <item name="shapeAppearanceMediumComponent">@style/ShapeAppearance.App.MediumComponent</item>
     </style>
 
     <style name="AppTheme" parent="BaseAppTheme">