fixes jumping lines (#4782)

* fixes

* fix template

* fix frss.css

* fix Nord theme

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

@@ -50,7 +50,7 @@
 
 	<li class="item title<?= (($topline_thumbnail !== 'none') || $topline_summary) ? ' multiline' : '' ?>" dir="auto"><a target="_blank" rel="noreferrer" href="<?= $this->entry->link() ?>" class="item-element"><?= $this->entry->title() ?><?php
 		if ($topline_display_authors):
-			?><span class="item-element author"><?php
+			?><span class="author"><?php
 			$authors = $this->entry->authors();
 			if (is_array($authors)) {
 				$first = true;
@@ -62,7 +62,7 @@
 			?></span><?php
 		endif;
 		if ($topline_summary):
-			?><div class="item-element summary"><?= trim(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() ?>" class="item-element"><?= $this->entry->date() ?></time>&nbsp;</li><?php } ?>

p/themes/Alternative-Dark/adark.css

@@ -801,10 +801,6 @@ kbd {
 	font-size: 0.9rem;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .website a:hover .favicon,
 .flux a.website:hover .favicon {
 	filter: grayscale(50%);

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

@@ -801,10 +801,6 @@ kbd {
 	font-size: 0.9rem;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .website a:hover .favicon,
 .flux a.website:hover .favicon {
 	filter: grayscale(50%);

p/themes/Ansum/_list-view.scss

@@ -16,7 +16,6 @@
 
 		&:not(.current):hover .item.title {
 			background: variables.$grey-lighter;
-			bottom: 3px;
 		}
 	}
 
@@ -70,10 +69,6 @@
 			color: variables.$main-font-color;
 			opacity: 0.75;
 		}
-
-		.favicon {
-			padding: 5px;
-		}
 	}
 
 	.item.date {

p/themes/Ansum/ansum.css

@@ -459,7 +459,7 @@ form th {
 }
 .tree .tree-folder {
 	border-bottom: 1px solid #f0e7da;
-	box-shadow: inset -1px -11px 8px #0003;
+	box-shadow: inset -1px -11px 8px rgba(0, 0, 0, 0.2);
 }
 .tree .tree-folder .tree-folder-title {
 	padding: 12px 16px;
@@ -987,7 +987,6 @@ main.prompt {
 }
 .flux:hover:not(.current):hover .item.title {
 	background: #fcfaf8;
-	bottom: 3px;
 }
 .flux.current {
 	background: #fff;
@@ -1022,9 +1021,6 @@ main.prompt {
 	color: #363330;
 	opacity: 0.75;
 }
-.flux .website .favicon {
-	padding: 5px;
-}
 .flux .item.date {
 	color: rgba(54, 51, 48, 0.5);
 	font-size: 0.85rem;
@@ -1208,7 +1204,6 @@ main.prompt {
 	.form-group .group-name {
 		text-align: left;
 	}
-
 	.aside {
 		transition: all 0.2s ease-in-out;
 	}
@@ -1218,7 +1213,6 @@ main.prompt {
 	.aside .tree .tree-folder .tree-folder-items .item a {
 		padding: 0.5rem 1rem;
 	}
-
 	.aside .toggle_aside,
 #panel .close,
 .dropdown-menu .toggle_aside,
@@ -1237,7 +1231,6 @@ main.prompt {
 #slider .toggle_aside .icon {
 		filter: grayscale(100%) brightness(2.5);
 	}
-
 	.header {
 		padding: 0.5rem;
 		height: 8rem;
@@ -1262,16 +1255,13 @@ main.prompt {
 		min-height: 49px;
 		padding: 0.5rem 2rem;
 	}
-
 	#global {
 		height: calc(100% - 8rem);
 	}
-
 	.post {
 		padding-left: 1rem;
 		padding-right: 1rem;
 	}
-
 	.nav_menu .btn {
 		margin: 0;
 		padding: 0.85rem 1.25rem;
@@ -1297,11 +1287,9 @@ main.prompt {
 	.nav_menu .search .input:focus {
 		width: 400px;
 	}
-
 	#stream .flux .flux_header {
 		padding: 0.5rem 0;
 	}
-
 	.dropdown-target:target ~ .dropdown-toggle::after {
 		background-color: #fcfaf8;
 		border-top: 1px solid #f5f0ec;
@@ -1315,7 +1303,6 @@ main.prompt {
 	.dropdown-target:target ~ a.dropdown-toggle:not(.btn)::after {
 		bottom: -17px;
 	}
-
 	.day {
 		text-align: center;
 		padding: 1rem 0;
@@ -1327,11 +1314,9 @@ main.prompt {
 		line-height: 1.5rem;
 		margin-bottom: 1rem;
 	}
-
 	#nav_entries {
 		line-height: 4.5rem;
 	}
-
 	.notification {
 		border-radius: 0;
 	}

p/themes/Ansum/ansum.rtl.css

@@ -459,7 +459,7 @@ form th {
 }
 .tree .tree-folder {
 	border-bottom: 1px solid #f0e7da;
-	box-shadow: inset 1px -11px 8px #0003;
+	box-shadow: inset 1px -11px 8px rgba(0, 0, 0, 0.2);
 }
 .tree .tree-folder .tree-folder-title {
 	padding: 12px 16px;
@@ -987,7 +987,6 @@ main.prompt {
 }
 .flux:hover:not(.current):hover .item.title {
 	background: #fcfaf8;
-	bottom: 3px;
 }
 .flux.current {
 	background: #fff;
@@ -1022,9 +1021,6 @@ main.prompt {
 	color: #363330;
 	opacity: 0.75;
 }
-.flux .website .favicon {
-	padding: 5px;
-}
 .flux .item.date {
 	color: rgba(54, 51, 48, 0.5);
 	font-size: 0.85rem;
@@ -1208,7 +1204,6 @@ main.prompt {
 	.form-group .group-name {
 		text-align: right;
 	}
-
 	.aside {
 		transition: all 0.2s ease-in-out;
 	}
@@ -1218,7 +1213,6 @@ main.prompt {
 	.aside .tree .tree-folder .tree-folder-items .item a {
 		padding: 0.5rem 1rem;
 	}
-
 	.aside .toggle_aside,
 #panel .close,
 .dropdown-menu .toggle_aside,
@@ -1237,7 +1231,6 @@ main.prompt {
 #slider .toggle_aside .icon {
 		filter: grayscale(100%) brightness(2.5);
 	}
-
 	.header {
 		padding: 0.5rem;
 		height: 8rem;
@@ -1262,16 +1255,13 @@ main.prompt {
 		min-height: 49px;
 		padding: 0.5rem 2rem;
 	}
-
 	#global {
 		height: calc(100% - 8rem);
 	}
-
 	.post {
 		padding-right: 1rem;
 		padding-left: 1rem;
 	}
-
 	.nav_menu .btn {
 		margin: 0;
 		padding: 0.85rem 1.25rem;
@@ -1297,11 +1287,9 @@ main.prompt {
 	.nav_menu .search .input:focus {
 		width: 400px;
 	}
-
 	#stream .flux .flux_header {
 		padding: 0.5rem 0;
 	}
-
 	.dropdown-target:target ~ .dropdown-toggle::after {
 		background-color: #fcfaf8;
 		border-top: 1px solid #f5f0ec;
@@ -1315,7 +1303,6 @@ main.prompt {
 	.dropdown-target:target ~ a.dropdown-toggle:not(.btn)::after {
 		bottom: -17px;
 	}
-
 	.day {
 		text-align: center;
 		padding: 1rem 0;
@@ -1327,11 +1314,9 @@ main.prompt {
 		line-height: 1.5rem;
 		margin-bottom: 1rem;
 	}
-
 	#nav_entries {
 		line-height: 4.5rem;
 	}
-
 	.notification {
 		border-radius: 0;
 	}

p/themes/BlueLagoon/BlueLagoon.css

@@ -861,10 +861,6 @@ a.btn {
 	font-size: 0.9rem;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .item.date {
 	color: #666;
 	font-size: 0.7rem;

p/themes/BlueLagoon/BlueLagoon.rtl.css

@@ -861,10 +861,6 @@ a.btn {
 	font-size: 0.9rem;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .item.date {
 	color: #666;
 	font-size: 0.7rem;

p/themes/Dark/dark.css

@@ -748,10 +748,6 @@ a.btn {
 	color: #888;
 }
 
-.flux .website .favicon {
-	margin: 5px;
-}
-
 .flux .item.date {
 	color: #666;
 	font-size: 0.7rem;

p/themes/Dark/dark.rtl.css

@@ -748,10 +748,6 @@ a.btn {
 	color: #888;
 }
 
-.flux .website .favicon {
-	margin: 5px;
-}
-
 .flux .item.date {
 	color: #666;
 	font-size: 0.7rem;

p/themes/Flat/flat.css

@@ -771,10 +771,6 @@ a.btn {
 	font-size: 0.9rem;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .item.date {
 	color: #666;
 	font-size: 0.7rem;

p/themes/Flat/flat.rtl.css

@@ -771,10 +771,6 @@ a.btn {
 	font-size: 0.9rem;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .item.date {
 	color: #666;
 	font-size: 0.7rem;

p/themes/Mapco/_list-view.scss

@@ -15,7 +15,6 @@
 
 		&:not(.current):hover .item.title {
 			background: variables.$grey-lighter;
-			bottom: 3px;
 		}
 	}
 
@@ -70,10 +69,6 @@
 			color: variables.$main-font-color;
 			opacity: 0.75;
 		}
-
-		.favicon {
-			padding: 5px;
-		}
 	}
 
 	.item.date {

p/themes/Mapco/mapco.css

@@ -1005,7 +1005,6 @@ main.prompt {
 }
 .flux:hover:not(.current):hover .item.title {
 	background: #f9fafb;
-	bottom: 3px;
 }
 .flux.current {
 	background: #f9fafb;
@@ -1040,9 +1039,6 @@ main.prompt {
 	color: #303136;
 	opacity: 0.75;
 }
-.flux .website .favicon {
-	padding: 5px;
-}
 .flux .item.date {
 	color: rgba(48, 49, 54, 0.5);
 	font-size: 0.85rem;
@@ -1226,7 +1222,6 @@ main.prompt {
 	.form-group .group-name {
 		text-align: left;
 	}
-
 	.aside {
 		transition: all 0.2s ease-in-out;
 	}
@@ -1236,7 +1231,6 @@ main.prompt {
 	.aside .tree .tree-folder .tree-folder-items .item a {
 		padding: 0.5rem 1rem;
 	}
-
 	.aside .toggle_aside,
 #panel .close,
 .dropdown-menu .toggle_aside,
@@ -1255,7 +1249,6 @@ main.prompt {
 #slider .toggle_aside .icon {
 		filter: grayscale(100%) brightness(2.5);
 	}
-
 	.header {
 		padding: 0.5rem;
 		height: 8rem;
@@ -1276,22 +1269,18 @@ main.prompt {
 	.header .item.search input:focus {
 		width: 100%;
 	}
-
 	#global {
 		height: calc(100% - 8rem);
 	}
-
 	main.prompt {
 		max-width: 100%;
 		min-width: auto;
 		width: 75%;
 	}
-
 	.post {
 		padding-left: 1rem;
 		padding-right: 1rem;
 	}
-
 	.nav_menu .btn {
 		margin: 0;
 		padding: 0.85rem 1.25rem;
@@ -1317,11 +1306,9 @@ main.prompt {
 	.nav_menu .search .input:focus {
 		width: 400px;
 	}
-
 	#stream .flux .flux_header {
 		padding: 0.5rem 0;
 	}
-
 	.dropdown-target:target ~ .dropdown-toggle::after {
 		background-color: #f9fafb;
 		border-top: 1px solid #eff0f2;
@@ -1335,7 +1322,6 @@ main.prompt {
 	.dropdown-target:target ~ a.dropdown-toggle:not(.btn)::after {
 		bottom: -17px;
 	}
-
 	.day {
 		text-align: center;
 		padding: 1rem 0;
@@ -1347,11 +1333,9 @@ main.prompt {
 		line-height: 1.5rem;
 		margin-bottom: 1rem;
 	}
-
 	#nav_entries {
 		line-height: 4.5rem;
 	}
-
 	.notification {
 		border-radius: 0;
 	}

p/themes/Mapco/mapco.rtl.css

@@ -1005,7 +1005,6 @@ main.prompt {
 }
 .flux:hover:not(.current):hover .item.title {
 	background: #f9fafb;
-	bottom: 3px;
 }
 .flux.current {
 	background: #f9fafb;
@@ -1040,9 +1039,6 @@ main.prompt {
 	color: #303136;
 	opacity: 0.75;
 }
-.flux .website .favicon {
-	padding: 5px;
-}
 .flux .item.date {
 	color: rgba(48, 49, 54, 0.5);
 	font-size: 0.85rem;
@@ -1226,7 +1222,6 @@ main.prompt {
 	.form-group .group-name {
 		text-align: right;
 	}
-
 	.aside {
 		transition: all 0.2s ease-in-out;
 	}
@@ -1236,7 +1231,6 @@ main.prompt {
 	.aside .tree .tree-folder .tree-folder-items .item a {
 		padding: 0.5rem 1rem;
 	}
-
 	.aside .toggle_aside,
 #panel .close,
 .dropdown-menu .toggle_aside,
@@ -1255,7 +1249,6 @@ main.prompt {
 #slider .toggle_aside .icon {
 		filter: grayscale(100%) brightness(2.5);
 	}
-
 	.header {
 		padding: 0.5rem;
 		height: 8rem;
@@ -1276,22 +1269,18 @@ main.prompt {
 	.header .item.search input:focus {
 		width: 100%;
 	}
-
 	#global {
 		height: calc(100% - 8rem);
 	}
-
 	main.prompt {
 		max-width: 100%;
 		min-width: auto;
 		width: 75%;
 	}
-
 	.post {
 		padding-right: 1rem;
 		padding-left: 1rem;
 	}
-
 	.nav_menu .btn {
 		margin: 0;
 		padding: 0.85rem 1.25rem;
@@ -1317,11 +1306,9 @@ main.prompt {
 	.nav_menu .search .input:focus {
 		width: 400px;
 	}
-
 	#stream .flux .flux_header {
 		padding: 0.5rem 0;
 	}
-
 	.dropdown-target:target ~ .dropdown-toggle::after {
 		background-color: #f9fafb;
 		border-top: 1px solid #eff0f2;
@@ -1335,7 +1322,6 @@ main.prompt {
 	.dropdown-target:target ~ a.dropdown-toggle:not(.btn)::after {
 		bottom: -17px;
 	}
-
 	.day {
 		text-align: center;
 		padding: 1rem 0;
@@ -1347,11 +1333,9 @@ main.prompt {
 		line-height: 1.5rem;
 		margin-bottom: 1rem;
 	}
-
 	#nav_entries {
 		line-height: 4.5rem;
 	}
-
 	.notification {
 		border-radius: 0;
 	}

p/themes/Nord/nord.css

@@ -557,7 +557,12 @@ li.item.active {
 }
 
 .flux .website .favicon {
-	padding: 3px;
+	padding: 0.25rem;
+	position: absolute;
+}
+
+.flux .website span {
+	margin-left: 2rem;
 }
 
 .flux .item.date {
@@ -579,10 +584,6 @@ li.item.active {
 
 }
 
-.flux .item {
-	line-height: 30px;
-}
-
 .flux.current {
 	background: var(--accent-bg);
 }
@@ -590,7 +591,6 @@ li.item.active {
 .flux:not(.current):hover .item.title {
 	background: var(--accent-bg);
 	transition: .4s;
-	bottom: 0;
 }
 
 .flux .item.title a {

p/themes/Nord/nord.rtl.css

@@ -557,7 +557,12 @@ li.item.active {
 }
 
 .flux .website .favicon {
-	padding: 3px;
+	padding: 0.25rem;
+	position: absolute;
+}
+
+.flux .website span {
+	margin-right: 2rem;
 }
 
 .flux .item.date {
@@ -579,10 +584,6 @@ li.item.active {
 
 }
 
-.flux .item {
-	line-height: 30px;
-}
-
 .flux.current {
 	background: var(--accent-bg);
 }
@@ -590,7 +591,6 @@ li.item.active {
 .flux:not(.current):hover .item.title {
 	background: var(--accent-bg);
 	transition: .4s;
-	bottom: 0;
 }
 
 .flux .item.title a {

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

@@ -122,10 +122,6 @@ a.btn,
 
 /*=== Index menu */
 /*=== Feed articles */
-.flux_header {
-	font-size: 0.8rem;
-}
-
 .flux .item {
 	padding: 0;
 }
@@ -167,12 +163,8 @@ a.btn,
 	max-height: 1.5em;
 }
 
-.flux:not(.current):hover .item.title {
-	bottom: 0;
-}
-
-.flux .item.title .item-element {
-	padding: 0;
+.flux .flux_header .item .item-element {
+	padding: 0.25rem 0;
 }
 
 /*=== Content of feed articles */

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

@@ -122,10 +122,6 @@ a.btn,
 
 /*=== Index menu */
 /*=== Feed articles */
-.flux_header {
-	font-size: 0.8rem;
-}
-
 .flux .item {
 	padding: 0;
 }
@@ -167,12 +163,8 @@ a.btn,
 	max-height: 1.5em;
 }
 
-.flux:not(.current):hover .item.title {
-	bottom: 0;
-}
-
-.flux .item.title .item-element {
-	padding: 0;
+.flux .flux_header .item .item-element {
+	padding: 0.25rem 0;
 }
 
 /*=== Content of feed articles */

p/themes/Origine/origine.css

@@ -866,10 +866,6 @@ a:hover .icon {
 	cursor: pointer;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .item.date {
 	color: var(--font-color-grey);
 	font-size: 0.7rem;

p/themes/Origine/origine.rtl.css

@@ -866,10 +866,6 @@ a:hover .icon {
 	cursor: pointer;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .item.date {
 	color: var(--font-color-grey);
 	font-size: 0.7rem;

p/themes/Pafat/pafat.css

@@ -721,10 +721,6 @@ a.signin {
 	border-left: 3px solid #d9534f;
 }
 
-.flux:not(.current):hover .item.title {
-	bottom: 0;
-}
-
 .flux .item.title a, .flux.not_read:not(.current):hover .item.title {
 	color: #333;
 }

p/themes/Pafat/pafat.rtl.css

@@ -721,10 +721,6 @@ a.signin {
 	border-right: 3px solid #d9534f;
 }
 
-.flux:not(.current):hover .item.title {
-	bottom: 0;
-}
-
 .flux .item.title a, .flux.not_read:not(.current):hover .item.title {
 	color: #333;
 }

p/themes/Screwdriver/screwdriver.css

@@ -840,10 +840,6 @@ a.btn {
 	font-size: 0.9rem;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .item.date {
 	color: #666;
 	font-size: 0.7rem;

p/themes/Screwdriver/screwdriver.rtl.css

@@ -840,10 +840,6 @@ a.btn {
 	font-size: 0.9rem;
 }
 
-.flux .website .favicon {
-	padding: 5px;
-}
-
 .flux .item.date {
 	color: #666;
 	font-size: 0.7rem;

p/themes/Swage/swage.css

@@ -789,7 +789,6 @@ form th {
 .flux:hover:not(.current):hover .item.title,
 .flux .current:not(.current):hover .item.title {
 	background: #fff;
-	top: 0.15rem;
 }
 .flux.favorite:not(.current) {
 	background: #fff6da;
@@ -811,9 +810,6 @@ form th {
 	font-size: 0.8rem;
 	text-align: center;
 }
-.flux .website .favicon {
-	padding: 5px;
-}
 .flux label {
 	color: #fcfcfc;
 	cursor: pointer;
@@ -1205,4 +1201,4 @@ button.as-link {
 
 #slider label {
 	min-height: initial;
-}
+}

p/themes/Swage/swage.rtl.css

@@ -789,7 +789,6 @@ form th {
 .flux:hover:not(.current):hover .item.title,
 .flux .current:not(.current):hover .item.title {
 	background: #fff;
-	top: 0.15rem;
 }
 .flux.favorite:not(.current) {
 	background: #fff6da;
@@ -811,9 +810,6 @@ form th {
 	font-size: 0.8rem;
 	text-align: center;
 }
-.flux .website .favicon {
-	padding: 5px;
-}
 .flux label {
 	color: #fcfcfc;
 	cursor: pointer;
@@ -1205,4 +1201,4 @@ button.as-link {
 
 #slider label {
 	min-height: initial;
-}
+}

p/themes/Swage/swage.scss

@@ -1053,10 +1053,6 @@ form {
 		text-align: center;
 	}
 
-	.website .favicon {
-		padding: 5px;
-	}
-
 	label {
 		color: $color_light;
 		cursor: pointer;

p/themes/base-theme/frss.css

@@ -1124,6 +1124,11 @@ input[type="search"] {
 	white-space: nowrap;
 }
 
+.flux .flux_header .item .item-element {
+	padding: 0.5rem 0;
+	line-height: 1.5rem;
+}
+
 .flux .item.manage,
 .flux .item.link {
 	width: 40px;
@@ -1149,7 +1154,6 @@ a.website:hover .favicon {
 	background-color: var(--frss-background-color);
 	max-width: calc(100% - 320px);
 	position: absolute;
-	bottom: 2px;
 }
 
 .flux:not(.current):hover .item.title.multiline {
@@ -1218,7 +1222,6 @@ a.website:hover .favicon {
 .flux .item.title .author {
 	padding-left: 1rem;
 	color: var(--frss-font-color-grey-dark);
-	font-size: 0.9rem;
 	font-weight: normal;
 }
 

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

@@ -1124,6 +1124,11 @@ input[type="search"] {
 	white-space: nowrap;
 }
 
+.flux .flux_header .item .item-element {
+	padding: 0.5rem 0;
+	line-height: 1.5rem;
+}
+
 .flux .item.manage,
 .flux .item.link {
 	width: 40px;
@@ -1149,7 +1154,6 @@ a.website:hover .favicon {
 	background-color: var(--frss-background-color);
 	max-width: calc(100% - 320px);
 	position: absolute;
-	bottom: 2px;
 }
 
 .flux:not(.current):hover .item.title.multiline {
@@ -1218,7 +1222,6 @@ a.website:hover .favicon {
 .flux .item.title .author {
 	padding-right: 1rem;
 	color: var(--frss-font-color-grey-dark);
-	font-size: 0.9rem;
 	font-weight: normal;
 }