Merge pull request #4 from archroid/master

Switched to MaterialDesign3;Ui/Ux changes.

.idea/misc.xml

@@ -5,12 +5,16 @@
       <map>
         <entry key="app/src/main/res/drawable/ic_close.xml" value="0.17135416666666667" />
         <entry key="app/src/main/res/drawable/ic_libretube_foreground.xml" value="0.17135416666666667" />
+        <entry key="app/src/main/res/drawable/ic_like.xml" value="0.329" />
         <entry key="app/src/main/res/drawable/ic_play.xml" value="0.17135416666666667" />
+        <entry key="app/src/main/res/drawable/ic_search.xml" value="0.329" />
         <entry key="app/src/main/res/drawable/ic_search2.xml" value="0.17135416666666667" />
+        <entry key="app/src/main/res/drawable/ic_settings.xml" value="0.186" />
+        <entry key="app/src/main/res/drawable/ic_share.xml" value="0.329" />
         <entry key="app/src/main/res/drawable/libretube.xml" value="0.17135416666666667" />
         <entry key="app/src/main/res/layout-land/fragment_player.xml" value="0.1" />
         <entry key="app/src/main/res/layout/activity_main.xml" value="0.17" />
-        <entry key="app/src/main/res/layout/activity_player.xml" value="0.1" />
+        <entry key="app/src/main/res/layout/activity_player.xml" value="0.27685185185185185" />
         <entry key="app/src/main/res/layout/channel_search_row.xml" value="0.33" />
         <entry key="app/src/main/res/layout/exo_styled_player_control_view.xml" value="0.12" />
         <entry key="app/src/main/res/layout/fragment_home.xml" value="0.16" />

app/build.gradle

@@ -35,7 +35,7 @@ android {
 dependencies {
     implementation 'androidx.appcompat:appcompat:1.4.0'
     implementation 'androidx.constraintlayout:constraintlayout:2.1.2'
-    implementation 'com.google.android.material:material:1.4.0'
+    implementation 'com.google.android.material:material:1.5.0-alpha04'
     implementation 'androidx.navigation:navigation-fragment-ktx:2.4.0-rc01'
     implementation 'androidx.navigation:navigation-ui-ktx:2.4.0-rc01'
     implementation 'androidx.legacy:legacy-support-v4:1.0.0'

app/src/main/java/com/github/libretube/MainActivity.kt

@@ -1,6 +1,7 @@
 package com.github.libretube
 
 import android.content.res.Configuration
+import android.content.res.Resources
 import androidx.appcompat.app.AppCompatActivity
 import android.os.Bundle
 import android.view.Menu
@@ -9,6 +10,7 @@ import android.view.View
 import android.widget.FrameLayout
 import androidx.appcompat.widget.Toolbar
 import androidx.constraintlayout.motion.widget.MotionLayout
+import androidx.core.text.HtmlCompat
 import androidx.fragment.app.Fragment
 import androidx.navigation.Navigation
 import com.google.android.material.bottomnavigation.BottomNavigationView
@@ -17,6 +19,7 @@ import androidx.navigation.ui.NavigationUI
 import androidx.navigation.ui.NavigationUI.onNavDestinationSelected
 import androidx.navigation.ui.setupWithNavController
 import com.google.android.exoplayer2.ExoPlayer
+import com.google.android.material.color.DynamicColors
 
 class MainActivity : AppCompatActivity() {
     lateinit var bottomNavigationView: BottomNavigationView
@@ -24,7 +27,9 @@ class MainActivity : AppCompatActivity() {
     var f = false
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
-        supportActionBar?.hide()
+
+        DynamicColors.applyToActivitiesIfAvailable(application)
+
 
         setContentView(R.layout.activity_main)
         bottomNavigationView = findViewById<BottomNavigationView>(R.id.bottomNav)
@@ -39,6 +44,16 @@ class MainActivity : AppCompatActivity() {
 
 
         toolbar = findViewById(R.id.toolbar)
+        val hexColor = String.format("#%06X", 0xFFFFFF and 0xcc322d)
+        val appName = HtmlCompat.fromHtml(
+            "Libre<span  style='color:$hexColor';>Tube</span>",
+            HtmlCompat.FROM_HTML_MODE_COMPACT
+        )
+        toolbar.setTitle(appName)
+
+        toolbar.setNavigationOnClickListener{
+            true
+        }
 
         toolbar.setOnMenuItemClickListener{
             when (it.itemId){
@@ -49,9 +64,6 @@ class MainActivity : AppCompatActivity() {
                     f = true
                     true
                 }
-                R.id.action_settings -> {
-                    true
-                }
             }
             false
         }
@@ -86,4 +98,4 @@ class MainActivity : AppCompatActivity() {
 
         }
     }
-}
+}

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

@@ -1,5 +1,8 @@
-<vector android:height="24dp" android:tint="#FFFFFF"
+<vector android:height="24dp"
     android:viewportHeight="24" android:viewportWidth="24"
+    android:tint="?attr/colorControlNormal"
     android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
     <path android:fillColor="@android:color/white" android:pathData="M15.5,14h-0.79l-0.28,-0.27C15.41,12.59 16,11.11 16,9.5 16,5.91 13.09,3 9.5,3S3,5.91 3,9.5 5.91,16 9.5,16c1.61,0 3.09,-0.59 4.23,-1.57l0.27,0.28v0.79l5,4.99L20.49,19l-4.99,-5zM9.5,14C7.01,14 5,11.99 5,9.5S7.01,5 9.5,5 14,7.01 14,9.5 11.99,14 9.5,14z"/>
+
+
 </vector>

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

@@ -1,5 +1,6 @@
-<vector android:height="24dp" android:tint="#FFFFFF"
+<vector android:height="24dp"    android:tint="?attr/colorControlNormal"
-    android:viewportHeight="24" android:viewportWidth="24"
+
+android:viewportHeight="24" android:viewportWidth="24"
     android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
     <path android:fillColor="@android:color/white" android:pathData="M19.14,12.94c0.04,-0.3 0.06,-0.61 0.06,-0.94c0,-0.32 -0.02,-0.64 -0.07,-0.94l2.03,-1.58c0.18,-0.14 0.23,-0.41 0.12,-0.61l-1.92,-3.32c-0.12,-0.22 -0.37,-0.29 -0.59,-0.22l-2.39,0.96c-0.5,-0.38 -1.03,-0.7 -1.62,-0.94L14.4,2.81c-0.04,-0.24 -0.24,-0.41 -0.48,-0.41h-3.84c-0.24,0 -0.43,0.17 -0.47,0.41L9.25,5.35C8.66,5.59 8.12,5.92 7.63,6.29L5.24,5.33c-0.22,-0.08 -0.47,0 -0.59,0.22L2.74,8.87C2.62,9.08 2.66,9.34 2.86,9.48l2.03,1.58C4.84,11.36 4.8,11.69 4.8,12s0.02,0.64 0.07,0.94l-2.03,1.58c-0.18,0.14 -0.23,0.41 -0.12,0.61l1.92,3.32c0.12,0.22 0.37,0.29 0.59,0.22l2.39,-0.96c0.5,0.38 1.03,0.7 1.62,0.94l0.36,2.54c0.05,0.24 0.24,0.41 0.48,0.41h3.84c0.24,0 0.44,-0.17 0.47,-0.41l0.36,-2.54c0.59,-0.24 1.13,-0.56 1.62,-0.94l2.39,0.96c0.22,0.08 0.47,0 0.59,-0.22l1.92,-3.32c0.12,-0.22 0.07,-0.47 -0.12,-0.61L19.14,12.94zM12,15.6c-1.98,0 -3.6,-1.62 -3.6,-3.6s1.62,-3.6 3.6,-3.6s3.6,1.62 3.6,3.6S13.98,15.6 12,15.6z"/>
 </vector>

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

@@ -8,23 +8,22 @@
     tools:context=".MainActivity"
     android:id="@+id/mainMotionLayout"
     >
-
+        <com.google.android.material.appbar.MaterialToolbar
-    <androidx.appcompat.widget.Toolbar
         android:id="@+id/toolbar"
         android:layout_width="match_parent"
-        android:layout_height="wrap_content"
+        android:layout_height="?attr/actionBarSize"
-        android:background="?attr/colorPrimary"
-        android:minHeight="?attr/actionBarSize"
-        android:theme="?attr/actionBarTheme"
         app:menu="@menu/action_bar"
+        app:titleCentered="true"
+        app:subtitleCentered="true"
         app:title="@string/app_name"
+            app:navigationIcon="@drawable/ic_settings"
+
         />
 
     <com.google.android.material.bottomnavigation.BottomNavigationView
         android:id="@+id/bottomNav"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:background="#fff"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"

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

@@ -22,7 +22,6 @@
         android:layout_marginStart="24dp"
         android:layout_marginTop="24dp"
         android:text="TextView"
-        android:textColor="#000000"
         android:textSize="16sp"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toEndOf="@+id/search_channel_image"
@@ -44,9 +43,9 @@
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginStart="24dp"
-        android:background="#00FFFFFF"
+        android:background="@android:color/transparent"
         android:text="@string/subscribe"
-        android:textColor="#DC1212"
+        android:textColor="@color/colorPrimary"
         app:layout_constraintStart_toEndOf="@+id/search_channel_image"
         app:layout_constraintTop_toBottomOf="@+id/search_views" />
 

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

@@ -2,25 +2,23 @@
 <com.github.libretube.SingleViewTouchableMotionLayout 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"
+    android:id="@+id/playerMotionLayout"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     app:layoutDescription="@xml/player_scene"
     tools:context=".PlayerFragment"
-    android:background="@android:color/transparent"
-    android:id="@+id/playerMotionLayout"
     >
 
     <ScrollView
         android:id="@+id/scrollView2"
         android:layout_width="match_parent"
         android:layout_height="0dp"
+        android:background="?attr/colorSurface"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintHorizontal_bias="0.5"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintTop_toBottomOf="@+id/main_container"
-        android:background="@color/white"
-
         >
 
         <LinearLayout
@@ -35,32 +33,31 @@
                 android:id="@+id/player_description"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:text="Description"
-                android:textColor="@color/black"
-                android:textSize="15sp"
-                android:textStyle="bold"
-                android:paddingRight="8dp"
                 android:paddingLeft="8dp"
-                />
+                android:paddingRight="8dp"
+                android:text="Description"
+                android:textSize="15sp"
+                android:layout_margin="7dp"
+                android:textStyle="bold" />
+
             <TextView
                 android:id="@+id/player_sub"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:text=""
-                android:paddingRight="8dp"
                 android:paddingLeft="8dp"
-                />
+                android:paddingRight="8dp"
+                android:text="" />
+
             <LinearLayout
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:orientation="horizontal"
-                android:weightSum="4"
+                android:weightSum="4">
-                >
+
                 <RelativeLayout
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
-                    android:layout_weight="1"
+                    android:layout_weight="1">
-                    >
 
                     <ImageView
                         android:id="@+id/player_like"
@@ -69,28 +66,28 @@
                         android:layout_centerInParent="true"
                         android:layout_marginBottom="16dp"
                         android:src="@drawable/ic_like" />
+
                     <TextView
+                        android:id="@+id/textLike"
                         android:layout_width="wrap_content"
                         android:layout_height="wrap_content"
-                        android:text="1K"
-                        android:id="@+id/textLike"
                         android:layout_below="@id/player_like"
-                        android:layout_centerHorizontal="true"/>
+                        android:layout_centerHorizontal="true"
+                        android:text="1K" />
                 </RelativeLayout>
+
                 <RelativeLayout
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
-                    android:layout_weight="1"
+                    android:layout_weight="1">
-                    >
 
                     <ImageView
+                        android:id="@+id/player_share"
                         android:layout_width="wrap_content"
                         android:layout_height="wrap_content"
-                        android:id="@+id/player_share"
-                        android:src="@drawable/ic_share"
                         android:layout_centerInParent="true"
                         android:layout_marginBottom="16dp"
-                        />
+                        android:src="@drawable/ic_share" />
 
                     <TextView
                         android:id="@+id/textShare"
@@ -100,66 +97,65 @@
                         android:layout_centerHorizontal="true"
                         android:text="@string/share" />
                 </RelativeLayout>
+
                 <RelativeLayout
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
-                    android:layout_weight="1"
+                    android:layout_weight="1">
-                    >
 
                     <ImageView
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
                         android:id="@+id/player_download"
-                        android:src="@drawable/ic_download"
-                        android:layout_centerInParent="true"
-                        android:layout_marginBottom="16dp"
-                        />
-                    <TextView
                         android:layout_width="wrap_content"
                         android:layout_height="wrap_content"
-                        android:text="@string/download"
+                        android:layout_centerInParent="true"
+                        android:layout_marginBottom="16dp"
+                        android:src="@drawable/ic_download" />
+
+                    <TextView
                         android:id="@+id/textDownload"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
                         android:layout_below="@id/player_download"
-                        android:layout_centerHorizontal="true"/>
+                        android:layout_centerHorizontal="true"
+                        android:text="@string/download" />
                 </RelativeLayout>
+
                 <RelativeLayout
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
-                    android:layout_weight="1"
+                    android:layout_weight="1">
-                    >
 
                     <ImageView
+                        android:id="@+id/player_save"
                         android:layout_width="wrap_content"
                         android:layout_height="wrap_content"
-                        android:id="@+id/player_save"
-                        android:src="@drawable/ic_save"
                         android:layout_centerInParent="true"
                         android:layout_marginBottom="16dp"
-                        />
+                        android:src="@drawable/ic_save" />
+
                     <TextView
+                        android:id="@+id/textSave"
                         android:layout_width="wrap_content"
                         android:layout_height="wrap_content"
-                        android:text="@string/save"
-                        android:id="@+id/textSave"
                         android:layout_below="@id/player_save"
-                        android:layout_centerHorizontal="true"/>
+                        android:layout_centerHorizontal="true"
+                        android:text="@string/save" />
                 </RelativeLayout>
             </LinearLayout>
+
             <RelativeLayout
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:layout_marginTop="8dp"
-                android:paddingRight="8dp"
                 android:paddingLeft="8dp"
-                >
+                android:paddingRight="8dp">
 
                 <de.hdodenhof.circleimageview.CircleImageView
                     android:id="@+id/player_channelImage"
                     android:layout_width="40dp"
                     android:layout_height="40dp"
                     android:layout_centerVertical="true"
-                    android:layout_marginRight="4dp"
+                    android:layout_marginRight="4dp" />
-                    />
 
                 <TextView
                     android:id="@+id/player_channelName"
@@ -168,7 +164,6 @@
                     android:layout_centerVertical="true"
                     android:layout_toRightOf="@+id/player_channelImage"
                     android:text=""
-                    android:textColor="@color/black"
                     android:textStyle="bold"
 
                     />
@@ -179,21 +174,22 @@
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:layout_alignParentRight="true"
-                    android:background="#00000000"
-                    android:text="SUBSCRIBE"
                     android:layout_centerVertical="true"
-                    />
+                    android:background="@android:color/transparent"
+                    android:text="SUBSCRIBE"
+                    android:textColor="@color/colorPrimary" />
             </RelativeLayout>
+
             <RelativeLayout
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:descendantFocusability="blocksDescendants">
-            <androidx.recyclerview.widget.RecyclerView
+
-                android:id="@+id/player_recView"
+                <androidx.recyclerview.widget.RecyclerView
-                android:layout_width="match_parent"
+                    android:id="@+id/player_recView"
-                android:layout_height="wrap_content"
+                    android:layout_width="match_parent"
-                android:nestedScrollingEnabled="false"
+                    android:layout_height="wrap_content"
-                />
+                    android:nestedScrollingEnabled="false" />
             </RelativeLayout>
         </LinearLayout>
     </ScrollView>
@@ -201,24 +197,25 @@
     <androidx.constraintlayout.widget.ConstraintLayout
         android:id="@+id/main_container"
         android:layout_width="match_parent"
-        android:layout_height="350dp"
+        android:layout_height="300dp"
-        android:background="#FFFFFF"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintHorizontal_bias="0.5"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent">
+        app:layout_constraintTop_toTopOf="parent"
-    </androidx.constraintlayout.widget.ConstraintLayout>
+        android:background="?attr/colorSurface"
+/>
 
     <com.github.libretube.CustomExoPlayerView
         android:id="@+id/player"
         android:layout_width="match_parent"
         android:layout_height="0dp"
-        android:background="@color/black"
         android:scaleType="centerCrop"
         app:layout_constraintBottom_toBottomOf="@id/main_container"
         app:layout_constraintStart_toStartOf="@id/main_container"
         app:layout_constraintTop_toTopOf="@id/main_container"
-        app:show_buffering="always" />
+        app:show_buffering="always"
+        android:background="?attr/colorSurface"
+        />
 
     <ImageView
         android:id="@+id/close_imageView"
@@ -226,12 +223,11 @@
         android:layout_height="wrap_content"
         android:layout_marginEnd="16dp"
         android:alpha="0"
-        app:layout_constraintBottom_toBottomOf="@id/main_container"
-        app:layout_constraintEnd_toEndOf="@id/main_container"
-        app:layout_constraintTop_toTopOf="@id/main_container"
         android:src="@drawable/ic_close"
         android:visibility="gone"
-        />
+        app:layout_constraintBottom_toBottomOf="@id/main_container"
+        app:layout_constraintEnd_toEndOf="@id/main_container"
+        app:layout_constraintTop_toTopOf="@id/main_container" />
 
     <ImageView
         android:id="@+id/play_imageView"
@@ -240,11 +236,10 @@
         android:layout_marginEnd="24dp"
         android:alpha="0"
         android:src="@drawable/ic_play"
+        android:visibility="gone"
         app:layout_constraintBottom_toBottomOf="@+id/close_imageView"
         app:layout_constraintEnd_toStartOf="@+id/close_imageView"
-        app:layout_constraintTop_toTopOf="@+id/close_imageView"
+        app:layout_constraintTop_toTopOf="@+id/close_imageView" />
-        android:visibility="gone"
-        />
 
     <TextView
         android:id="@+id/title_textView"
@@ -255,11 +250,10 @@
         android:alpha="0"
         android:ellipsize="end"
         android:maxLines="1"
+        android:visibility="gone"
         app:layout_constraintBottom_toBottomOf="@+id/play_imageView"
         app:layout_constraintEnd_toStartOf="@+id/play_imageView"
         app:layout_constraintStart_toEndOf="@+id/player"
-        app:layout_constraintTop_toTopOf="@+id/play_imageView"
+        app:layout_constraintTop_toTopOf="@+id/play_imageView" />
-        android:visibility="gone"
-        />
 
 </com.github.libretube.SingleViewTouchableMotionLayout>

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

@@ -6,29 +6,57 @@
     android:layout_height="match_parent"
     tools:context=".SearchFragment">
 
-    <AutoCompleteTextView
+    <com.google.android.material.textfield.TextInputLayout
-        android:id="@+id/autoCompleteTextView"
+        android:id="@+id/outlinedTextField"
-        android:layout_width="0dp"
+        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
+        android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_marginTop="7dp"
+        android:layout_margin="20dp"
-        android:hint="@string/search_hint"
+        app:hintEnabled="false"
-        android:imeOptions="actionSearch"
+        app:boxCornerRadiusBottomEnd="20dp"
-        android:inputType="text"
+        app:boxCornerRadiusBottomStart="20dp"
-        android:maxLines="1"
+        app:boxCornerRadiusTopEnd="20dp"
-        android:minHeight="48dp"
+        app:boxCornerRadiusTopStart="20dp"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent" />
+        app:layout_constraintTop_toTopOf="parent">
+
+        <AutoCompleteTextView
+            android:id="@+id/autoCompleteTextView"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:hint="Search"
+            android:imeOptions="actionSearch"
+            android:inputType="text"
+            android:maxLines="1"
+            android:padding="12dp" />
+
+    </com.google.android.material.textfield.TextInputLayout>
+
+    <!--    <com.google.android.material.textfield.MaterialAutoCompleteTextView-->
+    <!--        android:id="@+id/autoCompleteTextView"-->
+    <!--        android:layout_width="0dp"-->
+    <!--        android:layout_height="wrap_content"-->
+    <!--        android:layout_marginTop="7dp"-->
+    <!--        android:hint="@string/search_hint"-->
+    <!--        android:imeOptions="actionSearch"-->
+    <!--        android:inputType="text"-->
+    <!--        android:maxLines="1"-->
+    <!--        android:minHeight="48dp"-->
+    <!--        app:layout_constraintEnd_toEndOf="parent"-->
+    <!--        app:layout_constraintStart_toStartOf="parent"-->
+    <!--        app:layout_constraintTop_toTopOf="parent" />-->
 
 
     <androidx.recyclerview.widget.RecyclerView
         android:id="@+id/search_recycler"
         android:layout_width="0dp"
         android:layout_height="0dp"
-        android:layout_marginTop="8dp"
+        android:layout_margin="10dp"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@+id/autoCompleteTextView" />
+        app:layout_constraintTop_toBottomOf="@+id/outlinedTextField"
+        />
 
 </androidx.constraintlayout.widget.ConstraintLayout>

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

@@ -5,18 +5,28 @@
     android:layout_width="match_parent"
     android:layout_height="wrap_content">
 
-    <ImageView
+    <androidx.cardview.widget.CardView
-        android:id="@+id/thumbnail"
+        android:id="@+id/thumbnailcard"
         android:layout_width="0dp"
         android:layout_height="0dp"
         android:layout_marginStart="8dp"
         android:layout_marginTop="8dp"
         android:layout_marginEnd="8dp"
-        android:src="@mipmap/ic_launcher"
         app:layout_constraintDimensionRatio="16:9"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent" />
+        app:layout_constraintTop_toTopOf="parent"
+        app:cardCornerRadius="8dp"
+        android:elevation="10dp">
+
+        <ImageView
+            android:id="@+id/thumbnail"
+            android:src="@mipmap/ic_launcher"
+            android:layout_width="match_parent"
+            android:layout_height="match_parent"
+            />
+    </androidx.cardview.widget.CardView>
+
 
     <TextView
         android:id="@+id/textView_title"
@@ -26,12 +36,11 @@
         android:layout_marginTop="8dp"
         android:layout_marginEnd="8dp"
         android:text="Title"
-        android:textColor="#000000"
         android:textSize="15sp"
         android:textStyle="bold"
-        app:layout_constraintEnd_toEndOf="@+id/thumbnail"
+        app:layout_constraintEnd_toEndOf="@+id/thumbnailcard"
         app:layout_constraintStart_toEndOf="@+id/channel_image"
-        app:layout_constraintTop_toBottomOf="@+id/thumbnail" />
+        app:layout_constraintTop_toBottomOf="@+id/thumbnailcard" />
 
     <TextView
         android:id="@+id/textView_channel"
@@ -51,7 +60,7 @@
         android:layout_marginStart="8dp"
         android:layout_marginTop="8dp"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@+id/thumbnail"
+        app:layout_constraintTop_toBottomOf="@+id/thumbnailcard"
         app:srcCompat="@mipmap/ic_launcher" />
 
 </androidx.constraintlayout.widget.ConstraintLayout>

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

@@ -15,8 +15,9 @@
         android:layout_height="wrap_content"
         android:orientation="vertical"
         app:layout_constraintGuide_percent=".5"/>
-    <ImageView
+    <com.google.android.material.card.MaterialCardView
-        android:id="@+id/search_thumbnail"
+        android:id="@+id/card_search_thumbnail"
+        app:cardCornerRadius="20dp"
         android:layout_width="0dp"
         android:layout_height="0dp"
         app:layout_constraintBottom_toBottomOf="parent"
@@ -25,8 +26,14 @@
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintVertical_bias="0.0"
-        app:layout_constraintEnd_toStartOf="@+id/guideline"
+        app:layout_constraintEnd_toStartOf="@+id/guideline">
+
+    <ImageView
+        android:id="@+id/search_thumbnail"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
         tools:srcCompat="@tools:sample/backgrounds/scenic" />
+    </com.google.android.material.card.MaterialCardView>
 
     <TextView
         android:id="@+id/search_description"
@@ -34,9 +41,8 @@
         android:layout_height="wrap_content"
         android:layout_marginStart="8dp"
         android:text="TextView"
-        android:textColor="#000000"
         app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintStart_toEndOf="@+id/search_thumbnail"
+        app:layout_constraintStart_toEndOf="@+id/card_search_thumbnail"
         app:layout_constraintTop_toTopOf="parent" />
 
     <TextView
@@ -46,7 +52,7 @@
         android:layout_marginStart="8dp"
         android:text="TextView"
         app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintStart_toEndOf="@+id/search_thumbnail"
+        app:layout_constraintStart_toEndOf="@+id/card_search_thumbnail"
         app:layout_constraintTop_toBottomOf="@+id/search_description" />
 
     <de.hdodenhof.circleimageview.CircleImageView

app/src/main/res/menu/action_bar.xml

@@ -7,9 +7,5 @@
         android:id="@+id/action_search"
         app:showAsAction="always"
         />
-    <item android:title="Settings"
+
-        android:icon="@drawable/ic_settings"
-        android:id="@+id/action_settings"
-        app:showAsAction="ifRoom"
-        />
 </menu>

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

@@ -1,10 +1,35 @@
 <resources xmlns:tools="http://schemas.android.com/tools">
-    <!-- Base application theme. -->
+
-    <style name="Theme.LibreTube" parent="Theme.AppCompat.Light.DarkActionBar">
+    <style name="Theme.LibreTube" parent="Theme.Material3.Dark.NoActionBar">
-        <!-- Primary brand color. -->
+        <item name="colorPrimary">@color/md_theme_dark_primary</item>
-        <item name="colorPrimary">#cc322d</item>
+        <item name="colorOnPrimary">@color/md_theme_dark_onPrimary</item>
-        <item name="colorPrimaryDark">#BA2E2A</item>
+        <item name="colorPrimaryContainer">@color/md_theme_dark_primaryContainer</item>
-        <item name="colorAccent">#2F3133</item>
+        <item name="colorOnPrimaryContainer">@color/md_theme_dark_onPrimaryContainer</item>
-        <!-- Customize your theme here. -->
+        <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="colorOnSurfaceInverse">@color/md_theme_dark_inverseOnSurface</item>
+        <item name="colorSurfaceInverse">@color/md_theme_dark_inverseSurface</item>
+        <item name="colorPrimaryInverse">@color/md_theme_dark_primaryInverse</item>
+
+        <item name="android:statusBarColor">@android:color/transparent</item>
+        <item name="android:windowLightStatusBar" tools:targetApi="m">false</item>
+        <item name="android:navigationBarColor">#342625</item>
     </style>
 </resources>

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

@@ -1,10 +1,61 @@
-<?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="purple_200">#FFBB86FC</color>
+
-    <color name="purple_500">#FF6200EE</color>
+    <color name="black">#000000</color>
-    <color name="purple_700">#FF3700B3</color>
+    <color name="white">#ffffff</color>
-    <color name="teal_200">#FF03DAC5</color>
+
-    <color name="teal_700">#FF018786</color>
+    <color name="colorPrimary">#B81B3B</color>
-    <color name="black">#FF000000</color>
+    <color name="md_theme_light_primary">#B81B3B</color>
-    <color name="white">#FFFFFFFF</color>
+    <color name="md_theme_light_onPrimary">#FFFFFF</color>
+    <color name="md_theme_light_primaryContainer">#FFDADC</color>
+    <color name="md_theme_light_onPrimaryContainer">#40000B</color>
+    <color name="md_theme_light_secondary">#9C4145</color>
+    <color name="md_theme_light_onSecondary">#FFFFFF</color>
+    <color name="md_theme_light_secondaryContainer">#FFD9DA</color>
+    <color name="md_theme_light_onSecondaryContainer">#400008</color>
+    <color name="md_theme_light_tertiary">#98470F</color>
+    <color name="md_theme_light_onTertiary">#FFFFFF</color>
+    <color name="md_theme_light_tertiaryContainer">#FFDBC8</color>
+    <color name="md_theme_light_onTertiaryContainer">#341100</color>
+    <color name="md_theme_light_error">#BA1B1B</color>
+    <color name="md_theme_light_errorContainer">#FFDAD4</color>
+    <color name="md_theme_light_onError">#FFFFFF</color>
+    <color name="md_theme_light_onErrorContainer">#410001</color>
+    <color name="md_theme_light_background">#FCFCFC</color>
+    <color name="md_theme_light_onBackground">#201A1A</color>
+    <color name="md_theme_light_surface">#FCFCFC</color>
+    <color name="md_theme_light_onSurface">#201A1A</color>
+    <color name="md_theme_light_surfaceVariant">#F4DDDD</color>
+    <color name="md_theme_light_onSurfaceVariant">#524343</color>
+    <color name="md_theme_light_outline">#847373</color>
+    <color name="md_theme_light_inverseOnSurface">#FBEDED</color>
+    <color name="md_theme_light_inverseSurface">#362F2F</color>
+    <color name="md_theme_light_primaryInverse">#FFB3B8</color>
+    <color name="md_theme_dark_primary">#FFB3B8</color>
+    <color name="md_theme_dark_onPrimary">#680018</color>
+    <color name="md_theme_dark_primaryContainer">#920026</color>
+    <color name="md_theme_dark_onPrimaryContainer">#FFDADC</color>
+    <color name="md_theme_dark_secondary">#FFB2B3</color>
+    <color name="md_theme_dark_onSecondary">#60131B</color>
+    <color name="md_theme_dark_secondaryContainer">#7D2A2F</color>
+    <color name="md_theme_dark_onSecondaryContainer">#FFD9DA</color>
+    <color name="md_theme_dark_tertiary">#FFB68C</color>
+    <color name="md_theme_dark_onTertiary">#552100</color>
+    <color name="md_theme_dark_tertiaryContainer">#783200</color>
+    <color name="md_theme_dark_onTertiaryContainer">#FFDBC8</color>
+    <color name="md_theme_dark_error">#FFB4A9</color>
+    <color name="md_theme_dark_errorContainer">#930006</color>
+    <color name="md_theme_dark_onError">#680003</color>
+    <color name="md_theme_dark_onErrorContainer">#FFDAD4</color>
+    <color name="md_theme_dark_background">#201A1A</color>
+    <color name="md_theme_dark_onBackground">#ECDFDF</color>
+    <color name="md_theme_dark_surface">#201A1A</color>
+    <color name="md_theme_dark_onSurface">#ECDFDF</color>
+    <color name="md_theme_dark_surfaceVariant">#524343</color>
+    <color name="md_theme_dark_onSurfaceVariant">#D7C2C2</color>
+    <color name="md_theme_dark_outline">#9F8C8C</color>
+    <color name="md_theme_dark_inverseOnSurface">#201A1A</color>
+    <color name="md_theme_dark_inverseSurface">#ECDFDF</color>
+    <color name="md_theme_dark_primaryInverse">#B81B3B</color>
+    <color name="seed">#BD1F3E</color>
+    <color name="error">#BA1B1B</color>
 </resources>

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

@@ -1,10 +1,35 @@
 <resources xmlns:tools="http://schemas.android.com/tools">
-    <!-- Base application theme. -->
+
-    <style name="Theme.LibreTube" parent="Theme.AppCompat.Light.DarkActionBar">
+    <style name="Theme.LibreTube" parent="Theme.Material3.Light.NoActionBar">
-        <!-- Primary brand color. -->
+        <item name="colorPrimary">@color/md_theme_light_primary</item>
-        <item name="colorPrimary">#cc322d</item>
+        <item name="colorOnPrimary">@color/md_theme_light_onPrimary</item>
-        <item name="colorPrimaryDark">#BA2E2A</item>
+        <item name="colorPrimaryContainer">@color/md_theme_light_primaryContainer</item>
-        <item name="colorAccent">#2F3133</item>
+        <item name="colorOnPrimaryContainer">@color/md_theme_light_onPrimaryContainer</item>
-        <!-- Customize your theme here. -->
+        <item name="colorSecondary">@color/md_theme_light_secondary</item>
+        <item name="colorOnSecondary">@color/md_theme_light_onSecondary</item>
+        <item name="colorSecondaryContainer">@color/md_theme_light_secondaryContainer</item>
+        <item name="colorOnSecondaryContainer">@color/md_theme_light_onSecondaryContainer</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="colorOnSurfaceInverse">@color/md_theme_light_inverseOnSurface</item>
+        <item name="colorSurfaceInverse">@color/md_theme_light_inverseSurface</item>
+        <item name="colorPrimaryInverse">@color/md_theme_light_primaryInverse</item>
+
+        <item name="android:statusBarColor">@android:color/transparent</item>
+        <item name="android:windowLightStatusBar" tools:targetApi="m">true</item>
+        <item name="android:navigationBarColor">#f5e9eb</item>
     </style>
 </resources>