No issue - Adds basic tab theming

app/src/main/java/org/mozilla/fenix/home/tabs/TabsAdapter.kt

@@ -8,6 +8,7 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
+import androidx.core.content.ContextCompat
 import androidx.recyclerview.widget.DiffUtil
 import androidx.recyclerview.widget.RecyclerView
 import io.reactivex.Observer
@@ -21,7 +22,7 @@ import kotlinx.coroutines.Job
 import kotlinx.coroutines.launch
 import mozilla.components.browser.icons.BrowserIcons
 import mozilla.components.browser.icons.IconRequest
-import org.mozilla.fenix.DefaultThemeManager
+import org.jetbrains.anko.image
 import org.mozilla.fenix.R
 import org.mozilla.fenix.ext.increaseTapArea
 import kotlin.coroutines.CoroutineContext
@@ -60,7 +61,7 @@ class TabsAdapter(private val actionEmitter: Observer<TabsAction>) :
     override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
         when (holder) {
             is TabViewHolder -> {
-                holder.bindSession(sessions[position])
+                holder.bindSession(sessions[position], position)
             }
         }
     }
@@ -100,8 +101,9 @@ class TabsAdapter(private val actionEmitter: Observer<TabsAction>) :
             }
         }
 
-        fun bindSession(session: SessionViewState) {
+        fun bindSession(session: SessionViewState, position: Int) {
             this.session = session
+            updateTabBackground(position)
             updateUrl(session.url)
             updateSelected(session.selected)
         }
@@ -118,10 +120,12 @@ class TabsAdapter(private val actionEmitter: Observer<TabsAction>) :
         }
 
         fun updateSelected(selected: Boolean) {
-            if (selected)
-                DefaultThemeManager.resolveAttribute(R.attr.sessionBorderColor, view.context)
-            else
-                session_card.setCardBackgroundColor(view.context.getColor(android.R.color.transparent))
+            selected_border.visibility = if (selected) View.VISIBLE else View.GONE
+        }
+
+        fun updateTabBackground(id: Int) {
+            val background = availableBackgrounds[id % availableBackgrounds.size]
+            tab_background.image = ContextCompat.getDrawable(view.context, background)
         }
 
         companion object {
@@ -133,6 +137,9 @@ class TabsAdapter(private val actionEmitter: Observer<TabsAction>) :
     companion object {
         const val tab_url = "url"
         const val tab_selected = "selected"
+        private val availableBackgrounds = listOf(R.drawable.sessions_01, R.drawable.sessions_02,
+            R.drawable.sessions_03, R.drawable.sessions_04, R.drawable.sessions_05, R.drawable.sessions_06,
+            R.drawable.sessions_07, R.drawable.sessions_08)
     }
 }
 

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

@@ -4,6 +4,6 @@
    - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
 
 <shape xmlns:android="http://schemas.android.com/apk/res/android">
-    <solid android:color="?attr/sessionBackgroundColor"/>
-    <corners android:radius="8dp"/>
+    <corners android:radius="@dimen/tab_corner_radius"/>
+    <stroke android:width="@dimen/tab_border_width" android:color="?attr/sessionBorderColor"/>
 </shape>

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

@@ -9,7 +9,9 @@
         android:id="@+id/tabs_header"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_margin="16dp"
+        android:layout_marginTop="8dp"
+        android:layout_marginStart="16dp"
+        android:layout_marginEnd="8dp"
         android:visibility="gone">
 
         <TextView
@@ -52,8 +54,8 @@
         android:id="@+id/tabs_list"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_marginStart="16dp"
-        android:layout_marginEnd="16dp"/>
+        android:padding="16dp"
+        android:clipToPadding="false"/>
 
     <FrameLayout
         android:id="@+id/save_session_button"

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

@@ -9,29 +9,20 @@
     android:layout_height="wrap_content"
     android:layout_marginBottom="8dp"
     android:clipToPadding="false"
-    android:padding="10dp"
-    app:cardBackgroundColor="?attr/sessionBorderColor"
-    app:cardCornerRadius="10dp"
-    app:cardElevation="5dp"
-    app:cardUseCompatPadding="true">
+    app:cardCornerRadius="@dimen/tab_corner_radius"
+    app:cardElevation="5dp">
 
     <androidx.constraintlayout.widget.ConstraintLayout
         android:id="@+id/item_tab"
         android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:layout_margin="2dp"
-        android:background="@drawable/session_border"
-        android:paddingTop="10dp">
+        android:layout_height="match_parent">
 
         <ImageView
             android:id="@+id/favicon_image"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:contentDescription="@string/favicon_content_description"
-            android:paddingStart="10dp"
-            android:paddingEnd="10dp"
-            android:src="@drawable/ic_link"
-            android:tint="@android:color/black"
+            android:layout_margin="10dp"
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintTop_toTopOf="parent" />
 
@@ -39,15 +30,16 @@
             android:id="@+id/text_url"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
-            android:layout_marginBottom="4dp"
             android:ellipsize="end"
             android:maxLines="1"
             android:textColor="?attr/toolbarTextColor"
             android:textSize="18sp"
+            android:layout_marginTop="4dp"
+            android:layout_marginStart="10dp"
             app:layout_constraintEnd_toStartOf="@id/close_tab_button"
             app:layout_constraintHorizontal_bias="0"
             app:layout_constraintStart_toEndOf="@id/favicon_image"
-            app:layout_constraintTop_toTopOf="parent" />
+            app:layout_constraintTop_toTopOf="@id/favicon_image" />
 
         <ImageView
             android:id="@+id/close_tab_button"
@@ -56,18 +48,32 @@
             android:contentDescription="@string/close_tab"
             android:paddingEnd="10dp"
             android:src="@drawable/ic_close"
+            android:layout_marginTop="1dp"
+            app:layout_constraintTop_toTopOf="@id/text_url"
             app:layout_constraintBottom_toBottomOf="@id/text_url"
             app:layout_constraintEnd_toEndOf="parent" />
 
         <ImageView
+            android:id="@+id/tab_background"
             android:layout_width="0dp"
             android:layout_height="100dp"
-            android:background="@drawable/session_background"
+            android:layout_marginTop="10dp"
             android:focusable="false"
+            android:adjustViewBounds="false"
+            android:scaleType="centerCrop"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/text_url" />
+            app:layout_constraintTop_toBottomOf="@id/favicon_image" />
 
+        <View
+            android:id="@+id/selected_border"
+            android:layout_width="0dp"
+            android:layout_height="0dp"
+            android:background="@drawable/session_border"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintEnd_toEndOf="parent" />
     </androidx.constraintlayout.widget.ConstraintLayout>
 </androidx.cardview.widget.CardView>

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

@@ -22,7 +22,7 @@
     <color name="search_text">#0C0C0D</color>
     <color name="off_white">#f9f9fa</color>
     <color name="url_box_view">#E9E9ED</color>
-    <color name="session_border_color">#2f26c1</color>
+    <color name="session_border_color">@color/photonInk70</color>
 
     <color name="icons_light_mode">#20233E</color>
     <color name="icons_dark_mode">@color/off_white</color>

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

@@ -13,4 +13,6 @@
     <dimen name="library_item_icon_margin_vertical">8dp</dimen>
     <dimen name="history_favicon_width_height">40dp</dimen>
     <dimen name="session_card_padding">16dp</dimen>
+    <dimen name="tab_border_width">2dp</dimen>
+    <dimen name="tab_corner_radius">8dp</dimen>
 </resources>