Show feed name inside the article (#3081)

* Show feed name inside the article

#fix https://github.com/FreshRSS/FreshRSS/issues/3079

* Normal view add date in subtitle

#fix
https://github.com/FreshRSS/FreshRSS/issues/3079#issuecomment-650109551

app/views/index/normal.phtml

@@ -72,20 +72,29 @@ $today = @strtotime('today');
 		?><div class="flux_content" dir="auto">
 			<div class="content <?= $content_width ?>">
 				<h1 class="title"><a target="_blank" rel="noreferrer" class="go_website" href="<?= $this->entry->link() ?>"><?= $this->entry->title() ?></a></h1>
-				<div class="author"><?php
-					$authors = $this->entry->authors();
-					if (is_array($authors)):
-						$first = true;
-						foreach ($authors as $author):
-							echo $first ? _t('gen.short.by_author') . ' ' : '· ';
-							$first = false;
-				?>
-<em><a href="<?= _url('index', 'index', 'search', 'author:' . str_replace(' ', '+', htmlspecialchars_decode($author, ENT_QUOTES))) ?>"><?= $author ?></a></em>
-				<?php	endforeach; ?>
-				</div><?php
-					endif;
+				<div class="subtitle">
+					<div class="website"><a href="<?= _url('index', 'index', 'get', 'f_' . $this->feed->id()) ?>">
+						<?php if (FreshRSS_Context::$user_conf->show_favicons): ?><img class="favicon" src="<?= $this->feed->favicon() ?>" alt="✇" loading="lazy" /><?php endif; ?>
+						<span><?= $this->feed->name() ?></span></a>
+					</div>
+					<div class="date"><?= $this->entry->date() ?></div>
+					<?php
+						$authors = $this->entry->authors();
+						if (!empty($authors) && is_array($authors)):
+							$first = true;
+					?>
+					<div class="author"><?php
+							foreach ($authors as $author):
+								echo $first ? _t('gen.short.by_author') . ' ' : '· ';
+								$first = false;
+					?>
+	<em><a href="<?= _url('index', 'index', 'search', 'author:' . str_replace(' ', '+', htmlspecialchars_decode($author, ENT_QUOTES))) ?>"><?= $author ?></a></em>
+					<?php	endforeach; ?>
+					</div><?php endif; ?>
+				</div>
+				<div class="text"><?php
 					echo $lazyload && $hidePosts ? lazyimg($this->entry->content()) : $this->entry->content();
-				?>
+				?></div>
 			</div><?php
 
 			$this->renderHelper('index/normal/entry_bottom');

app/views/index/reader.phtml

@@ -63,10 +63,9 @@ $content_width = FreshRSS_Context::$user_conf->content_width;
 						echo ' — ';
 					endif;
 					echo $item->date();
-				?></div>
-
+				?></div><div class="text">
 				<?= $item->content() ?>
-			</div>
+			</div></div>
 		</div>
 	</div><?php
 	endforeach;

p/themes/Alternative-Dark/adark.css

@@ -797,7 +797,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #ababab;
 	font-size: 0.7rem;
 }

p/themes/Alternative-Dark/adark.rtl.css

@@ -797,7 +797,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #ababab;
 	font-size: 0.7rem;
 }

p/themes/Ansum/ansum.css

@@ -1226,7 +1226,7 @@ form th {
 .flux .website .favicon {
   padding: 5px;
 }
-.flux .date {
+.flux .item.date {
   color: rgba(54, 51, 48, 0.5);
   font-size: 0.85rem;
 }

p/themes/Ansum/ansum.rtl.css

@@ -1227,7 +1227,7 @@ form th {
 .flux .website .favicon {
   padding: 5px;
 }
-.flux .date {
+.flux .item.date {
   color: rgba(54, 51, 48, 0.5);
   font-size: 0.85rem;
 }

p/themes/BlueLagoon/BlueLagoon.css

@@ -933,7 +933,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/BlueLagoon/BlueLagoon.rtl.css

@@ -941,7 +941,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Dark/dark.css

@@ -810,7 +810,7 @@ a.btn {
 	margin: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Dark/dark.rtl.css

@@ -810,7 +810,7 @@ a.btn {
 	margin: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Flat/flat.css

@@ -829,7 +829,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Flat/flat.rtl.css

@@ -829,7 +829,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Mapco/mapco.css

@@ -1234,7 +1234,7 @@ form th {
 .flux .website .favicon {
   padding: 5px;
 }
-.flux .date {
+.flux .item.date {
   color: rgba(48, 49, 54, 0.5);
   font-size: 0.85rem;
 }

p/themes/Mapco/mapco.rtl.css

@@ -1235,7 +1235,7 @@ form th {
 .flux .website .favicon {
   padding: 5px;
 }
-.flux .date {
+.flux .item.date {
   color: rgba(48, 49, 54, 0.5);
   font-size: 0.85rem;
 }

p/themes/Origine-compact/origine-compact.css

@@ -862,7 +862,7 @@ a.btn,
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Origine-compact/origine-compact.rtl.css

@@ -862,7 +862,7 @@ a.btn,
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Origine/origine.css

@@ -847,7 +847,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Origine/origine.rtl.css

@@ -847,7 +847,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Pafat/pafat.css

@@ -823,7 +823,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Pafat/pafat.rtl.css

@@ -823,7 +823,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Screwdriver/screwdriver.css

@@ -924,7 +924,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Screwdriver/screwdriver.rtl.css

@@ -932,7 +932,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	color: #666;
 	font-size: 0.7rem;
 }

p/themes/Swage/swage.css

@@ -753,7 +753,7 @@ form th {
 .flux.not_read:not(.current):hover .item.title {
   background: #fff3ed;
 }
-.flux .date {
+.flux .item.date {
   color: #969696;
   font-size: 0.7rem;
 }

p/themes/Swage/swage.rtl.css

@@ -753,7 +753,7 @@ form th {
 .flux.not_read:not(.current):hover .item.title {
   background: #fff3ed;
 }
-.flux .date {
+.flux .item.date {
   color: #969696;
   font-size: 0.7rem;
 }

p/themes/base-theme/base.css

@@ -653,7 +653,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	font-size: 0.7rem;
 }
 

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

@@ -653,7 +653,7 @@ a.btn {
 	padding: 5px;
 }
 
-.flux .date {
+.flux .item.date {
 	font-size: 0.7rem;
 }
 

p/themes/base-theme/template.css

@@ -781,6 +781,14 @@ input[type="search"] {
 	overflow: auto;
 }
 
+.subtitle > div {
+	display: inline;
+}
+
+.subtitle > div:not(:first-of-type)::before {
+	content: ' · ';
+}
+
 br {
 	line-height: 1em;
 }

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

@@ -719,7 +719,7 @@ input[type="search"] {
 }
 
 .flux .item.title .author {
-	padding-right: 1rem;
+	padding-left: 1rem;
 	color: #555;
 	font-size: .9rem;
 	font-weight: normal;
@@ -781,6 +781,14 @@ input[type="search"] {
 	overflow: auto;
 }
 
+.subtitle > div {
+	display: inline;
+}
+
+.subtitle > div:not(:first-of-type)::before {
+	content: ' · ';
+}
+
 br {
 	line-height: 1em;
 }