From 3d5a1e9b30ab4fb7da81e66d8c4d7d95e42b37c7 Mon Sep 17 00:00:00 2001
From: ztimms73 <vp1984tanki@gmail.com>
Date: Fri, 18 Jun 2021 03:17:38 +0300
Subject: [PATCH] Finally update details layouts

---
 .../kotatsu/details/ui/DetailsFragment.kt     |   3 -
 .../layout-w600dp-land/fragment_details.xml   | 472 ++++++++----------
 .../layout-w600dp-port/fragment_details.xml   | 418 ++++++++--------
 app/src/main/res/layout/fragment_details.xml  | 174 +++----
 4 files changed, 490 insertions(+), 577 deletions(-)

diff --git a/app/src/main/java/org/koitharu/kotatsu/details/ui/DetailsFragment.kt b/app/src/main/java/org/koitharu/kotatsu/details/ui/DetailsFragment.kt
index bdea2d35d..b3d11d3df 100644
--- a/app/src/main/java/org/koitharu/kotatsu/details/ui/DetailsFragment.kt
+++ b/app/src/main/java/org/koitharu/kotatsu/details/ui/DetailsFragment.kt
@@ -79,11 +79,8 @@ class DetailsFragment : BaseFragment<FragmentDetailsBinding>(), View.OnClickList
 				chaptersContainer.isVisible = false
 			}
 			if (manga.rating == Manga.NO_RATING) {
-				ratingBar.isVisible = false
 				ratingContainer.isVisible = false
 			} else {
-				ratingBar.progress = (ratingBar.max * manga.rating).roundToInt()
-				ratingBar.isVisible = true
 				textViewRating.text = String.format("%.1f", manga.rating * 5)
 				ratingContainer.isVisible = true
 			}
diff --git a/app/src/main/res/layout-w600dp-land/fragment_details.xml b/app/src/main/res/layout-w600dp-land/fragment_details.xml
index e884b6769..51f3213ed 100644
--- a/app/src/main/res/layout-w600dp-land/fragment_details.xml
+++ b/app/src/main/res/layout-w600dp-land/fragment_details.xml
@@ -12,284 +12,256 @@
 		android:layout_width="match_parent"
 		android:layout_height="match_parent">
 
-		<View
-			android:id="@+id/guideline"
-			android:layout_width="0dp"
+		<LinearLayout
+			android:id="@+id/main_container"
+			android:layout_width="match_parent"
 			android:layout_height="0dp"
-			android:layout_marginTop="8dp"
-			app:layout_constraintTop_toBottomOf="@+id/cover_card"
-			tools:ignore="MissingConstraints" />
-
-		<androidx.constraintlayout.widget.Guideline
-			android:id="@+id/guideline2"
-			android:layout_width="wrap_content"
-			android:layout_height="wrap_content"
-			android:orientation="vertical"
-			app:layout_constraintGuide_percent="0.21" />
-
-		<com.google.android.material.card.MaterialCardView
-			android:id="@+id/cover_card"
-			android:layout_width="0dp"
-			android:layout_height="0dp"
-			android:layout_marginStart="16dp"
-			android:layout_marginTop="16dp"
-			android:layout_marginEnd="16dp"
-			android:layout_marginBottom="16dp"
-			app:cardCornerRadius="4dp"
-			app:cardElevation="4dp"
-			app:layout_constraintDimensionRatio="13:18"
-			app:layout_constraintEnd_toStartOf="@id/guideline2"
-			app:layout_constraintStart_toStartOf="parent"
-			app:layout_constraintTop_toTopOf="parent">
-
-			<ImageView
-				android:id="@+id/imageView_cover"
-				android:layout_width="match_parent"
-				android:layout_height="match_parent"
-				android:scaleType="centerCrop"
-				tools:background="@tools:sample/backgrounds/scenic"
-				tools:ignore="ContentDescription" />
-
-		</com.google.android.material.card.MaterialCardView>
-
-		<androidx.constraintlayout.widget.ConstraintLayout
-			android:id="@+id/text_container"
-			android:layout_width="0dp"
-			android:layout_height="wrap_content"
-			android:layout_marginTop="16dp"
-			android:layout_marginEnd="16dp"
+			android:layout_margin="8dp"
+			android:gravity="center_horizontal"
+			android:orientation="horizontal"
+			android:weightSum="4"
 			app:layout_constraintEnd_toEndOf="parent"
-			app:layout_constraintStart_toStartOf="@+id/guideline2"
+			app:layout_constraintStart_toStartOf="parent"
 			app:layout_constraintTop_toTopOf="parent">
 
-			<TextView
-				android:id="@+id/textView_title"
+			<com.google.android.material.card.MaterialCardView
+				android:id="@+id/cover_card"
 				android:layout_width="0dp"
 				android:layout_height="wrap_content"
-				android:ellipsize="end"
-				android:maxLines="3"
-				android:textAppearance="@style/TextAppearance.AppCompat.Body2"
-				android:textColor="?android:textColorPrimary"
-				android:textSize="20sp"
-				app:layout_constraintEnd_toEndOf="parent"
-				app:layout_constraintStart_toStartOf="parent"
-				app:layout_constraintTop_toTopOf="parent"
-				tools:text="@tools:sample/lorem[20]" />
-
-			<TextView
-				android:id="@+id/textView_subtitle"
+				android:layout_margin="8dp"
+				android:layout_weight="1"
+				app:cardCornerRadius="4dp"
+				app:cardElevation="4dp">
+
+				<org.koitharu.kotatsu.base.ui.widgets.CoverImageView
+					android:id="@+id/imageView_cover"
+					android:layout_width="match_parent"
+					android:layout_height="match_parent"
+					android:scaleType="centerCrop"
+					tools:background="@tools:sample/backgrounds/scenic"
+					tools:ignore="ContentDescription" />
+
+			</com.google.android.material.card.MaterialCardView>
+
+			<androidx.constraintlayout.widget.ConstraintLayout
+				android:id="@+id/text_container"
 				android:layout_width="0dp"
 				android:layout_height="wrap_content"
-				android:layout_marginTop="4dp"
-				android:ellipsize="end"
-				android:maxLines="2"
-				android:textSize="14sp"
-				app:layout_constraintEnd_toEndOf="@id/textView_title"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/textView_title"
-				tools:text="@tools:sample/lorem[20]" />
-
-			<TextView
-				android:id="@+id/textView_author"
-				android:layout_width="0dp"
-				android:layout_height="wrap_content"
-				android:layout_marginTop="4dp"
-				android:requiresFadingEdge="horizontal"
-				android:singleLine="true"
-				android:textColor="?colorAccent"
-				android:textStyle="bold"
-				app:layout_constraintEnd_toEndOf="@id/textView_title"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/textView_subtitle"
-				tools:text="@tools:sample/full_names" />
-
-			<RatingBar
-				android:id="@+id/ratingBar"
-				style="@style/Widget.AppCompat.RatingBar.Small"
-				android:layout_width="wrap_content"
-				android:layout_height="wrap_content"
-				android:layout_marginTop="4dp"
-				android:isIndicator="true"
-				android:max="100"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/textView_author"
-				tools:progress="70" />
-
-			<LinearLayout
-				android:id="@+id/info_layout"
-				android:layout_width="match_parent"
-				android:layout_height="wrap_content"
-				android:layout_marginTop="4dp"
-				android:baselineAligned="false"
-				android:divider="?android:dividerHorizontal"
-				android:dividerPadding="8dp"
-				android:orientation="horizontal"
-				android:paddingStart="8dp"
-				android:paddingEnd="8dp"
-				android:showDividers="middle"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/ratingBar">
+				android:layout_margin="8dp"
+				android:layout_weight="3">
 
-				<LinearLayout
-					android:id="@+id/rating_container"
+				<TextView
+					android:id="@+id/textView_title"
 					android:layout_width="0dp"
 					android:layout_height="wrap_content"
-					android:layout_gravity="center"
-					android:layout_weight="1"
-					android:gravity="center">
-
-					<TextView
-						android:id="@+id/textView_rating"
-						android:layout_width="wrap_content"
-						android:layout_height="wrap_content"
-						android:drawablePadding="4dp"
-						android:padding="4dp"
-						android:textSize="20sp"
-						app:drawableEndCompat="@drawable/ic_star_manga_info"
-						tools:text="4.8" />
-
-				</LinearLayout>
-
-				<LinearLayout
-					android:id="@+id/chapters_container"
+					android:ellipsize="end"
+					android:textAppearance="@style/TextAppearance.AppCompat.Body2"
+					android:textColor="?android:textColorPrimary"
+					android:textSize="20sp"
+					app:layout_constraintEnd_toEndOf="parent"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toTopOf="parent"
+					tools:text="@tools:sample/lorem[15]" />
+
+				<TextView
+					android:id="@+id/textView_subtitle"
 					android:layout_width="0dp"
 					android:layout_height="wrap_content"
-					android:layout_gravity="center"
-					android:layout_weight="1"
-					android:gravity="center">
-
-					<TextView
-						android:id="@+id/textView_chapters"
-						android:layout_width="wrap_content"
-						android:layout_height="wrap_content"
-						android:drawablePadding="4dp"
-						android:gravity="center_horizontal"
-						android:padding="4dp"
-						android:textSize="12sp"
-						app:drawableTopCompat="@drawable/ic_book_page"
-						tools:text="52 chapters" />
-
-				</LinearLayout>
-
-				<LinearLayout
-					android:id="@+id/source_container"
+					android:layout_marginTop="4dp"
+					android:ellipsize="end"
+					android:textSize="14sp"
+					app:layout_constraintEnd_toEndOf="@id/textView_title"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toBottomOf="@id/textView_title"
+					tools:text="@tools:sample/lorem[15]" />
+
+				<TextView
+					android:id="@+id/textView_author"
 					android:layout_width="0dp"
 					android:layout_height="wrap_content"
-					android:layout_gravity="center"
-					android:layout_weight="1"
-					android:gravity="center">
+					android:layout_marginTop="4dp"
+					android:requiresFadingEdge="horizontal"
+					android:textColor="?colorAccent"
+					android:textStyle="bold"
+					app:layout_constraintEnd_toEndOf="@id/textView_title"
+					app:layout_constraintStart_toStartOf="@id/textView_title"
+					app:layout_constraintTop_toBottomOf="@id/textView_subtitle"
+					tools:text="@tools:sample/full_names" />
 
-					<TextView
-						android:id="@+id/textView_source"
-						android:layout_width="wrap_content"
+				<LinearLayout
+					android:id="@+id/info_layout"
+					android:layout_width="match_parent"
+					android:layout_height="wrap_content"
+					android:layout_marginTop="4dp"
+					android:baselineAligned="false"
+					android:divider="?android:dividerHorizontal"
+					android:dividerPadding="8dp"
+					android:orientation="horizontal"
+					android:showDividers="middle"
+					app:layout_constraintTop_toBottomOf="@+id/textView_author">
+
+					<LinearLayout
+						android:id="@+id/rating_container"
+						android:layout_width="0dp"
+						android:layout_height="wrap_content"
+						android:layout_gravity="center"
+						android:layout_weight="1"
+						android:gravity="center">
+
+						<TextView
+							android:id="@+id/textView_rating"
+							android:layout_width="wrap_content"
+							android:layout_height="wrap_content"
+							android:drawablePadding="4dp"
+							android:padding="4dp"
+							android:textSize="20sp"
+							app:drawableEndCompat="@drawable/ic_star_manga_info"
+							tools:text="4.8" />
+
+					</LinearLayout>
+
+					<LinearLayout
+						android:id="@+id/chapters_container"
+						android:layout_width="0dp"
+						android:layout_height="wrap_content"
+						android:layout_gravity="center"
+						android:layout_weight="1"
+						android:gravity="center">
+
+						<TextView
+							android:id="@+id/textView_chapters"
+							android:layout_width="wrap_content"
+							android:layout_height="wrap_content"
+							android:drawablePadding="4dp"
+							android:gravity="center_horizontal"
+							android:padding="4dp"
+							android:textSize="12sp"
+							app:drawableTopCompat="@drawable/ic_book_page"
+							tools:text="52 chapters" />
+
+					</LinearLayout>
+
+					<LinearLayout
+						android:id="@+id/source_container"
+						android:layout_width="0dp"
+						android:layout_height="wrap_content"
+						android:layout_gravity="center"
+						android:layout_weight="1"
+						android:gravity="center">
+
+						<TextView
+							android:id="@+id/textView_source"
+							android:layout_width="wrap_content"
+							android:layout_height="wrap_content"
+							android:drawablePadding="4dp"
+							android:gravity="center_horizontal"
+							android:padding="4dp"
+							android:textSize="12sp"
+							app:drawableTopCompat="@drawable/ic_web"
+							tools:text="Source" />
+
+					</LinearLayout>
+
+					<LinearLayout
+						android:id="@+id/size_container"
+						android:layout_width="0dp"
 						android:layout_height="wrap_content"
-						android:drawablePadding="4dp"
-						android:gravity="center_horizontal"
-						android:padding="4dp"
-						android:textSize="12sp"
-						app:drawableTopCompat="@drawable/ic_web"
-						tools:text="Source" />
+						android:layout_gravity="center"
+						android:layout_weight="1"
+						android:gravity="center">
+
+						<TextView
+							android:id="@+id/textView_size"
+							android:layout_width="wrap_content"
+							android:layout_height="wrap_content"
+							android:drawablePadding="4dp"
+							android:gravity="center_horizontal"
+							android:padding="4dp"
+							android:textSize="12sp"
+							app:drawableTopCompat="@drawable/ic_storage"
+							tools:text="1.8 GiB" />
+
+					</LinearLayout>
 
 				</LinearLayout>
 
 				<LinearLayout
-					android:id="@+id/size_container"
-					android:layout_width="0dp"
-					android:layout_height="wrap_content"
-					android:layout_gravity="center"
-					android:layout_weight="1"
-					android:gravity="center">
-
-					<TextView
-						android:id="@+id/textView_size"
+					android:id="@+id/buttons_layout"
+					android:layout_width="match_parent"
+					android:layout_height="48dp"
+					android:layout_marginTop="4dp"
+					android:gravity="center"
+					android:orientation="horizontal"
+					app:layout_constraintEnd_toEndOf="parent"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toBottomOf="@id/info_layout">
+
+					<com.google.android.material.button.MaterialButton
+						android:id="@+id/button_favorite"
+						style="@style/Widget.MaterialComponents.Button.OutlinedButton"
 						android:layout_width="wrap_content"
 						android:layout_height="wrap_content"
-						android:drawablePadding="4dp"
-						android:gravity="center_horizontal"
-						android:padding="4dp"
-						android:textSize="12sp"
-						app:drawableTopCompat="@drawable/ic_storage"
-						tools:text="1.8 GiB" />
+						android:layout_weight="1"
+						app:icon="@drawable/ic_heart_outline"
+						app:iconGravity="textTop"
+						app:iconPadding="0dp" />
+
+					<com.google.android.material.button.MaterialButton
+						android:id="@+id/button_read"
+						style="@style/Widget.MaterialComponents.Button"
+						android:layout_width="match_parent"
+						android:layout_height="wrap_content"
+						android:layout_marginStart="16dp"
+						android:layout_weight="1"
+						android:enabled="false"
+						android:text="@string/read"
+						android:textAllCaps="false"
+						app:elevation="0dp"
+						app:iconGravity="textStart"
+						app:iconPadding="8dp"
+						tools:text="@string/_continue" />
 
 				</LinearLayout>
 
-			</LinearLayout>
-
-			<LinearLayout
-				android:id="@+id/buttons_layout"
-				android:layout_width="match_parent"
-				android:layout_height="48dp"
-				android:layout_marginTop="16dp"
-				android:gravity="center_vertical|end"
-				android:orientation="horizontal"
-				app:layout_constraintEnd_toEndOf="parent"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/info_layout">
-
-				<com.google.android.material.button.MaterialButton
-					android:id="@+id/button_favorite"
-					style="@style/Widget.MaterialComponents.Button.OutlinedButton"
-					android:layout_width="wrap_content"
+				<org.koitharu.kotatsu.base.ui.widgets.ChipsView
+					android:id="@+id/chips_tags"
+					android:layout_width="0dp"
 					android:layout_height="wrap_content"
-					app:icon="@drawable/ic_heart_outline"
-					app:iconGravity="textTop"
-					app:iconPadding="0dp" />
-
-				<com.google.android.material.button.MaterialButton
-					android:id="@+id/button_read"
-					style="@style/Widget.MaterialComponents.Button"
-					android:layout_width="wrap_content"
+					android:layout_marginTop="8dp"
+					app:chipSpacingHorizontal="6dp"
+					app:chipSpacingVertical="6dp"
+					app:layout_constraintEnd_toEndOf="parent"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toBottomOf="@+id/buttons_layout" />
+
+				<TextView
+					android:id="@+id/desc_header"
+					android:layout_width="match_parent"
 					android:layout_height="wrap_content"
-					android:layout_marginStart="16dp"
-					android:enabled="false"
-					android:text="@string/read"
-					android:textAllCaps="false"
-					app:elevation="0dp"
-					app:iconGravity="textStart"
-					app:iconPadding="8dp"
-					tools:text="@string/_continue" />
-
-			</LinearLayout>
-
-		</androidx.constraintlayout.widget.ConstraintLayout>
-
-		<org.koitharu.kotatsu.base.ui.widgets.ChipsView
-			android:id="@+id/chips_tags"
-			android:layout_width="0dp"
-			android:layout_height="wrap_content"
-			android:layout_marginTop="16dp"
-			android:layout_marginEnd="16dp"
-			app:chipSpacingHorizontal="6dp"
-			app:chipSpacingVertical="6dp"
-			app:layout_constraintEnd_toEndOf="parent"
-			app:layout_constraintStart_toStartOf="@+id/guideline2"
-			app:layout_constraintTop_toBottomOf="@+id/text_container" />
-
-		<TextView
-			android:id="@+id/desc_header"
-			android:layout_width="wrap_content"
-			android:layout_height="wrap_content"
-			android:paddingTop="16dp"
-			android:paddingBottom="8dp"
-			android:text="@string/description"
-			android:textAppearance="@style/TextAppearance.AppCompat.Body2"
-			android:textColor="?android:textColorPrimary"
-			android:textSize="18sp"
-			app:layout_constraintStart_toStartOf="@+id/guideline2"
-			app:layout_constraintTop_toBottomOf="@id/chips_tags" />
-
-		<TextView
-			android:id="@+id/textView_description"
-			android:layout_width="0dp"
-			android:layout_height="match_parent"
-			android:layout_marginEnd="16dp"
-			android:lineSpacingMultiplier="1.2"
-			android:textIsSelectable="true"
-			app:layout_constraintEnd_toEndOf="parent"
-			app:layout_constraintStart_toStartOf="@+id/guideline2"
-			app:layout_constraintTop_toBottomOf="@id/desc_header"
-			tools:ignore="UnusedAttribute"
-			tools:text="@tools:sample/lorem/random[25]" />
+					android:paddingTop="8dp"
+					android:paddingBottom="8dp"
+					android:text="@string/description"
+					android:textAppearance="@style/TextAppearance.AppCompat.Body2"
+					android:textColor="?android:textColorPrimary"
+					android:textSize="18sp"
+					app:layout_constraintTop_toBottomOf="@id/chips_tags" />
+
+				<TextView
+					android:id="@+id/textView_description"
+					android:layout_width="0dp"
+					android:layout_height="match_parent"
+					android:layout_marginBottom="16dp"
+					android:lineSpacingMultiplier="1.2"
+					android:textIsSelectable="true"
+					app:layout_constraintEnd_toEndOf="parent"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toBottomOf="@id/desc_header"
+					tools:ignore="UnusedAttribute"
+					tools:text="@tools:sample/lorem/random[25]" />
+
+			</androidx.constraintlayout.widget.ConstraintLayout>
+
+		</LinearLayout>
 
 		<ProgressBar
 			android:id="@+id/progressBar"
diff --git a/app/src/main/res/layout-w600dp-port/fragment_details.xml b/app/src/main/res/layout-w600dp-port/fragment_details.xml
index d7d892bb7..d7be6c758 100644
--- a/app/src/main/res/layout-w600dp-port/fragment_details.xml
+++ b/app/src/main/res/layout-w600dp-port/fragment_details.xml
@@ -12,247 +12,219 @@
 		android:layout_width="match_parent"
 		android:layout_height="match_parent">
 
-		<View
-			android:id="@+id/guideline"
-			android:layout_width="0dp"
-			android:layout_height="0dp"
-			android:layout_marginTop="8dp"
-			app:layout_constraintTop_toBottomOf="@+id/cover_card"
-			tools:ignore="MissingConstraints" />
-
-		<androidx.constraintlayout.widget.Guideline
-			android:id="@+id/guideline2"
-			android:layout_width="wrap_content"
-			android:layout_height="wrap_content"
-			android:orientation="vertical"
-			app:layout_constraintGuide_percent="0.35" />
-
-		<com.google.android.material.card.MaterialCardView
-			android:id="@+id/cover_card"
-			android:layout_width="0dp"
+		<LinearLayout
+			android:id="@+id/main_container"
+			android:layout_width="match_parent"
 			android:layout_height="0dp"
-			android:layout_marginStart="16dp"
-			android:layout_marginTop="16dp"
-			android:layout_marginEnd="16dp"
-			android:layout_marginBottom="16dp"
-			app:cardCornerRadius="4dp"
-			app:cardElevation="4dp"
-			app:layout_constraintDimensionRatio="13:18"
-			app:layout_constraintEnd_toStartOf="@id/guideline2"
-			app:layout_constraintStart_toStartOf="parent"
-			app:layout_constraintTop_toTopOf="parent">
-
-			<ImageView
-				android:id="@+id/imageView_cover"
-				android:layout_width="match_parent"
-				android:layout_height="match_parent"
-				android:scaleType="centerCrop"
-				tools:background="@tools:sample/backgrounds/scenic"
-				tools:ignore="ContentDescription" />
-
-		</com.google.android.material.card.MaterialCardView>
-
-		<androidx.constraintlayout.widget.ConstraintLayout
-			android:id="@+id/text_container"
-			android:layout_width="0dp"
-			android:layout_height="wrap_content"
-			android:layout_marginTop="16dp"
-			android:layout_marginEnd="16dp"
+			android:layout_margin="8dp"
+			android:gravity="center_horizontal"
+			android:orientation="horizontal"
+			android:weightSum="3"
 			app:layout_constraintEnd_toEndOf="parent"
-			app:layout_constraintStart_toStartOf="@+id/guideline2"
+			app:layout_constraintStart_toStartOf="parent"
 			app:layout_constraintTop_toTopOf="parent">
 
-			<TextView
-				android:id="@+id/textView_title"
+			<com.google.android.material.card.MaterialCardView
+				android:id="@+id/cover_card"
 				android:layout_width="0dp"
 				android:layout_height="wrap_content"
-				android:ellipsize="end"
-				android:maxLines="4"
-				android:textAppearance="@style/TextAppearance.AppCompat.Body2"
-				android:textColor="?android:textColorPrimary"
-				android:textSize="20sp"
-				app:layout_constraintEnd_toEndOf="parent"
-				app:layout_constraintStart_toStartOf="parent"
-				app:layout_constraintTop_toTopOf="parent"
-				tools:text="@tools:sample/lorem[20]" />
-
-			<TextView
-				android:id="@+id/textView_subtitle"
-				android:layout_width="0dp"
-				android:layout_height="wrap_content"
-				android:layout_marginTop="4dp"
-				android:ellipsize="end"
-				android:maxLines="2"
-				android:textSize="14sp"
-				app:layout_constraintEnd_toEndOf="@id/textView_title"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/textView_title"
-				tools:text="@tools:sample/lorem[20]" />
-
-			<TextView
-				android:id="@+id/textView_author"
-				android:layout_width="0dp"
-				android:layout_height="wrap_content"
-				android:layout_marginTop="4dp"
-				android:requiresFadingEdge="horizontal"
-				android:singleLine="true"
-				android:textColor="?colorAccent"
-				android:textStyle="bold"
-				app:layout_constraintEnd_toEndOf="@id/textView_title"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/textView_subtitle"
-				tools:text="@tools:sample/full_names" />
-
-			<RatingBar
-				android:id="@+id/ratingBar"
-				style="@style/Widget.AppCompat.RatingBar.Small"
-				android:layout_width="wrap_content"
-				android:layout_height="wrap_content"
-				android:layout_marginTop="6dp"
-				android:isIndicator="true"
-				android:max="100"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/textView_author"
-				tools:progress="70" />
-
-		</androidx.constraintlayout.widget.ConstraintLayout>
-
-		<LinearLayout
-			android:id="@+id/info_layout"
-			android:layout_width="0dp"
-			android:layout_height="wrap_content"
-			android:baselineAligned="false"
-			android:divider="?android:dividerHorizontal"
-			android:dividerPadding="8dp"
-			android:orientation="horizontal"
-			android:paddingStart="8dp"
-			android:paddingEnd="8dp"
-			android:showDividers="middle"
-			app:layout_constraintBottom_toBottomOf="@+id/cover_card"
-			app:layout_constraintEnd_toEndOf="parent"
-			app:layout_constraintStart_toStartOf="@+id/guideline2">
-
-			<LinearLayout
-				android:id="@+id/rating_container"
+				android:layout_weight="1"
+				android:layout_margin="8dp"
+				app:cardCornerRadius="4dp"
+				app:cardElevation="4dp">
+
+				<org.koitharu.kotatsu.base.ui.widgets.CoverImageView
+					android:id="@+id/imageView_cover"
+					android:layout_width="match_parent"
+					android:layout_height="match_parent"
+					android:scaleType="centerCrop"
+					tools:background="@tools:sample/backgrounds/scenic"
+					tools:ignore="ContentDescription" />
+
+			</com.google.android.material.card.MaterialCardView>
+
+			<androidx.constraintlayout.widget.ConstraintLayout
+				android:id="@+id/text_container"
 				android:layout_width="0dp"
 				android:layout_height="wrap_content"
-				android:layout_gravity="center"
-				android:layout_weight="1"
-				android:gravity="center">
+				android:layout_weight="2"
+				android:layout_margin="8dp"
+				android:layout_gravity="center">
 
 				<TextView
-					android:id="@+id/textView_rating"
-					android:layout_width="wrap_content"
+					android:id="@+id/textView_title"
+					android:layout_width="0dp"
 					android:layout_height="wrap_content"
-					android:drawablePadding="4dp"
-					android:padding="4dp"
+					android:ellipsize="end"
+					android:textAppearance="@style/TextAppearance.AppCompat.Body2"
+					android:textColor="?android:textColorPrimary"
 					android:textSize="20sp"
-					app:drawableEndCompat="@drawable/ic_star_manga_info"
-					tools:text="4.8" />
-
-			</LinearLayout>
-
-			<LinearLayout
-				android:id="@+id/chapters_container"
-				android:layout_width="0dp"
-				android:layout_height="wrap_content"
-				android:layout_gravity="center"
-				android:layout_weight="1"
-				android:gravity="center">
+					app:layout_constraintEnd_toEndOf="parent"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toTopOf="parent"
+					tools:text="@tools:sample/lorem[30]" />
 
 				<TextView
-					android:id="@+id/textView_chapters"
-					android:layout_width="wrap_content"
+					android:id="@+id/textView_subtitle"
+					android:layout_width="0dp"
 					android:layout_height="wrap_content"
-					android:drawablePadding="4dp"
-					android:gravity="center_horizontal"
-					android:padding="4dp"
-					android:textSize="12sp"
-					app:drawableTopCompat="@drawable/ic_book_page"
-					tools:text="52 chapters" />
-
-			</LinearLayout>
-
-			<LinearLayout
-				android:id="@+id/source_container"
-				android:layout_width="0dp"
-				android:layout_height="wrap_content"
-				android:layout_gravity="center"
-				android:layout_weight="1"
-				android:gravity="center">
+					android:layout_marginTop="4dp"
+					android:ellipsize="end"
+					android:textSize="14sp"
+					app:layout_constraintEnd_toEndOf="@id/textView_title"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toBottomOf="@id/textView_title"
+					tools:text="@tools:sample/lorem[2]" />
 
 				<TextView
-					android:id="@+id/textView_source"
-					android:layout_width="wrap_content"
+					android:id="@+id/textView_author"
+					android:layout_width="0dp"
 					android:layout_height="wrap_content"
-					android:drawablePadding="4dp"
-					android:gravity="center_horizontal"
-					android:padding="4dp"
-					android:textSize="12sp"
-					app:drawableTopCompat="@drawable/ic_web"
-					tools:text="Source" />
-
-			</LinearLayout>
-
-			<LinearLayout
-				android:id="@+id/size_container"
-				android:layout_width="0dp"
-				android:layout_height="wrap_content"
-				android:layout_gravity="center"
-				android:layout_weight="1"
-				android:gravity="center">
-
-				<TextView
-					android:id="@+id/textView_size"
-					android:layout_width="wrap_content"
+					android:layout_marginTop="4dp"
+					android:requiresFadingEdge="horizontal"
+					android:textColor="?colorAccent"
+					android:textStyle="bold"
+					app:layout_constraintEnd_toEndOf="@id/textView_title"
+					app:layout_constraintStart_toStartOf="@id/textView_title"
+					app:layout_constraintTop_toBottomOf="@id/textView_subtitle"
+					tools:text="@tools:sample/full_names" />
+
+				<LinearLayout
+					android:id="@+id/info_layout"
+					android:layout_width="match_parent"
 					android:layout_height="wrap_content"
-					android:drawablePadding="4dp"
-					android:gravity="center_horizontal"
-					android:padding="4dp"
-					android:textSize="12sp"
-					app:drawableTopCompat="@drawable/ic_storage"
-					tools:text="1.8 GiB" />
-
-			</LinearLayout>
-
-		</LinearLayout>
-
-		<LinearLayout
-			android:id="@+id/buttons_layout"
-			android:layout_width="match_parent"
-			android:layout_height="48dp"
-			android:layout_marginStart="16dp"
-			android:layout_marginEnd="16dp"
-			android:gravity="center"
-			android:orientation="horizontal"
-			app:layout_constraintEnd_toEndOf="parent"
-			app:layout_constraintStart_toStartOf="parent"
-			app:layout_constraintTop_toBottomOf="@id/guideline">
-
-			<com.google.android.material.button.MaterialButton
-				android:id="@+id/button_favorite"
-				style="@style/Widget.MaterialComponents.Button.OutlinedButton"
-				android:layout_width="wrap_content"
-				android:layout_height="wrap_content"
-				android:layout_weight="1"
-				app:icon="@drawable/ic_heart_outline"
-				app:iconGravity="textTop"
-				app:iconPadding="0dp" />
-
-			<com.google.android.material.button.MaterialButton
-				android:id="@+id/button_read"
-				style="@style/Widget.MaterialComponents.Button"
-				android:layout_width="match_parent"
-				android:layout_height="wrap_content"
-				android:layout_marginStart="16dp"
-				android:layout_weight="1"
-				android:enabled="false"
-				android:text="@string/read"
-				android:textAllCaps="false"
-				app:elevation="0dp"
-				app:iconGravity="textStart"
-				app:iconPadding="8dp"
-				tools:text="@string/_continue" />
+					android:layout_marginTop="4dp"
+					android:baselineAligned="false"
+					android:divider="?android:dividerHorizontal"
+					android:dividerPadding="8dp"
+					android:orientation="horizontal"
+					android:showDividers="middle"
+					app:layout_constraintTop_toBottomOf="@+id/textView_author">
+
+					<LinearLayout
+						android:id="@+id/rating_container"
+						android:layout_width="0dp"
+						android:layout_height="wrap_content"
+						android:layout_gravity="center"
+						android:layout_weight="1"
+						android:gravity="center">
+
+						<TextView
+							android:id="@+id/textView_rating"
+							android:layout_width="wrap_content"
+							android:layout_height="wrap_content"
+							android:drawablePadding="4dp"
+							android:padding="4dp"
+							android:textSize="20sp"
+							app:drawableEndCompat="@drawable/ic_star_manga_info"
+							tools:text="4.8" />
+
+					</LinearLayout>
+
+					<LinearLayout
+						android:id="@+id/chapters_container"
+						android:layout_width="0dp"
+						android:layout_height="wrap_content"
+						android:layout_gravity="center"
+						android:layout_weight="1"
+						android:gravity="center">
+
+						<TextView
+							android:id="@+id/textView_chapters"
+							android:layout_width="wrap_content"
+							android:layout_height="wrap_content"
+							android:drawablePadding="4dp"
+							android:gravity="center_horizontal"
+							android:padding="4dp"
+							android:textSize="12sp"
+							app:drawableTopCompat="@drawable/ic_book_page"
+							tools:text="52 chapters" />
+
+					</LinearLayout>
+
+					<LinearLayout
+						android:id="@+id/source_container"
+						android:layout_width="0dp"
+						android:layout_height="wrap_content"
+						android:layout_gravity="center"
+						android:layout_weight="1"
+						android:gravity="center">
+
+						<TextView
+							android:id="@+id/textView_source"
+							android:layout_width="wrap_content"
+							android:layout_height="wrap_content"
+							android:drawablePadding="4dp"
+							android:gravity="center_horizontal"
+							android:padding="4dp"
+							android:textSize="12sp"
+							app:drawableTopCompat="@drawable/ic_web"
+							tools:text="Source" />
+
+					</LinearLayout>
+
+					<LinearLayout
+						android:id="@+id/size_container"
+						android:layout_width="0dp"
+						android:layout_height="wrap_content"
+						android:layout_gravity="center"
+						android:layout_weight="1"
+						android:gravity="center">
+
+						<TextView
+							android:id="@+id/textView_size"
+							android:layout_width="wrap_content"
+							android:layout_height="wrap_content"
+							android:drawablePadding="4dp"
+							android:gravity="center_horizontal"
+							android:padding="4dp"
+							android:textSize="12sp"
+							app:drawableTopCompat="@drawable/ic_storage"
+							tools:text="1.8 GiB" />
+
+					</LinearLayout>
+
+				</LinearLayout>
+
+				<LinearLayout
+					android:id="@+id/buttons_layout"
+					android:layout_width="match_parent"
+					android:layout_height="48dp"
+					android:layout_marginTop="4dp"
+					android:gravity="center"
+					android:orientation="horizontal"
+					app:layout_constraintEnd_toEndOf="parent"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toBottomOf="@id/info_layout">
+
+					<com.google.android.material.button.MaterialButton
+						android:id="@+id/button_favorite"
+						style="@style/Widget.MaterialComponents.Button.OutlinedButton"
+						android:layout_width="wrap_content"
+						android:layout_height="wrap_content"
+						android:layout_weight="1"
+						app:icon="@drawable/ic_heart_outline"
+						app:iconGravity="textTop"
+						app:iconPadding="0dp" />
+
+					<com.google.android.material.button.MaterialButton
+						android:id="@+id/button_read"
+						style="@style/Widget.MaterialComponents.Button"
+						android:layout_width="match_parent"
+						android:layout_height="wrap_content"
+						android:layout_marginStart="16dp"
+						android:layout_weight="1"
+						android:enabled="false"
+						android:text="@string/read"
+						android:textAllCaps="false"
+						app:elevation="0dp"
+						app:iconGravity="textStart"
+						app:iconPadding="8dp"
+						tools:text="@string/_continue" />
+
+				</LinearLayout>
+
+			</androidx.constraintlayout.widget.ConstraintLayout>
 
 		</LinearLayout>
 
@@ -267,7 +239,7 @@
 			app:chipSpacingVertical="6dp"
 			app:layout_constraintEnd_toEndOf="parent"
 			app:layout_constraintStart_toStartOf="parent"
-			app:layout_constraintTop_toBottomOf="@+id/buttons_layout" />
+			app:layout_constraintTop_toBottomOf="@+id/main_container" />
 
 		<TextView
 			android:id="@+id/desc_header"
diff --git a/app/src/main/res/layout/fragment_details.xml b/app/src/main/res/layout/fragment_details.xml
index abdcff043..2817343e2 100644
--- a/app/src/main/res/layout/fragment_details.xml
+++ b/app/src/main/res/layout/fragment_details.xml
@@ -12,116 +12,90 @@
 		android:layout_width="match_parent"
 		android:layout_height="match_parent">
 
-		<View
-			android:id="@+id/guideline"
-			android:layout_width="0dp"
-			android:layout_height="0dp"
-			app:layout_constraintTop_toBottomOf="@+id/cover_card"
-			tools:ignore="MissingConstraints" />
-
-		<androidx.constraintlayout.widget.Guideline
-			android:id="@+id/guideline2"
-			android:layout_width="wrap_content"
-			android:layout_height="wrap_content"
-			android:orientation="vertical"
-			app:layout_constraintGuide_percent="0.36" />
-
-		<com.google.android.material.card.MaterialCardView
-			android:id="@+id/cover_card"
-			android:layout_width="0dp"
+		<LinearLayout
+			android:id="@+id/main_container"
+			android:layout_width="match_parent"
 			android:layout_height="0dp"
-			android:layout_marginStart="16dp"
-			android:layout_marginTop="16dp"
-			android:layout_marginEnd="16dp"
-			app:cardCornerRadius="4dp"
-			app:cardElevation="4dp"
-			app:layout_constraintDimensionRatio="13:18"
-			app:layout_constraintEnd_toStartOf="@id/guideline2"
+			android:layout_margin="8dp"
+			android:gravity="center_horizontal"
+			android:orientation="horizontal"
+			android:weightSum="3"
+			app:layout_constraintEnd_toEndOf="parent"
 			app:layout_constraintStart_toStartOf="parent"
-			app:layout_constraintTop_toBottomOf="@+id/progressBar">
+			app:layout_constraintTop_toTopOf="parent">
 
-			<ImageView
-				android:id="@+id/imageView_cover"
-				android:layout_width="match_parent"
-				android:layout_height="match_parent"
-				android:scaleType="centerCrop"
-				tools:background="@tools:sample/backgrounds/scenic"
-				tools:ignore="ContentDescription" />
+			<com.google.android.material.card.MaterialCardView
+				android:id="@+id/cover_card"
+				android:layout_width="0dp"
+				android:layout_height="wrap_content"
+				android:layout_margin="8dp"
+				android:layout_weight="1"
+				app:cardCornerRadius="4dp"
+				app:cardElevation="4dp">
 
-		</com.google.android.material.card.MaterialCardView>
+				<org.koitharu.kotatsu.base.ui.widgets.CoverImageView
+					android:id="@+id/imageView_cover"
+					android:layout_width="match_parent"
+					android:layout_height="match_parent"
+					android:scaleType="centerCrop"
+					tools:background="@tools:sample/backgrounds/scenic"
+					tools:ignore="ContentDescription" />
 
-		<androidx.constraintlayout.widget.ConstraintLayout
-			android:id="@+id/text_container"
-			android:layout_width="0dp"
-			android:layout_height="159dp"
-			android:layout_marginEnd="16dp"
-			android:layout_marginBottom="8dp"
-			app:layout_constraintBottom_toBottomOf="@+id/cover_card"
-			app:layout_constraintEnd_toEndOf="parent"
-			app:layout_constraintStart_toStartOf="@+id/guideline2"
-			app:layout_constraintTop_toTopOf="@+id/cover_card"
-			app:layout_constraintVertical_bias="0.0">
+			</com.google.android.material.card.MaterialCardView>
 
-			<TextView
-				android:id="@+id/textView_title"
-				android:layout_width="0dp"
-				android:layout_height="wrap_content"
-				android:ellipsize="end"
-				android:maxLines="3"
-				android:textAppearance="@style/TextAppearance.AppCompat.Body2"
-				android:textColor="?android:textColorPrimary"
-				android:textSize="20sp"
-				app:layout_constraintEnd_toEndOf="parent"
-				app:layout_constraintStart_toStartOf="parent"
-				app:layout_constraintTop_toTopOf="parent"
-				tools:text="@tools:sample/lorem/random" />
-
-			<TextView
-				android:id="@+id/textView_subtitle"
-				android:layout_width="0dp"
-				android:layout_height="wrap_content"
-				android:layout_marginTop="4dp"
-				android:ellipsize="end"
-				android:maxLines="2"
-				android:textSize="14sp"
-				app:layout_constraintEnd_toEndOf="@id/textView_title"
-				app:layout_constraintStart_toStartOf="@+id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/textView_title"
-				tools:text="@tools:sample/lorem/random" />
-
-			<TextView
-				android:id="@+id/textView_author"
+			<androidx.constraintlayout.widget.ConstraintLayout
+				android:id="@+id/text_container"
 				android:layout_width="0dp"
 				android:layout_height="wrap_content"
-				android:layout_marginTop="4dp"
-				android:maxLines="2"
-				android:requiresFadingEdge="horizontal"
-				android:textColor="?colorAccent"
-				android:textStyle="bold"
-				app:layout_constraintEnd_toEndOf="@id/textView_title"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/textView_subtitle"
-				tools:text="@tools:sample/full_names" />
-
-			<RatingBar
-				android:id="@+id/ratingBar"
-				style="@style/Widget.AppCompat.RatingBar.Small"
-				android:layout_width="wrap_content"
-				android:layout_height="wrap_content"
-				android:layout_marginTop="6dp"
-				android:isIndicator="true"
-				android:max="100"
-				app:layout_constraintStart_toStartOf="@id/textView_title"
-				app:layout_constraintTop_toBottomOf="@id/textView_author"
-				tools:progress="70" />
+				android:layout_marginStart="8dp"
+				android:layout_weight="2">
+
+				<TextView
+					android:id="@+id/textView_title"
+					android:layout_width="0dp"
+					android:layout_height="wrap_content"
+					android:ellipsize="end"
+					android:textAppearance="@style/TextAppearance.AppCompat.Body2"
+					android:textColor="?android:textColorPrimary"
+					android:textSize="20sp"
+					app:layout_constraintEnd_toEndOf="parent"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toTopOf="parent"
+					tools:text="@tools:sample/lorem[15]" />
+
+				<TextView
+					android:id="@+id/textView_subtitle"
+					android:layout_width="0dp"
+					android:layout_height="wrap_content"
+					android:layout_marginTop="4dp"
+					android:ellipsize="end"
+					android:textSize="14sp"
+					app:layout_constraintEnd_toEndOf="@id/textView_title"
+					app:layout_constraintStart_toStartOf="parent"
+					app:layout_constraintTop_toBottomOf="@id/textView_title"
+					tools:text="@tools:sample/lorem[12]" />
+
+				<TextView
+					android:id="@+id/textView_author"
+					android:layout_width="0dp"
+					android:layout_height="wrap_content"
+					android:layout_marginTop="4dp"
+					android:requiresFadingEdge="horizontal"
+					android:textColor="?colorAccent"
+					android:textStyle="bold"
+					app:layout_constraintEnd_toEndOf="@id/textView_title"
+					app:layout_constraintStart_toStartOf="@id/textView_title"
+					app:layout_constraintTop_toBottomOf="@id/textView_subtitle"
+					tools:text="@tools:sample/full_names" />
+
+			</androidx.constraintlayout.widget.ConstraintLayout>
 
-		</androidx.constraintlayout.widget.ConstraintLayout>
+		</LinearLayout>
 
 		<LinearLayout
 			android:id="@+id/info_layout"
 			android:layout_width="match_parent"
 			android:layout_height="wrap_content"
-			android:layout_marginTop="8dp"
 			android:baselineAligned="false"
 			android:divider="?android:dividerHorizontal"
 			android:dividerPadding="8dp"
@@ -129,9 +103,7 @@
 			android:paddingStart="8dp"
 			android:paddingEnd="8dp"
 			android:showDividers="middle"
-			app:layout_constraintEnd_toEndOf="parent"
-			app:layout_constraintStart_toStartOf="parent"
-			app:layout_constraintTop_toBottomOf="@+id/text_container">
+			app:layout_constraintTop_toBottomOf="@+id/main_container">
 
 			<LinearLayout
 				android:id="@+id/rating_container"
@@ -222,8 +194,8 @@
 			android:id="@+id/buttons_layout"
 			android:layout_width="match_parent"
 			android:layout_height="48dp"
-			android:layout_marginStart="16dp"
-			android:layout_marginEnd="16dp"
+			android:paddingStart="16dp"
+			android:paddingEnd="16dp"
 			android:gravity="center"
 			android:orientation="horizontal"
 			app:layout_constraintEnd_toEndOf="parent"