Update details activity

app/src/main/kotlin/org/koitharu/kotatsu/bookmarks/ui/BookmarksFragment.kt

@@ -30,7 +30,7 @@ import org.koitharu.kotatsu.core.util.ext.observe
 import org.koitharu.kotatsu.core.util.ext.observeEvent
 import org.koitharu.kotatsu.databinding.FragmentListSimpleBinding
 import org.koitharu.kotatsu.details.ui.DetailsActivity
-import org.koitharu.kotatsu.list.ui.MangaListSpanResolver
+import org.koitharu.kotatsu.list.ui.GridSpanResolver
 import org.koitharu.kotatsu.list.ui.adapter.ListHeaderClickListener
 import org.koitharu.kotatsu.list.ui.adapter.ListItemType
 import org.koitharu.kotatsu.list.ui.adapter.ListStateHolderListener
@@ -86,7 +86,7 @@ class BookmarksFragment :
 		val spanSizeLookup = SpanSizeLookup()
 		with(binding.recyclerView) {
 			setHasFixedSize(true)
-			val spanResolver = MangaListSpanResolver(resources)
+			val spanResolver = GridSpanResolver(resources)
 			addItemDecoration(TypedListSpacingDecoration(context, false))
 			adapter = bookmarksAdapter
 			addOnLayoutChangeListener(spanResolver)

app/src/main/kotlin/org/koitharu/kotatsu/bookmarks/ui/sheet/BookmarksSheet.kt

@@ -25,7 +25,7 @@ import org.koitharu.kotatsu.core.util.ext.plus
 import org.koitharu.kotatsu.core.util.ext.showDistinct
 import org.koitharu.kotatsu.core.util.ext.withArgs
 import org.koitharu.kotatsu.databinding.SheetPagesBinding
-import org.koitharu.kotatsu.list.ui.MangaListSpanResolver
+import org.koitharu.kotatsu.list.ui.GridSpanResolver
 import org.koitharu.kotatsu.list.ui.adapter.ListItemType
 import org.koitharu.kotatsu.list.ui.adapter.TypedListSpacingDecoration
 import org.koitharu.kotatsu.list.ui.model.ListModel
@@ -53,7 +53,7 @@ class BookmarksSheet :
 	lateinit var settings: AppSettings
 
 	private var bookmarksAdapter: BookmarksAdapter? = null
-	private var spanResolver: MangaListSpanResolver? = null
+	private var spanResolver: GridSpanResolver? = null
 
 	private val spanSizeLookup = SpanSizeLookup()
 	private val listCommitCallback = Runnable {
@@ -67,7 +67,7 @@ class BookmarksSheet :
 	override fun onViewBindingCreated(binding: SheetPagesBinding, savedInstanceState: Bundle?) {
 		super.onViewBindingCreated(binding, savedInstanceState)
 		addSheetCallback(this)
-		spanResolver = MangaListSpanResolver(binding.root.resources)
+		spanResolver = GridSpanResolver(binding.root.resources)
 		bookmarksAdapter = BookmarksAdapter(
 			coil = coil,
 			lifecycleOwner = viewLifecycleOwner,

app/src/main/kotlin/org/koitharu/kotatsu/core/ui/sheet/BaseAdaptiveSheet.kt

@@ -9,6 +9,7 @@ import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
 import android.view.ViewGroup.LayoutParams
+import androidx.activity.ComponentDialog
 import androidx.activity.OnBackPressedDispatcher
 import androidx.annotation.CallSuper
 import androidx.appcompat.app.AppCompatDialog
@@ -52,7 +53,7 @@ abstract class BaseAdaptiveSheet<B : ViewBinding> : AppCompatDialogFragment() {
 		get() = behavior?.state == AdaptiveSheetBehavior.STATE_EXPANDED
 
 	val onBackPressedDispatcher: OnBackPressedDispatcher
-		get() = requireComponentDialog().onBackPressedDispatcher
+		get() = (dialog as? ComponentDialog)?.onBackPressedDispatcher ?: requireActivity().onBackPressedDispatcher
 
 	var isLocked = false
 		private set

app/src/main/kotlin/org/koitharu/kotatsu/details/ui/DetailsActivity.kt

@@ -71,6 +71,7 @@ import java.lang.ref.WeakReference
 import javax.inject.Inject
 import com.google.android.material.R as materialR
 
+@Deprecated("")
 @AndroidEntryPoint
 class DetailsActivity :
 	BaseActivity<ActivityDetailsBinding>(),

app/src/main/kotlin/org/koitharu/kotatsu/details/ui/DetailsActivity2.kt

@@ -12,6 +12,7 @@ import android.transition.TransitionManager
 import android.view.Menu
 import android.view.MenuItem
 import android.view.View
+import android.view.ViewGroup.MarginLayoutParams
 import android.view.ViewTreeObserver
 import android.widget.Toast
 import androidx.activity.viewModels
@@ -22,6 +23,7 @@ import androidx.core.text.inSpans
 import androidx.core.text.method.LinkMovementMethodCompat
 import androidx.core.view.isGone
 import androidx.core.view.isVisible
+import androidx.core.view.updateLayoutParams
 import androidx.core.view.updatePadding
 import androidx.swiperefreshlayout.widget.CircularProgressDrawable
 import coil.ImageLoader
@@ -133,7 +135,7 @@ class DetailsActivity2 :
 		viewBinding.buttonRead.setOnClickListener(this)
 		viewBinding.buttonRead.setOnLongClickListener(this)
 		viewBinding.buttonRead.setOnContextClickListenerCompat(this)
-		viewBinding.buttonChapters.setOnClickListener(this)
+		viewBinding.buttonChapters?.setOnClickListener(this)
 		viewBinding.infoLayout.chipBranch.setOnClickListener(this)
 		viewBinding.infoLayout.chipSize.setOnClickListener(this)
 		viewBinding.infoLayout.chipSource.setOnClickListener(this)
@@ -155,7 +157,7 @@ class DetailsActivity2 :
 		)
 		TitleScrollCoordinator(viewBinding.textViewTitle).attach(viewBinding.scrollView)
 
-		chaptersBadge = ViewBadge(viewBinding.buttonChapters, this)
+		chaptersBadge = ViewBadge(viewBinding.buttonChapters ?: viewBinding.buttonRead, this)
 
 		viewModel.details.filterNotNull().observe(this, ::onMangaUpdated)
 		viewModel.onMangaRemoved.observeEvent(this, ::onMangaRemoved)
@@ -426,7 +428,7 @@ class DetailsActivity2 :
 	}
 
 	private fun onLoadingStateChanged(isLoading: Boolean) {
-		val button = viewBinding.buttonChapters
+		val button = viewBinding.buttonChapters ?: return
 		if (isLoading) {
 			button.setImageDrawable(
 				CircularProgressDrawable(this).also {
@@ -507,7 +509,7 @@ class DetailsActivity2 :
 					.enqueueWith(coil)
 			}
 
-			buttonChapters.isEnabled = hasChapters
+			buttonChapters?.isEnabled = hasChapters
 			title = manga.title
 			buttonRead.isEnabled = hasChapters
 			invalidateOptionsMenu()
@@ -527,7 +529,14 @@ class DetailsActivity2 :
 		viewBinding.root.updatePadding(
 			left = insets.left,
 			right = insets.right,
-			bottom = insets.bottom
+		)
+		viewBinding.cardChapters?.updateLayoutParams<MarginLayoutParams> {
+			val baseOffset = leftMargin
+			bottomMargin = insets.bottom + baseOffset
+			topMargin = insets.bottom + baseOffset
+		}
+		viewBinding.scrollView.updatePadding(
+			bottom = insets.bottom,
 		)
 	}
 

app/src/main/kotlin/org/koitharu/kotatsu/details/ui/pager/ChapterPagesMenuProvider.kt

@@ -1,4 +1,4 @@
-package org.koitharu.kotatsu.details.ui
+package org.koitharu.kotatsu.details.ui.pager
 
 import android.view.Menu
 import android.view.MenuInflater
@@ -14,6 +14,8 @@ import org.koitharu.kotatsu.core.prefs.AppSettings
 import org.koitharu.kotatsu.core.ui.sheet.BaseAdaptiveSheet
 import org.koitharu.kotatsu.core.util.ext.setValueRounded
 import org.koitharu.kotatsu.core.util.progress.IntPercentLabelFormatter
+import org.koitharu.kotatsu.details.ui.DetailsViewModel
+import org.koitharu.kotatsu.details.ui.pager.ChaptersPagesSheet.Companion.TAB_BOOKMARKS
 import org.koitharu.kotatsu.details.ui.pager.ChaptersPagesSheet.Companion.TAB_CHAPTERS
 import org.koitharu.kotatsu.details.ui.pager.ChaptersPagesSheet.Companion.TAB_PAGES
 import java.lang.ref.WeakReference
@@ -42,7 +44,7 @@ class ChapterPagesMenuProvider(
 				menu.findItem(R.id.action_grid_view)?.isChecked = viewModel.isChaptersInGridView.value == true
 			}
 
-			TAB_PAGES -> {
+			TAB_PAGES, TAB_BOOKMARKS -> {
 				menuInflater.inflate(R.menu.opt_pages, menu)
 				menu.findItem(R.id.action_grid_size)?.run {
 					setOnActionExpandListener(this@ChapterPagesMenuProvider)

app/src/main/kotlin/org/koitharu/kotatsu/details/ui/pager/ChaptersPagesSheet.kt

@@ -19,7 +19,6 @@ import org.koitharu.kotatsu.core.util.ext.setTabsEnabled
 import org.koitharu.kotatsu.core.util.ext.showDistinct
 import org.koitharu.kotatsu.core.util.ext.withArgs
 import org.koitharu.kotatsu.databinding.SheetChaptersPagesBinding
-import org.koitharu.kotatsu.details.ui.ChapterPagesMenuProvider
 import org.koitharu.kotatsu.details.ui.DetailsViewModel
 import javax.inject.Inject
 

app/src/main/kotlin/org/koitharu/kotatsu/details/ui/pager/bookmarks/MangaBookmarksFragment.kt

@@ -20,14 +20,11 @@ import org.koitharu.kotatsu.core.util.ext.findParentCallback
 import org.koitharu.kotatsu.core.util.ext.observe
 import org.koitharu.kotatsu.databinding.FragmentMangaBookmarksBinding
 import org.koitharu.kotatsu.details.ui.DetailsViewModel
-import org.koitharu.kotatsu.list.ui.MangaListSpanResolver
+import org.koitharu.kotatsu.list.ui.GridSpanResolver
 import org.koitharu.kotatsu.list.ui.adapter.ListItemType
 import org.koitharu.kotatsu.list.ui.adapter.TypedListSpacingDecoration
 import org.koitharu.kotatsu.reader.ui.ReaderActivity.IntentBuilder
 import org.koitharu.kotatsu.reader.ui.ReaderNavigationCallback
-import org.koitharu.kotatsu.reader.ui.ReaderState
-import org.koitharu.kotatsu.reader.ui.pager.ReaderPage
-import org.koitharu.kotatsu.reader.ui.thumbnails.OnPageSelectListener
 import javax.inject.Inject
 
 @AndroidEntryPoint
@@ -44,7 +41,7 @@ class MangaBookmarksFragment : BaseFragment<FragmentMangaBookmarksBinding>(),
 	lateinit var settings: AppSettings
 
 	private var bookmarksAdapter: BookmarksAdapter? = null
-	private var spanResolver: MangaListSpanResolver? = null
+	private var spanResolver: GridSpanResolver? = null
 
 	private val spanSizeLookup = SpanSizeLookup()
 	private val listCommitCallback = Runnable {
@@ -62,19 +59,22 @@ class MangaBookmarksFragment : BaseFragment<FragmentMangaBookmarksBinding>(),
 
 	override fun onViewBindingCreated(binding: FragmentMangaBookmarksBinding, savedInstanceState: Bundle?) {
 		super.onViewBindingCreated(binding, savedInstanceState)
-		spanResolver = MangaListSpanResolver(binding.root.resources)
+		spanResolver = GridSpanResolver(binding.root.resources)
 		bookmarksAdapter = BookmarksAdapter(
 			coil = coil,
 			lifecycleOwner = viewLifecycleOwner,
 			clickListener = this@MangaBookmarksFragment,
 			headerClickListener = null,
 		)
+		viewModel.gridScale.observe(viewLifecycleOwner, ::onGridScaleChanged) // before rv initialization
 		with(binding.recyclerView) {
 			addItemDecoration(TypedListSpacingDecoration(context, false))
 			adapter = bookmarksAdapter
 			addOnLayoutChangeListener(spanResolver)
-			spanResolver?.setGridSize(settings.gridSize / 100f, this)
+			(layoutManager as GridLayoutManager).let {
-			(layoutManager as GridLayoutManager).spanSizeLookup = spanSizeLookup
+				it.spanSizeLookup = spanSizeLookup
+				it.spanCount = checkNotNull(spanResolver).spanCount
+			}
 		}
 		viewModel.content.observe(viewLifecycleOwner, checkNotNull(bookmarksAdapter))
 	}
@@ -113,6 +113,11 @@ class MangaBookmarksFragment : BaseFragment<FragmentMangaBookmarksBinding>(),
 		}
 	}
 
+	private fun onGridScaleChanged(scale: Float) {
+		spanSizeLookup.invalidateCache()
+		spanResolver?.setGridSize(scale, requireViewBinding().recyclerView)
+	}
+
 	private inner class SpanSizeLookup : GridLayoutManager.SpanSizeLookup() {
 
 		init {

app/src/main/kotlin/org/koitharu/kotatsu/details/ui/pager/bookmarks/MangaBookmarksViewModel.kt

@@ -15,6 +15,8 @@ import kotlinx.coroutines.plus
 import org.koitharu.kotatsu.R
 import org.koitharu.kotatsu.bookmarks.domain.Bookmark
 import org.koitharu.kotatsu.bookmarks.domain.BookmarksRepository
+import org.koitharu.kotatsu.core.prefs.AppSettings
+import org.koitharu.kotatsu.core.prefs.observeAsStateFlow
 import org.koitharu.kotatsu.core.ui.BaseViewModel
 import org.koitharu.kotatsu.list.ui.model.EmptyState
 import org.koitharu.kotatsu.list.ui.model.ListHeader
@@ -26,10 +28,17 @@ import javax.inject.Inject
 @HiltViewModel
 class MangaBookmarksViewModel @Inject constructor(
 	bookmarksRepository: BookmarksRepository,
+	settings: AppSettings,
 ) : BaseViewModel(), FlowCollector<Manga?> {
 
 	private val manga = MutableStateFlow<Manga?>(null)
 
+	val gridScale = settings.observeAsStateFlow(
+		scope = viewModelScope + Dispatchers.Default,
+		key = AppSettings.KEY_GRID_SIZE_PAGES,
+		valueProducer = { gridSizePages / 100f },
+	)
+
 	val content: StateFlow<List<ListModel>> = manga.filterNotNull().flatMapLatest { m ->
 		bookmarksRepository.observeBookmarks(m)
 			.map { mapList(m, it) }

app/src/main/kotlin/org/koitharu/kotatsu/details/ui/pager/pages/PagesFragment.kt

@@ -30,6 +30,7 @@ import org.koitharu.kotatsu.core.util.ext.observeEvent
 import org.koitharu.kotatsu.core.util.ext.showOrHide
 import org.koitharu.kotatsu.databinding.FragmentPagesBinding
 import org.koitharu.kotatsu.details.ui.DetailsViewModel
+import org.koitharu.kotatsu.list.ui.GridSpanResolver
 import org.koitharu.kotatsu.list.ui.adapter.ListItemType
 import org.koitharu.kotatsu.list.ui.adapter.TypedListSpacingDecoration
 import org.koitharu.kotatsu.list.ui.model.ListModel
@@ -56,7 +57,7 @@ class PagesFragment :
 	lateinit var settings: AppSettings
 
 	private var thumbnailsAdapter: PageThumbnailAdapter? = null
-	private var spanResolver: PagesGridSpanResolver? = null
+	private var spanResolver: GridSpanResolver? = null
 	private var scrollListener: ScrollListener? = null
 
 	private val spanSizeLookup = SpanSizeLookup()
@@ -83,7 +84,7 @@ class PagesFragment :
 
 	override fun onViewBindingCreated(binding: FragmentPagesBinding, savedInstanceState: Bundle?) {
 		super.onViewBindingCreated(binding, savedInstanceState)
-		spanResolver = PagesGridSpanResolver(binding.root.resources)
+		spanResolver = GridSpanResolver(binding.root.resources)
 		thumbnailsAdapter = PageThumbnailAdapter(
 			coil = coil,
 			lifecycleOwner = viewLifecycleOwner,

app/src/main/kotlin/org/koitharu/kotatsu/details/ui/pager/pages/PagesGridSpanResolver.kt

@@ -1,59 +0,0 @@
-package org.koitharu.kotatsu.details.ui.pager.pages
-
-import android.content.res.Resources
-import android.view.View
-import androidx.recyclerview.widget.GridLayoutManager
-import androidx.recyclerview.widget.RecyclerView
-import org.koitharu.kotatsu.R
-import kotlin.math.abs
-import kotlin.math.roundToInt
-
-class PagesGridSpanResolver(
-	resources: Resources,
-) : View.OnLayoutChangeListener {
-
-	var spanCount = 3
-		private set
-
-	private val gridWidth = resources.getDimension(R.dimen.preferred_grid_width)
-	private val spacing = resources.getDimension(R.dimen.grid_spacing)
-	private var cellWidth = -1f
-
-	override fun onLayoutChange(
-		v: View?,
-		left: Int,
-		top: Int,
-		right: Int,
-		bottom: Int,
-		oldLeft: Int,
-		oldTop: Int,
-		oldRight: Int,
-		oldBottom: Int,
-	) {
-		if (cellWidth <= 0f) {
-			return
-		}
-		val rv = v as? RecyclerView ?: return
-		val width = abs(right - left)
-		if (width == 0) {
-			return
-		}
-		resolveGridSpanCount(width)
-		(rv.layoutManager as? GridLayoutManager)?.spanCount = spanCount
-	}
-
-	fun setGridSize(scaleFactor: Float, rv: RecyclerView) {
-		cellWidth = (gridWidth * scaleFactor) + spacing
-		val lm = rv.layoutManager as? GridLayoutManager ?: return
-		val innerWidth = lm.width - lm.paddingEnd - lm.paddingStart
-		if (innerWidth > 0) {
-			resolveGridSpanCount(innerWidth)
-			lm.spanCount = spanCount
-		}
-	}
-
-	private fun resolveGridSpanCount(width: Int) {
-		val estimatedCount = (width / cellWidth).roundToInt()
-		spanCount = estimatedCount.coerceAtLeast(2)
-	}
-}

app/src/main/kotlin/org/koitharu/kotatsu/list/ui/GridSpanResolver.kt

@@ -4,11 +4,11 @@ import android.content.res.Resources
 import android.view.View
 import androidx.recyclerview.widget.GridLayoutManager
 import androidx.recyclerview.widget.RecyclerView
+import org.koitharu.kotatsu.R
 import kotlin.math.abs
 import kotlin.math.roundToInt
-import org.koitharu.kotatsu.R
 
-class MangaListSpanResolver(
+class GridSpanResolver(
 	resources: Resources,
 ) : View.OnLayoutChangeListener {
 

app/src/main/kotlin/org/koitharu/kotatsu/list/ui/MangaListFragment.kt

@@ -78,7 +78,7 @@ abstract class MangaListFragment :
 	private var listAdapter: MangaListAdapter? = null
 	private var paginationListener: PaginationScrollListener? = null
 	private var selectionController: ListSelectionController? = null
-	private var spanResolver: MangaListSpanResolver? = null
+	private var spanResolver: GridSpanResolver? = null
 	private val spanSizeLookup = SpanSizeLookup()
 	open val isSwipeRefreshEnabled = true
 
@@ -98,7 +98,7 @@ abstract class MangaListFragment :
 	override fun onViewBindingCreated(binding: FragmentListBinding, savedInstanceState: Bundle?) {
 		super.onViewBindingCreated(binding, savedInstanceState)
 		listAdapter = onCreateAdapter()
-		spanResolver = MangaListSpanResolver(binding.root.resources)
+		spanResolver = GridSpanResolver(binding.root.resources)
 		selectionController = ListSelectionController(
 			appCompatDelegate = checkNotNull(findAppCompatDelegate()),
 			decoration = MangaSelectionDecoration(binding.root.context),

app/src/main/kotlin/org/koitharu/kotatsu/reader/ui/thumbnails/PagesThumbnailsSheet.kt

@@ -27,7 +27,7 @@ import org.koitharu.kotatsu.core.util.ext.showDistinct
 import org.koitharu.kotatsu.core.util.ext.showOrHide
 import org.koitharu.kotatsu.core.util.ext.withArgs
 import org.koitharu.kotatsu.databinding.SheetPagesBinding
-import org.koitharu.kotatsu.list.ui.MangaListSpanResolver
+import org.koitharu.kotatsu.list.ui.GridSpanResolver
 import org.koitharu.kotatsu.list.ui.adapter.ListItemType
 import org.koitharu.kotatsu.list.ui.adapter.TypedListSpacingDecoration
 import org.koitharu.kotatsu.list.ui.model.ListModel
@@ -54,7 +54,7 @@ class PagesThumbnailsSheet :
 	lateinit var settings: AppSettings
 
 	private var thumbnailsAdapter: PageThumbnailAdapter? = null
-	private var spanResolver: MangaListSpanResolver? = null
+	private var spanResolver: GridSpanResolver? = null
 	private var scrollListener: ScrollListener? = null
 
 	private val spanSizeLookup = SpanSizeLookup()
@@ -69,7 +69,7 @@ class PagesThumbnailsSheet :
 	override fun onViewBindingCreated(binding: SheetPagesBinding, savedInstanceState: Bundle?) {
 		super.onViewBindingCreated(binding, savedInstanceState)
 		addSheetCallback(this)
-		spanResolver = MangaListSpanResolver(binding.root.resources)
+		spanResolver = GridSpanResolver(binding.root.resources)
 		thumbnailsAdapter = PageThumbnailAdapter(
 			coil = coil,
 			lifecycleOwner = viewLifecycleOwner,

app/src/main/res/layout-w600dp-land/activity_details_new.xml

@@ -0,0 +1,410 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout
+	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/layout_root"
+	android:layout_width="match_parent"
+	android:layout_height="match_parent"
+	tools:context=".details.ui.DetailsActivity2"
+	tools:viewBindingType="android.view.ViewGroup">
+
+	<com.google.android.material.appbar.AppBarLayout
+		android:id="@+id/appbar"
+		android:layout_width="0dp"
+		android:layout_height="wrap_content"
+		android:elevation="0dp"
+		android:fitsSystemWindows="true"
+		app:elevation="0dp"
+		app:layout_constraintEnd_toEndOf="parent"
+		app:layout_constraintHorizontal_bias="0"
+		app:layout_constraintStart_toStartOf="parent"
+		app:layout_constraintTop_toTopOf="parent"
+		app:layout_constraintWidth_max="420dp"
+		app:layout_constraintWidth_percent="0.5"
+		app:liftOnScroll="false">
+
+		<com.google.android.material.appbar.MaterialToolbar
+			android:id="@id/toolbar"
+			android:layout_width="match_parent"
+			android:layout_height="wrap_content" />
+
+	</com.google.android.material.appbar.AppBarLayout>
+
+	<androidx.core.widget.NestedScrollView
+		android:id="@+id/scrollView"
+		android:layout_width="0dp"
+		android:layout_height="0dp"
+		android:clipToPadding="false"
+		android:scrollIndicators="top"
+		android:scrollbars="vertical"
+		app:layout_constraintBottom_toBottomOf="parent"
+		app:layout_constraintEnd_toEndOf="@id/appbar"
+		app:layout_constraintStart_toStartOf="parent"
+		app:layout_constraintTop_toBottomOf="@id/appbar">
+
+		<androidx.constraintlayout.widget.ConstraintLayout
+			android:layout_width="match_parent"
+			android:layout_height="match_parent">
+
+			<com.google.android.material.imageview.ShapeableImageView
+				android:id="@+id/imageView_cover"
+				android:layout_width="0dp"
+				android:layout_height="0dp"
+				android:layout_marginStart="16dp"
+				android:layout_marginTop="16dp"
+				android:background="?colorSecondaryContainer"
+				android:foreground="?selectableItemBackground"
+				android:scaleType="centerCrop"
+				app:layout_constraintDimensionRatio="H,13:18"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintHorizontal_bias="0"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toTopOf="parent"
+				app:layout_constraintWidth_percent="0.3"
+				app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.Kotatsu.Cover"
+				tools:background="@tools:sample/backgrounds/scenic[5]"
+				tools:ignore="ContentDescription,UnusedAttribute" />
+
+			<TextView
+				android:id="@+id/textView_nsfw"
+				android:layout_width="wrap_content"
+				android:layout_height="wrap_content"
+				android:layout_margin="@dimen/card_indicator_offset"
+				android:background="@drawable/bg_chip"
+				android:backgroundTint="@color/warning"
+				android:gravity="center"
+				android:paddingHorizontal="4dp"
+				android:paddingVertical="2dp"
+				android:text="@string/nsfw"
+				android:textAlignment="center"
+				android:textAppearance="?textAppearanceLabelMedium"
+				android:textColor="?colorOnError"
+				app:layout_constraintBottom_toBottomOf="@id/imageView_cover"
+				app:layout_constraintEnd_toEndOf="@id/imageView_cover" />
+
+			<org.koitharu.kotatsu.core.ui.widgets.SelectableTextView
+				android:id="@+id/textView_title"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="16dp"
+				android:layout_marginTop="16dp"
+				android:layout_marginEnd="16dp"
+				android:ellipsize="end"
+				android:maxLines="5"
+				android:textAppearance="?attr/textAppearanceHeadlineSmall"
+				android:textIsSelectable="true"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toEndOf="@id/imageView_cover"
+				app:layout_constraintTop_toTopOf="parent"
+				tools:text="@tools:sample/lorem" />
+
+			<org.koitharu.kotatsu.core.ui.widgets.SelectableTextView
+				android:id="@+id/textView_subtitle"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="16dp"
+				android:layout_marginTop="4dp"
+				android:layout_marginEnd="16dp"
+				android:ellipsize="end"
+				android:maxLines="3"
+				android:textAppearance="?attr/textAppearanceBodyMedium"
+				android:textIsSelectable="true"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toEndOf="@id/imageView_cover"
+				app:layout_constraintTop_toBottomOf="@id/textView_title"
+				tools:text="@tools:sample/lorem[12]" />
+
+			<ImageView
+				android:id="@+id/imageView_state"
+				android:layout_width="0dp"
+				android:layout_height="0dp"
+				android:layout_marginVertical="0.5dp"
+				android:layout_marginStart="16dp"
+				app:layout_constraintBottom_toBottomOf="@id/textView_state"
+				app:layout_constraintDimensionRatio="1"
+				app:layout_constraintStart_toEndOf="@id/imageView_cover"
+				app:layout_constraintTop_toTopOf="@id/textView_state"
+				tools:src="@drawable/ic_state_ongoing" />
+
+			<TextView
+				android:id="@+id/textView_state"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="4dp"
+				android:layout_marginTop="4dp"
+				android:layout_marginEnd="16dp"
+				android:drawablePadding="4dp"
+				android:gravity="center_vertical"
+				android:labelFor="@id/imageView_state"
+				android:singleLine="true"
+				android:textColor="?colorTertiary"
+				android:textStyle="bold"
+				app:drawableTint="?colorTertiary"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintHorizontal_bias="0"
+				app:layout_constraintStart_toEndOf="@id/imageView_state"
+				app:layout_constraintTop_toBottomOf="@id/textView_subtitle"
+				app:layout_constraintWidth_default="wrap"
+				tools:text="@string/state_ongoing" />
+
+			<RatingBar
+				android:id="@+id/rating_bar"
+				style="?ratingBarStyleSmall"
+				android:layout_width="wrap_content"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="16dp"
+				android:layout_marginTop="4dp"
+				android:layout_marginEnd="16dp"
+				android:isIndicator="true"
+				android:max="1"
+				android:numStars="5"
+				android:stepSize="0.5"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintHorizontal_bias="0.0"
+				app:layout_constraintStart_toEndOf="@id/imageView_cover"
+				app:layout_constraintTop_toBottomOf="@id/textView_state"
+				tools:rating="4" />
+
+			<androidx.constraintlayout.widget.Barrier
+				android:id="@+id/barrier_header"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				app:barrierDirection="bottom"
+				app:barrierMargin="@dimen/margin_normal"
+				app:constraint_referenced_ids="imageView_cover,rating_bar" />
+
+			<include
+				android:id="@+id/info_layout"
+				layout="@layout/layout_details_chips"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@id/barrier_header" />
+
+			<org.koitharu.kotatsu.core.ui.widgets.ProgressButton
+				android:id="@+id/button_read"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_gravity="end|center_vertical"
+				android:layout_marginHorizontal="@dimen/screen_padding"
+				android:layout_marginTop="@dimen/margin_normal"
+				android:foreground="?selectableItemBackground"
+				android:gravity="center"
+				android:paddingHorizontal="6dp"
+				android:paddingVertical="8dp"
+				android:textColor="?colorOnPrimaryContainer"
+				app:baseColor="?colorSecondaryContainer"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@id/info_layout"
+				app:progressColor="?colorPrimary"
+				app:subtitleTextAppearance="?textAppearanceBodySmall"
+				app:titleTextAppearance="?textAppearanceButton"
+				tools:max="100"
+				tools:progress="40"
+				tools:subtitle="12 chapters"
+				tools:title="@string/read" />
+
+			<TextView
+				android:id="@+id/textView_description_title"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="@dimen/margin_small"
+				android:layout_marginTop="@dimen/margin_normal"
+				android:gravity="center_vertical|start"
+				android:padding="@dimen/grid_spacing"
+				android:singleLine="true"
+				android:text="@string/description"
+				android:textAppearance="@style/TextAppearance.Kotatsu.SectionHeader"
+				app:layout_constraintEnd_toStartOf="@id/button_description_more"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@id/button_read" />
+
+			<Button
+				android:id="@+id/button_description_more"
+				style="@style/Widget.Kotatsu.Button.More"
+				android:layout_width="wrap_content"
+				android:layout_height="wrap_content"
+				android:layout_marginEnd="8dp"
+				android:text="@string/more"
+				app:layout_constraintBaseline_toBaselineOf="@id/textView_description_title"
+				app:layout_constraintEnd_toEndOf="parent" />
+
+			<org.koitharu.kotatsu.core.ui.widgets.SelectableTextView
+				android:id="@+id/textView_description"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="@dimen/margin_normal"
+				android:layout_marginTop="@dimen/margin_small"
+				android:layout_marginEnd="@dimen/margin_normal"
+				android:ellipsize="end"
+				android:lineSpacingMultiplier="1.2"
+				android:maxLines="@integer/details_description_lines"
+				android:textAppearance="?attr/textAppearanceBodyMedium"
+				android:textIsSelectable="true"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@id/textView_description_title"
+				tools:ignore="UnusedAttribute"
+				tools:text="@tools:sample/lorem/random" />
+
+			<org.koitharu.kotatsu.core.ui.widgets.ChipsView
+				android:id="@+id/chips_tags"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginTop="@dimen/margin_small"
+				android:paddingStart="@dimen/screen_padding"
+				android:paddingEnd="@dimen/screen_padding"
+				app:chipSpacingHorizontal="6dp"
+				app:chipSpacingVertical="6dp"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@+id/textView_description" />
+
+			<TextView
+				android:id="@+id/textView_scrobbling_title"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="@dimen/margin_small"
+				android:layout_marginTop="@dimen/margin_normal"
+				android:layout_weight="1"
+				android:gravity="center_vertical|start"
+				android:padding="@dimen/grid_spacing"
+				android:singleLine="true"
+				android:text="@string/tracking"
+				android:textAppearance="@style/TextAppearance.Kotatsu.SectionHeader"
+				app:layout_constraintEnd_toStartOf="@id/button_scrobbling_more"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@id/chips_tags" />
+
+			<Button
+				android:id="@+id/button_scrobbling_more"
+				style="@style/Widget.Kotatsu.Button.More"
+				android:layout_width="wrap_content"
+				android:layout_height="wrap_content"
+				android:layout_marginEnd="8dp"
+				android:text="@string/manage"
+				app:layout_constraintBaseline_toBaselineOf="@id/textView_scrobbling_title"
+				app:layout_constraintEnd_toEndOf="parent" />
+
+			<androidx.recyclerview.widget.RecyclerView
+				android:id="@+id/recyclerView_scrobbling"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="16dp"
+				android:layout_marginEnd="16dp"
+				android:layout_marginBottom="12dp"
+				android:nestedScrollingEnabled="false"
+				android:orientation="vertical"
+				android:overScrollMode="never"
+				android:scrollbars="none"
+				android:visibility="gone"
+				app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@id/textView_scrobbling_title"
+				tools:itemCount="2"
+				tools:listitem="@layout/item_scrobbling_info"
+				tools:visibility="visible" />
+
+			<com.google.android.material.progressindicator.LinearProgressIndicator
+				android:id="@+id/progressBar"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:indeterminate="true"
+				android:visibility="gone"
+				app:hideAnimationBehavior="outward"
+				app:layout_constraintBottom_toTopOf="parent"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toTopOf="parent"
+				app:showAnimationBehavior="inward"
+				app:trackCornerRadius="0dp"
+				tools:visibility="visible" />
+
+			<androidx.constraintlayout.widget.Group
+				android:id="@+id/group_scrobbling"
+				android:layout_width="wrap_content"
+				android:layout_height="wrap_content"
+				android:visibility="gone"
+				app:constraint_referenced_ids="recyclerView_scrobbling,textView_scrobbling_title,button_scrobbling_more"
+				tools:visibility="visible" />
+
+			<TextView
+				android:id="@+id/textView_related_title"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="@dimen/margin_small"
+				android:layout_marginTop="@dimen/margin_small"
+				android:layout_weight="1"
+				android:gravity="center_vertical|start"
+				android:padding="@dimen/grid_spacing"
+				android:singleLine="true"
+				android:text="@string/related_manga"
+				android:textAppearance="@style/TextAppearance.Kotatsu.SectionHeader"
+				app:layout_constraintEnd_toStartOf="@id/button_related_more"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@id/recyclerView_scrobbling" />
+
+			<Button
+				android:id="@+id/button_related_more"
+				style="@style/Widget.Kotatsu.Button.More"
+				android:layout_width="wrap_content"
+				android:layout_height="wrap_content"
+				android:layout_marginEnd="8dp"
+				android:text="@string/show_all"
+				android:visibility="gone"
+				app:layout_constraintBaseline_toBaselineOf="@id/textView_related_title"
+				app:layout_constraintEnd_toEndOf="parent" />
+
+			<androidx.recyclerview.widget.RecyclerView
+				android:id="@+id/recyclerView_related"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginBottom="6dp"
+				android:clipToPadding="false"
+				android:nestedScrollingEnabled="false"
+				android:orientation="horizontal"
+				android:paddingStart="12dp"
+				android:paddingEnd="12dp"
+				app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@id/textView_related_title"
+				tools:listitem="@layout/item_manga_grid" />
+
+			<androidx.constraintlayout.widget.Group
+				android:id="@+id/group_related"
+				android:layout_width="wrap_content"
+				android:layout_height="wrap_content"
+				android:visibility="gone"
+				app:constraint_referenced_ids="recyclerView_related,textView_related_title,button_related_more"
+				tools:visibility="visible" />
+
+		</androidx.constraintlayout.widget.ConstraintLayout>
+
+	</androidx.core.widget.NestedScrollView>
+
+	<com.google.android.material.card.MaterialCardView
+		android:id="@+id/card_chapters"
+		android:layout_width="0dp"
+		android:layout_height="0dp"
+		android:layout_marginStart="@dimen/side_card_offset"
+		android:layout_marginTop="2dp"
+		android:layout_marginEnd="@dimen/side_card_offset"
+		android:layout_marginBottom="@dimen/side_card_offset"
+		app:layout_constraintBottom_toBottomOf="parent"
+		app:layout_constraintEnd_toEndOf="parent"
+		app:layout_constraintStart_toEndOf="@id/appbar"
+		app:layout_constraintTop_toTopOf="parent">
+
+		<androidx.fragment.app.FragmentContainerView
+			android:id="@+id/container_side"
+			android:name="org.koitharu.kotatsu.details.ui.pager.ChaptersPagesSheet"
+			android:layout_width="match_parent"
+			android:layout_height="match_parent" />
+
+	</com.google.android.material.card.MaterialCardView>
+</androidx.constraintlayout.widget.ConstraintLayout>

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

@@ -1,12 +1,14 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.coordinatorlayout.widget.CoordinatorLayout
+<LinearLayout
 	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/coordinator"
+	android:id="@+id/layout_root"
 	android:layout_width="match_parent"
 	android:layout_height="match_parent"
-	android:clipToPadding="false">
+	android:clipToPadding="false"
+	android:orientation="vertical"
+	tools:viewBindingType="android.view.ViewGroup">
 
 	<com.google.android.material.appbar.AppBarLayout
 		android:id="@+id/appbar"
@@ -27,8 +29,7 @@
 		android:layout_height="match_parent"
 		android:clipToPadding="false"
 		android:scrollIndicators="top"
-		android:scrollbars="vertical"
+		android:scrollbars="vertical">
-		app:layout_behavior="@string/appbar_scrolling_view_behavior">
 
 		<androidx.constraintlayout.widget.ConstraintLayout
 			android:layout_width="match_parent"
@@ -235,6 +236,24 @@
 				app:layout_constraintBaseline_toBaselineOf="@id/textView_description_title"
 				app:layout_constraintEnd_toEndOf="parent" />
 
+			<org.koitharu.kotatsu.core.ui.widgets.SelectableTextView
+				android:id="@+id/textView_description"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_marginStart="@dimen/margin_normal"
+				android:layout_marginTop="@dimen/margin_small"
+				android:layout_marginEnd="@dimen/margin_normal"
+				android:ellipsize="end"
+				android:lineSpacingMultiplier="1.2"
+				android:maxLines="@integer/details_description_lines"
+				android:textAppearance="?attr/textAppearanceBodyMedium"
+				android:textIsSelectable="true"
+				app:layout_constraintEnd_toEndOf="parent"
+				app:layout_constraintStart_toStartOf="parent"
+				app:layout_constraintTop_toBottomOf="@id/textView_description_title"
+				tools:ignore="UnusedAttribute"
+				tools:text="@tools:sample/lorem/random" />
+
 			<org.koitharu.kotatsu.core.ui.widgets.ChipsView
 				android:id="@+id/chips_tags"
 				android:layout_width="0dp"
@@ -246,33 +265,14 @@
 				app:chipSpacingVertical="6dp"
 				app:layout_constraintEnd_toEndOf="parent"
 				app:layout_constraintStart_toStartOf="parent"
-				app:layout_constraintTop_toBottomOf="@+id/textView_description_title" />
+				app:layout_constraintTop_toBottomOf="@+id/textView_description" />
-
-			<org.koitharu.kotatsu.core.ui.widgets.SelectableTextView
-				android:id="@+id/textView_description"
-				android:layout_width="0dp"
-				android:layout_height="wrap_content"
-				android:layout_marginStart="@dimen/margin_normal"
-				android:layout_marginTop="@dimen/margin_small"
-				android:layout_marginEnd="@dimen/margin_normal"
-				android:ellipsize="end"
-				android:lineSpacingMultiplier="1.2"
-				android:maxLines="@integer/details_description_lines"
-				android:paddingBottom="@dimen/margin_normal"
-				android:textAppearance="?attr/textAppearanceBodyMedium"
-				android:textIsSelectable="true"
-				app:layout_constraintEnd_toEndOf="parent"
-				app:layout_constraintStart_toStartOf="parent"
-				app:layout_constraintTop_toBottomOf="@id/chips_tags"
-				tools:ignore="UnusedAttribute"
-				tools:text="@tools:sample/lorem/random" />
 
 			<TextView
 				android:id="@+id/textView_scrobbling_title"
 				android:layout_width="0dp"
 				android:layout_height="wrap_content"
 				android:layout_marginStart="@dimen/margin_small"
-				android:layout_marginTop="@dimen/margin_small"
+				android:layout_marginTop="@dimen/margin_normal"
 				android:layout_weight="1"
 				android:gravity="center_vertical|start"
 				android:padding="@dimen/grid_spacing"
@@ -281,7 +281,7 @@
 				android:textAppearance="@style/TextAppearance.Kotatsu.SectionHeader"
 				app:layout_constraintEnd_toStartOf="@id/button_scrobbling_more"
 				app:layout_constraintStart_toStartOf="parent"
-				app:layout_constraintTop_toBottomOf="@id/textView_description" />
+				app:layout_constraintTop_toBottomOf="@id/chips_tags" />
 
 			<Button
 				android:id="@+id/button_scrobbling_more"
@@ -328,14 +328,6 @@
 				app:trackCornerRadius="0dp"
 				tools:visibility="visible" />
 
-			<androidx.constraintlayout.widget.Group
-				android:id="@+id/group_bookmarks"
-				android:layout_width="wrap_content"
-				android:layout_height="wrap_content"
-				android:visibility="gone"
-				app:constraint_referenced_ids="recyclerView_bookmarks,textView_bookmarks_title,button_bookmarks_more"
-				tools:visibility="visible" />
-
 			<androidx.constraintlayout.widget.Group
 				android:id="@+id/group_scrobbling"
 				android:layout_width="wrap_content"
@@ -398,4 +390,4 @@
 		</androidx.constraintlayout.widget.ConstraintLayout>
 
 	</androidx.core.widget.NestedScrollView>
-</androidx.coordinatorlayout.widget.CoordinatorLayout>
+</LinearLayout>

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

@@ -6,7 +6,7 @@
 
 	<integer name="manga_badge_max_character_count">3</integer>
 	<integer name="explore_buttons_columns">2</integer>
-	<integer name="details_description_lines">5</integer>
+	<integer name="details_description_lines">4</integer>
 
 	<integer name="splash_screen_duration">450</integer>
 </resources>