Improved: Article summary. Cut the text with better CSS (#4666)

* phtml + css

* trim the white spaces that comes from stripping

app/views/helpers/index/normal/entry_header.phtml

@@ -62,9 +62,7 @@
 			?></span><?php
 		endif;
 		if ($topline_summary):
-			?><div class="summary">
-				<?= mb_substr(strip_tags($this->entry->content()), 0, 500, 'UTF-8') ?>
-			</div><?php
+			?><div class="summary"><?= trim(mb_substr(strip_tags($this->entry->content()), 0, 500, 'UTF-8')) ?></div><?php
 		endif;
 	?></a></li>
 	<?php if ($topline_date) { ?><li class="item date"><time datetime="<?= $this->entry->machineReadableDate() ?>"><?= $this->entry->date() ?></time>&nbsp;</li><?php } ?>

p/themes/base-theme/frss.css

@@ -1204,13 +1204,14 @@ a.website:hover .favicon {
 }
 
 .flux .item.title .summary {
-	max-height: 3em;
+	display: -webkit-box;
 	color: var(--frss-font-color-grey-dark);
 	font-size: 0.9rem;
 	font-weight: normal;
-	white-space: initial;
-	overflow: hidden;
 	text-overflow: ellipsis;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
+	white-space: break-spaces;
 }
 
 .flux .item.title .author {

p/themes/base-theme/frss.rtl.css

@@ -1204,13 +1204,14 @@ a.website:hover .favicon {
 }
 
 .flux .item.title .summary {
-	max-height: 3em;
+	display: -webkit-box;
 	color: var(--frss-font-color-grey-dark);
 	font-size: 0.9rem;
 	font-weight: normal;
-	white-space: initial;
-	overflow: hidden;
 	text-overflow: ellipsis;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
+	white-space: break-spaces;
 }
 
 .flux .item.title .author {