app/views/anime/details.php

@@ -49,9 +49,7 @@
 				<h3><?= $title ?></h3>
 			<?php endforeach ?>
 			<br />
-			<div class="description">
-				<p><?= str_replace("\n", '</p><p>', $data['synopsis']) ?></p>
-			</div>
+			<p class="description"><?= nl2br($data['synopsis']) ?></p>
 			<?php if (count($data['streaming_links']) > 0): ?>
 				<hr />
 				<h4>Streaming on:</h4>

app/views/character/details.php

@@ -8,6 +8,12 @@ use Aviat\AnimeClient\API\Kitsu;
 	<section class="flex flex-no-wrap">
 		<div>
 			<?= $helper->picture("images/characters/{$data['id']}-original.webp") ?>
+			<?php if ( ! empty($data['otherNames'])): ?>
+				<h3>Nicknames / Other names</h3>
+				<?php foreach ($data['otherNames'] as $name): ?>
+					<h4><?= $name ?></h4>
+				<?php endforeach ?>
+			<?php endif ?>
 		</div>
 		<div>
 			<h2 class="toph"><?= $data['name'] ?></h2>
@@ -15,19 +21,9 @@ use Aviat\AnimeClient\API\Kitsu;
 				<h3><?= $name ?></h3>
 			<?php endforeach ?>
 
-			<?php if ( ! empty($data['otherNames'])): ?>
-				<h4>Also Known As:</h4>
-				<ul>
-				<?php foreach ($data['otherNames'] as $name): ?>
-					<li><h5><?= $name ?></h5></li>
-				<?php endforeach ?>
-				</ul>
-			<?php endif ?>
-			<br />
 			<hr />
-			<div class="description">
-				<p><?= str_replace("\n", '</p><p>', $data['description']) ?></p>
-			</div>
+
+			<p class="description"><?= $data['description'] ?></p>
 		</div>
 	</section>
 

app/views/manga/details.php

@@ -35,9 +35,7 @@
 			<?php endforeach ?>
 
 			<br />
-			<div class="description">
-				<p><?= str_replace("\n", '</p><p>', $data['synopsis']) ?></p>
-			</div>
+			<p><?= nl2br($data['synopsis']) ?></p>
 		</article>
 	</section>
 

public/css/general.css

@@ -21,7 +21,6 @@ body {
 	margin: 0.5em;
 }
 
-
 button {
 	background: #fff;
 	background: linear-gradient(#ddd, #eee, #fff, #eee, #ddd);
@@ -683,20 +682,7 @@ picture.cover {
 }
 
 .description {
-	/* max-width: 80rem;*/
-	columns: 4 28rem;
-	columns: 4 28em;
-	margin-bottom: 1.6em;
-	margin-bottom: 1.6rem;
-}
-
-p.description br + br {
-	page-break-before: avoid;
-	page-break-after: auto;
-	page-break-inside: avoid;
-	break-inside: avoid;
-	break-after: auto;
-	break-before: avoid;
+	max-width: 80rem;
 }
 
 .fixed {
@@ -834,9 +820,9 @@ aside.info picture, aside.info img {
 	margin: 0 auto;
 }
 
-/* aside.info + article {
+aside.info + article {
 	max-width: 66%;
-} */
+}
 
 /* ----------------------------------------------------------------------------
 	User page styles