diff --git a/app/src/main/java/eu/kanade/tachiyomi/ui/catalogue/browse/CatalogueGridHolder.kt b/app/src/main/java/eu/kanade/tachiyomi/ui/catalogue/browse/CatalogueGridHolder.kt
index e65ba70715..62ce45198f 100644
--- a/app/src/main/java/eu/kanade/tachiyomi/ui/catalogue/browse/CatalogueGridHolder.kt
+++ b/app/src/main/java/eu/kanade/tachiyomi/ui/catalogue/browse/CatalogueGridHolder.kt
@@ -16,6 +16,7 @@ import eu.kanade.tachiyomi.util.view.gone
 import eu.kanade.tachiyomi.util.view.updatePaddingRelative
 import eu.kanade.tachiyomi.widget.StateImageViewTarget
 import kotlinx.android.synthetic.main.catalogue_grid_item.*
+import kotlinx.android.synthetic.main.unread_download_badge.*
 
 /**
  * Class used to hold the displayed data of a manga in the library, like the cover or the title.
@@ -42,12 +43,7 @@ class CatalogueGridHolder(
         subtitle.gone()
         title.gone()
         compact_title.text = manga.currentTitle()
-
-        badge_view.visibility = if (manga.favorite) View.VISIBLE else View.GONE
-        unread_angle.visibility = View.GONE
-        unread_text.updatePaddingRelative(start = 5.dpToPx)
-        unread_text.visibility = if (manga.favorite) View.VISIBLE else View.GONE
-        unread_text.text = itemView.resources.getText(R.string.in_library)
+        badge_view.setInLibrary(manga.favorite)
 
         // Update the cover.
         setImage(manga)
diff --git a/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryBadge.kt b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryBadge.kt
new file mode 100644
index 0000000000..878648da3a
--- /dev/null
+++ b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryBadge.kt
@@ -0,0 +1,63 @@
+package eu.kanade.tachiyomi.ui.library
+
+import android.content.Context
+import android.graphics.Color
+import android.util.AttributeSet
+import android.view.View
+import com.google.android.material.card.MaterialCardView
+import eu.kanade.tachiyomi.R
+import eu.kanade.tachiyomi.util.system.dpToPx
+import eu.kanade.tachiyomi.util.system.getResourceColor
+import eu.kanade.tachiyomi.util.view.updatePaddingRelative
+import kotlinx.android.synthetic.main.unread_download_badge.view.*
+
+class LibraryBadge @JvmOverloads constructor(context: Context, attrs: AttributeSet? = null):
+    MaterialCardView(context, attrs) {
+
+    fun setUnreadDownload(unread: Int, downloads: Int) {
+        // Update the unread count and its visibility.
+        with(unread_text) {
+            text = if (unread == -1) "0" else unread.toString()
+            setTextColor(if (unread == -1) context.getResourceColor(android.R.attr.colorAccent)
+            else Color.WHITE)
+            visibility = when {
+                unread > 0 || unread == -1 -> View.VISIBLE
+                else -> View.GONE
+            }
+        }
+
+        // Update the download count or local status and its visibility.
+        with(download_text) {
+            visibility = if (downloads == -2 || downloads > 0)  View.VISIBLE else View.GONE
+            text = if (downloads == -2)
+                resources.getString(R.string.local_source_badge)
+            else downloads.toString()
+        }
+
+        // Show the bade card if unread or downloads exists
+        badge_view.visibility = if (download_text.visibility == View.VISIBLE || unread_text
+                .visibility != View.GONE) View.VISIBLE else View.GONE
+
+        // Show the angles divider if both unread and downloads exists
+        unread_angle.visibility = if (download_text.visibility == View.VISIBLE && unread_text
+                .visibility != View.GONE) View.VISIBLE else View.GONE
+
+        if (unread_angle.visibility == View.VISIBLE) {
+            download_text.updatePaddingRelative(end = 8.dpToPx)
+            unread_text.updatePaddingRelative(start = 2.dpToPx)
+        }
+        else {
+            download_text.updatePaddingRelative(end = 5.dpToPx)
+            unread_text.updatePaddingRelative(start = 5.dpToPx)
+        }
+    }
+
+    fun setInLibrary(inLibrary: Boolean) {
+        badge_view.visibility = if (inLibrary) View.VISIBLE else View.GONE
+        unread_angle.visibility = View.GONE
+        unread_text.updatePaddingRelative(start = 5.dpToPx)
+        unread_text.visibility = if (inLibrary) View.VISIBLE else View.GONE
+        unread_text.text = resources.getText(R.string.in_library)
+    }
+
+}
\ No newline at end of file
diff --git a/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryController.kt b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryController.kt
index fe61d1df81..f7dd6e7c2c 100644
--- a/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryController.kt
+++ b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryController.kt
@@ -241,12 +241,12 @@ class LibraryController(
         super.onActivityResumed(activity)
         if (observeLater) {
             presenter.getLibrary()
-            observeLater = false
         }
     }
 
     override fun onActivityPaused(activity: Activity) {
         super.onActivityPaused(activity)
+        observeLater = true
         presenter.onDestroy()
     }
 
@@ -674,7 +674,6 @@ class LibraryController(
         val chapter = presenter.getFirstUnread(manga) ?: return
         val intent = ReaderActivity.newIntent(activity, manga, chapter)
         destroyActionModeIfNeeded()
-        observeLater = true
         startActivity(intent)
     }
 }
diff --git a/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryGridHolder.kt b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryGridHolder.kt
index 50e10e9603..f3e068784e 100644
--- a/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryGridHolder.kt
+++ b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryGridHolder.kt
@@ -1,9 +1,10 @@
 package eu.kanade.tachiyomi.ui.library
 
+import android.view.Gravity
 import android.view.View
 import android.view.ViewTreeObserver
+import android.widget.FrameLayout
 import androidx.constraintlayout.widget.ConstraintLayout
-import com.bumptech.glide.Glide
 import com.bumptech.glide.load.engine.DiskCacheStrategy
 import com.bumptech.glide.signature.ObjectKey
 import eu.kanade.tachiyomi.R
@@ -15,6 +16,7 @@ import eu.kanade.tachiyomi.util.view.gone
 import eu.kanade.tachiyomi.util.view.updatePaddingRelative
 import eu.kanade.tachiyomi.util.view.visible
 import kotlinx.android.synthetic.main.catalogue_grid_item.*
+import kotlinx.android.synthetic.main.unread_download_badge.*
 
 /**
  * Class used to hold the displayed data of a manga in the library, like the cover or the title.
@@ -66,42 +68,15 @@ class LibraryGridHolder(
 
         compact_title.text = title.text
 
-        // Update the unread count and its visibility.
-        val unread = item.manga.unread
-
-        with(unread_text) {
-            text = unread.toString()
-            visibility = if (unread > 0) View.VISIBLE else View.GONE
-        }
-
-        // Update the download count or local status and its visibility.
-        with(download_text) {
-            visibility = if (item.downloadCount > -1 && (item.downloadCount > 0 || item.manga
-                    .source == LocalSource.ID))
-                View.VISIBLE else View.GONE
-            text = if (item.manga.source == LocalSource.ID)
-                itemView.resources.getString(R.string.local_source_badge)
-            else item.downloadCount.toString()
-        }
-
-        // Show the bade card if unread or downloads exists
-        badge_view.visibility = if (download_text.visibility == View.VISIBLE || unread_text
-        .visibility == View.VISIBLE) View.VISIBLE else View.GONE
-
-        // Show the angles divider if both unread and downloads exists
-        unread_angle.visibility = if (download_text.visibility == View.VISIBLE && unread_text
-                .visibility == View.VISIBLE) View.VISIBLE else View.GONE
-
-        if (unread_angle.visibility == View.VISIBLE) {
-            download_text.updatePaddingRelative(end = 8.dpToPx)
-            unread_text.updatePaddingRelative(start = 2.dpToPx)
-        }
-        else {
-            download_text.updatePaddingRelative(end = 5.dpToPx)
-            unread_text.updatePaddingRelative(start = 5.dpToPx)
-        }
-
-        play_layout.visibility = if (unread > 0) View.VISIBLE else View.GONE
+        badge_view.setUnreadDownload(
+            when (item.unreadType) {
+                1 -> item.manga.unread
+                0 -> if (item.manga.unread > 0) -1 else -2
+                else -> -2
+            },
+            if (item.manga.source == LocalSource.ID) -2 else item.downloadCount)
+        play_layout.visibility = if (item.manga.unread > 0 && item.unreadType > -1)
+            View.VISIBLE else View.GONE
         play_layout.setOnClickListener { playButtonClicked() }
 
         if (fixedSize) {
@@ -111,6 +86,12 @@ class LibraryGridHolder(
         else {
             compact_title.gone()
             gradient.gone()
+            val playLayout = play_layout.layoutParams as FrameLayout.LayoutParams
+            val buttonLayout = play_button.layoutParams as FrameLayout.LayoutParams
+            playLayout.gravity = Gravity.BOTTOM or Gravity.END
+            buttonLayout.gravity = Gravity.BOTTOM or Gravity.END
+            play_layout.layoutParams = playLayout
+            play_button.layoutParams = buttonLayout
         }
 
         // Update the cover.
diff --git a/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryItem.kt b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryItem.kt
index 270296f60d..40ca970d36 100644
--- a/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryItem.kt
+++ b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryItem.kt
@@ -46,7 +46,7 @@ class LibraryItem(val manga: LibraryManga, private val libraryLayout: Preference
                         ViewGroup.LayoutParams.WRAP_CONTENT
                     )
                     val marginParams = card.layoutParams as ConstraintLayout.LayoutParams
-                    marginParams.bottomMargin = 10.dpToPx
+                    marginParams.bottomMargin = 6.dpToPx
                     card.layoutParams = marginParams
                     constraint_layout.minHeight = 0
                     cover_thumbnail.adjustViewBounds = false
diff --git a/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryListHolder.kt b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryListHolder.kt
index e347fab9d7..d0dfc81710 100644
--- a/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryListHolder.kt
+++ b/app/src/main/java/eu/kanade/tachiyomi/ui/library/LibraryListHolder.kt
@@ -1,30 +1,16 @@
 package eu.kanade.tachiyomi.ui.library
 
-import android.text.Html
 import android.view.View
-import androidx.core.content.ContextCompat
-import androidx.core.text.HtmlCompat
 import com.bumptech.glide.Glide
 import com.bumptech.glide.load.engine.DiskCacheStrategy
-import eu.kanade.tachiyomi.data.glide.GlideApp
-import eu.kanade.tachiyomi.source.LocalSource
-import kotlinx.android.synthetic.main.catalogue_list_item.*
 import com.bumptech.glide.signature.ObjectKey
 import eu.kanade.tachiyomi.R
 import eu.kanade.tachiyomi.data.database.models.MangaImpl
-import eu.kanade.tachiyomi.util.system.dpToPx
-import eu.kanade.tachiyomi.util.system.getResourceColor
-import eu.kanade.tachiyomi.util.view.updatePaddingRelative
-import kotlinx.android.synthetic.main.catalogue_grid_item.*
-import kotlinx.android.synthetic.main.catalogue_list_item.badge_view
-import kotlinx.android.synthetic.main.catalogue_list_item.cover_thumbnail
-import kotlinx.android.synthetic.main.catalogue_list_item.download_text
-import kotlinx.android.synthetic.main.catalogue_list_item.play_layout
-import kotlinx.android.synthetic.main.catalogue_list_item.subtitle
-import kotlinx.android.synthetic.main.catalogue_list_item.title
-import kotlinx.android.synthetic.main.catalogue_list_item.unread_angle
-import kotlinx.android.synthetic.main.catalogue_list_item.unread_text
+import eu.kanade.tachiyomi.data.glide.GlideApp
+import eu.kanade.tachiyomi.source.LocalSource
+import kotlinx.android.synthetic.main.catalogue_list_item.*
 import kotlinx.android.synthetic.main.catalogue_list_item.view.*
+import kotlinx.android.synthetic.main.unread_download_badge.*
 
 /**
  * Class used to hold the displayed data of a manga in the library, like the cover or the title.
@@ -51,63 +37,16 @@ class LibraryListHolder(
         // Update the title of the manga.
         title.text = item.manga.currentTitle()
 
-        // Update the unread count and its visibility.
-        val unread = item.manga.unread
+        badge_view.setUnreadDownload(
+            if (item.unreadType == 1) item.manga.unread else (item.unreadType - 1),
+            if (item.manga.source == LocalSource.ID) -2 else item.downloadCount)
 
-        with(unread_text) {
-            text = unread.toString()
-            visibility = if (unread > 0) View.VISIBLE else View.GONE
-        }
-
-        // Update the download count or local status and its visibility.
-        with(download_text) {
-            visibility = if (item.downloadCount > -1 && (item.downloadCount > 0 || item.manga
-                    .source == LocalSource.ID))
-                View.VISIBLE else View.GONE
-            text = if (item.manga.source == LocalSource.ID)
-                itemView.resources.getString(R.string.local_source_badge)
-            else item.downloadCount.toString()
-        }
-
-        // Show the bade card if unread or downloads exists
-        badge_view.visibility = if (download_text.visibility == View.VISIBLE || unread_text
-                .visibility == View.VISIBLE) View.VISIBLE else View.GONE
-
-        // Show the angles divider if both unread and downloads exists
-        unread_angle.visibility = if (download_text.visibility == View.VISIBLE && unread_text
-                .visibility == View.VISIBLE) View.VISIBLE else View.GONE
-
-        if (unread_angle.visibility == View.VISIBLE) {
-            download_text.updatePaddingRelative(end = 8.dpToPx)
-            unread_text.updatePaddingRelative(start = 2.dpToPx)
-        }
-        else {
-            download_text.updatePaddingRelative(end = 5.dpToPx)
-            unread_text.updatePaddingRelative(start = 5.dpToPx)
-        }
-
-        /* if (item.downloadCount > 0 || item.manga.source == LocalSource.ID) {
-            val downloadColor = convertColor(ContextCompat.getColor(itemView.context,
-                if (item.manga.source == LocalSource.ID) R.color.md_teal_500
-                else R.color.md_red_500))
-            val unreadColor = convertColor(itemView.context.getResourceColor(R.attr.colorAccent))
-            when {
-                unread > 0 && item.unreadType > -1 -> "<font color=" +
-                    "#$downloadColor>$downloadText</font> | " +
-                    "<font color=#$unreadColor>$subtitleText</font>"
-                subtitleText != null -> "<font color=#$downloadColor>$downloadText</font>  |  " +
-                    subtitleText
-                else ->  "<font color=#$downloadColor>$downloadText</font>"
-            }
-        }*/
-        /*else {
-            subtitleText
-        }*/
         subtitle.text = item.manga.originalAuthor()?.trim()
         subtitle.visibility = if (!item.manga.originalAuthor().isNullOrBlank()) View.VISIBLE
         else View.GONE
 
-        play_layout.visibility = if (unread > 0) View.VISIBLE else View.GONE
+        play_layout.visibility = if (item.manga.unread > 0 && item.unreadType > -1)
+            View.VISIBLE else View.GONE
         play_layout.setOnClickListener { playButtonClicked() }
 
         // Update the cover.
diff --git a/app/src/main/res/drawable/library_compact_grid_selector.xml b/app/src/main/res/drawable/library_compact_grid_selector.xml
index 3475ccd592..0adab55903 100644
--- a/app/src/main/res/drawable/library_compact_grid_selector.xml
+++ b/app/src/main/res/drawable/library_compact_grid_selector.xml
@@ -3,7 +3,7 @@
     android:color="@color/fullRippleColor">
     <item android:id="@android:id/mask"
         android:top="4dp"
-        android:bottom="4dp"
+        android:bottom="0dp"
         android:left="2dp"
         android:right="2dp">
         <shape android:shape="rectangle">
@@ -13,7 +13,7 @@
     </item>
     <item
         android:top="4dp"
-        android:bottom="4dp"
+        android:bottom="0dp"
         android:left="2dp"
         android:right="2dp">
         <selector>
diff --git a/app/src/main/res/layout-land/filter_bottom_sheet.xml b/app/src/main/res/layout-land/filter_bottom_sheet.xml
index e49983463f..9c4dd58e13 100644
--- a/app/src/main/res/layout-land/filter_bottom_sheet.xml
+++ b/app/src/main/res/layout-land/filter_bottom_sheet.xml
@@ -179,7 +179,7 @@
                             android:focusable="true"
                             android:gravity="start|center"
                             android:padding="5dp"
-                            android:text="@string/action_display_unread_text"
+                            android:text="@string/action_display_unread_badge"
                             android:textAppearance="@style/TextAppearance.MaterialComponents.Body2"
                             android:textColor="?android:attr/textColorPrimary"
                             android:textSize="15sp"
diff --git a/app/src/main/res/layout-sw600dp/filter_bottom_sheet.xml b/app/src/main/res/layout-sw600dp/filter_bottom_sheet.xml
index b6f8a247ad..2033f44aad 100644
--- a/app/src/main/res/layout-sw600dp/filter_bottom_sheet.xml
+++ b/app/src/main/res/layout-sw600dp/filter_bottom_sheet.xml
@@ -179,7 +179,7 @@
                             android:focusable="true"
                             android:gravity="start|center"
                             android:padding="5dp"
-                            android:text="@string/action_display_unread_text"
+                            android:text="@string/action_display_unread_badge"
                             android:textAppearance="@style/TextAppearance.MaterialComponents.Body2"
                             android:textColor="?android:attr/textColorPrimary"
                             android:textSize="15sp"
diff --git a/app/src/main/res/layout/catalogue_grid_item.xml b/app/src/main/res/layout/catalogue_grid_item.xml
index 5b9ff67578..2128388604 100644
--- a/app/src/main/res/layout/catalogue_grid_item.xml
+++ b/app/src/main/res/layout/catalogue_grid_item.xml
@@ -63,6 +63,7 @@
                     android:layout_height="30dp"
                     android:layout_gravity="end"
                     android:layout_marginTop="6dp"
+                    android:layout_marginBottom="6dp"
                     android:layout_marginEnd="6dp"
                     android:background="@drawable/round_play_background"
                     android:contentDescription="@string/start_reading"
@@ -114,75 +115,11 @@
             android:layout_height="10dp"
             app:layout_constraintTop_toTopOf="@+id/card"/>
 
-        <com.google.android.material.card.MaterialCardView
-            android:id="@+id/badge_view"
+        <include layout="@layout/unread_download_badge"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            app:cardCornerRadius="10dp"
-            app:cardElevation="5dp"
-            android:layout_marginStart="2dp"
-            android:layout_marginTop="5dp"
             app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintBottom_toBottomOf="@id/badge_guide"
-            android:visibility="gone"
-            tools:visibility="visible">
-
-            <androidx.constraintlayout.widget.ConstraintLayout
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content">
-
-                <com.google.android.material.textview.MaterialTextView
-                    android:id="@+id/download_text"
-                    style="@style/TextAppearance.Regular.Caption.Light"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:background="@color/pale_green"
-                    android:gravity="center"
-                    android:maxLines="1"
-                    android:paddingStart="5dp"
-                    android:paddingEnd="5dp"
-                    android:textColor="@color/md_black_1000"
-                    android:textSize="13sp"
-                    android:visibility="gone"
-                    app:layout_constraintBottom_toBottomOf="parent"
-                    app:layout_constraintStart_toStartOf="parent"
-                    app:layout_constraintTop_toTopOf="parent"
-                    tools:text="1"
-                    tools:paddingEnd="8dp"
-                    tools:visibility="visible" />
-
-                <ImageView
-                    android:id="@+id/unread_angle"
-                    android:layout_width="10dp"
-                    android:scaleType="fitXY"
-                    android:layout_height="0dp"
-                    android:src="@drawable/unread_angled_badge"
-                    app:layout_constraintBottom_toBottomOf="@+id/unread_text"
-                    app:layout_constraintEnd_toStartOf="@id/unread_text"
-                    app:layout_constraintTop_toTopOf="@+id/unread_text" />
-
-                <com.google.android.material.textview.MaterialTextView
-                    android:id="@+id/unread_text"
-                    style="@style/TextAppearance.Regular.Caption.Light"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:background="@color/colorAccent"
-                    android:gravity="center"
-                    android:maxLines="1"
-                    android:paddingStart="5dp"
-                    android:paddingEnd="5dp"
-                    android:textColor="@color/md_white_1000"
-                    android:textSize="13sp"
-                    android:visibility="gone"
-                    app:layout_constraintBottom_toBottomOf="@+id/download_text"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    app:layout_constraintStart_toEndOf="@id/download_text"
-                    app:layout_constraintTop_toTopOf="@+id/download_text"
-                    tools:text="20"
-                    tools:visibility="visible"
-                    tools:paddingStart="2dp"/>
-            </androidx.constraintlayout.widget.ConstraintLayout>
-        </com.google.android.material.card.MaterialCardView>
+            app:layout_constraintBottom_toBottomOf="@id/badge_guide"/>
 
         <com.google.android.material.textview.MaterialTextView
             android:id="@+id/title"
diff --git a/app/src/main/res/layout/catalogue_list_item.xml b/app/src/main/res/layout/catalogue_list_item.xml
index 7296000213..f3bfdbf921 100644
--- a/app/src/main/res/layout/catalogue_list_item.xml
+++ b/app/src/main/res/layout/catalogue_list_item.xml
@@ -113,76 +113,16 @@
         app:layout_constraintVertical_bias="0.0"
         tools:text="Manga artist" />
 
-    <com.google.android.material.card.MaterialCardView
-        android:id="@+id/badge_view"
+
+    <include layout="@layout/unread_download_badge"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginStart="2dp"
+        android:layout_marginTop="0dp"
         android:layout_marginEnd="12dp"
-        android:visibility="gone"
-        app:cardCornerRadius="10dp"
         app:layout_constraintEnd_toEndOf="parent"
-        app:cardElevation="5dp"
         app:layout_constraintBottom_toBottomOf="parent"
-        app:layout_constraintTop_toTopOf="parent"
-        tools:visibility="visible">
-
-        <androidx.constraintlayout.widget.ConstraintLayout
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content">
-
-            <com.google.android.material.textview.MaterialTextView
-                android:id="@+id/download_text"
-                style="@style/TextAppearance.Regular.Caption.Light"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:background="@color/pale_green"
-                android:gravity="center"
-                android:maxLines="1"
-                android:paddingStart="5dp"
-                android:paddingEnd="5dp"
-                android:textColor="@color/md_black_1000"
-                android:textSize="13sp"
-                android:visibility="gone"
-                app:layout_constraintBottom_toBottomOf="parent"
-                app:layout_constraintStart_toStartOf="parent"
-                app:layout_constraintTop_toTopOf="parent"
-                tools:paddingEnd="8dp"
-                tools:text="1"
-                tools:visibility="visible" />
-
-            <ImageView
-                android:id="@+id/unread_angle"
-                android:layout_width="10dp"
-                android:layout_height="0dp"
-                android:scaleType="fitXY"
-                android:src="@drawable/unread_angled_badge"
-                app:layout_constraintBottom_toBottomOf="@+id/unread_text"
-                app:layout_constraintEnd_toStartOf="@id/unread_text"
-                app:layout_constraintTop_toTopOf="@+id/unread_text" />
-
-            <com.google.android.material.textview.MaterialTextView
-                android:id="@+id/unread_text"
-                style="@style/TextAppearance.Regular.Caption.Light"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:background="@color/colorAccent"
-                android:gravity="center"
-                android:maxLines="1"
-                android:paddingStart="5dp"
-                android:paddingEnd="5dp"
-                android:textColor="@color/md_white_1000"
-                android:textSize="13sp"
-                android:visibility="gone"
-                app:layout_constraintBottom_toBottomOf="@+id/download_text"
-                app:layout_constraintEnd_toEndOf="parent"
-                app:layout_constraintStart_toEndOf="@id/download_text"
-                app:layout_constraintTop_toTopOf="@+id/download_text"
-                tools:paddingStart="2dp"
-                tools:text="20"
-                tools:visibility="visible" />
-        </androidx.constraintlayout.widget.ConstraintLayout>
-    </com.google.android.material.card.MaterialCardView>
+        app:layout_constraintTop_toTopOf="parent"/>
 
     <androidx.constraintlayout.widget.Barrier
         android:id="@+id/bottom_line"
diff --git a/app/src/main/res/layout/filter_bottom_sheet.xml b/app/src/main/res/layout/filter_bottom_sheet.xml
index 9080a69040..5f299c8c3c 100644
--- a/app/src/main/res/layout/filter_bottom_sheet.xml
+++ b/app/src/main/res/layout/filter_bottom_sheet.xml
@@ -177,7 +177,7 @@
                                 android:focusable="true"
                                 android:gravity="start|center"
                                 android:padding="5dp"
-                                android:text="@string/action_display_unread_text"
+                                android:text="@string/action_display_unread_badge"
                                 android:textAppearance="@style/TextAppearance.MaterialComponents.Body2"
                                 android:textColor="?android:attr/textColorPrimary"
                                 android:textSize="15sp"
diff --git a/app/src/main/res/layout/unread_download_badge.xml b/app/src/main/res/layout/unread_download_badge.xml
new file mode 100644
index 0000000000..da7d29cc5a
--- /dev/null
+++ b/app/src/main/res/layout/unread_download_badge.xml
@@ -0,0 +1,70 @@
+<?xml version="1.0" encoding="utf-8"?>
+<eu.kanade.tachiyomi.ui.library.LibraryBadge 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/badge_view"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    app:cardCornerRadius="10dp"
+    app:cardElevation="5dp"
+    android:layout_marginStart="2dp"
+    android:layout_marginTop="5dp"
+    android:visibility="gone"
+    tools:visibility="visible">
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content">
+
+        <com.google.android.material.textview.MaterialTextView
+            android:id="@+id/download_text"
+            style="@style/TextAppearance.Regular.Caption.Light"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:background="@color/pale_green"
+            android:gravity="center"
+            android:maxLines="1"
+            android:paddingStart="5dp"
+            android:paddingEnd="5dp"
+            android:textColor="@color/md_black_1000"
+            android:textSize="13sp"
+            android:visibility="gone"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent"
+            tools:text="1"
+            tools:paddingEnd="8dp"
+            tools:visibility="visible" />
+
+        <ImageView
+            android:id="@+id/unread_angle"
+            android:layout_width="10dp"
+            android:scaleType="fitXY"
+            android:layout_height="0dp"
+            android:src="@drawable/unread_angled_badge"
+            app:layout_constraintBottom_toBottomOf="@+id/unread_text"
+            app:layout_constraintEnd_toStartOf="@id/unread_text"
+            app:layout_constraintTop_toTopOf="@+id/unread_text" />
+
+        <com.google.android.material.textview.MaterialTextView
+            android:id="@+id/unread_text"
+            style="@style/TextAppearance.Regular.Caption.Light"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:background="@color/colorAccent"
+            android:gravity="center"
+            android:maxLines="1"
+            android:paddingStart="5dp"
+            android:paddingEnd="5dp"
+            android:textColor="@color/md_white_1000"
+            android:textSize="13sp"
+            android:visibility="gone"
+            app:layout_constraintBottom_toBottomOf="@+id/download_text"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toEndOf="@id/download_text"
+            app:layout_constraintTop_toTopOf="@+id/download_text"
+            tools:text="20"
+            tools:visibility="visible"
+            tools:paddingStart="2dp"/>
+    </androidx.constraintlayout.widget.ConstraintLayout>
+</eu.kanade.tachiyomi.ui.library.LibraryBadge>
\ No newline at end of file
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 465ff0826f..0f4df3cf4e 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -94,11 +94,11 @@
     <string name="action_add_to_home_screen">Add to home screen</string>
     <string name="action_display_mode">Display mode</string>
     <string name="action_display">Display</string>
-    <string name="action_display_comfy_grid">Comfy Grid</string>
+    <string name="action_display_comfy_grid">Comfortable</string>
     <string name="action_display_grid">Compact Grid</string>
     <string name="action_display_list">List</string>
     <string name="action_display_download_badge">Download badges</string>
-    <string name="action_display_unread_text">Unread text</string>
+    <string name="action_display_unread_badge">Unread badges</string>
     <string name="action_display_all_unread">All unread</string>
     <string name="action_display_any_unread">Any unread</string>
     <string name="action_display_hide_unread">Hide unread</string>