More improvements/fixes of Nord theme (#5754)

* fix favicon

* fix unread counter

* table border color

* fix/improve feed navigation

* drag-drop-marker

* hover nav_entries buttons

* fix tags icon

* border color for invalid input value

---------

Co-authored-by: math-gh <>

p/themes/Nord/nord.css

@@ -107,6 +107,12 @@ input, select, textarea {
 	vertical-align: middle;
 }
 
+input:invalid,
+select:invalid,
+textarea:invalid {
+	border-color: var(--nord11-aurora);
+}
+
 select {
 	padding-top: 10px;
 	padding-bottom: 9px;
@@ -162,7 +168,7 @@ table {
 }
 
 table tr {
-	border-bottom: 1px solid
+	border-bottom: 1px solid var(--border-elements);
 }
 
 table th, table td {
@@ -694,16 +700,18 @@ img.favicon {
 
 .item.feed.active {
 	background-color: var(--accent-bg);
-	font-weight: bold;
 }
 
 .item.feed.active a {
 	color: var(--highlight);
 }
 
+.item.feed.active .item-title {
+	font-weight: bold;
+}
+
 li.item.active {
 	background-color: var(--bg);
-	font-weight: bold;
 }
 
 .item.feed:hover {
@@ -711,6 +719,10 @@ li.item.active {
 	transition: .3s;
 }
 
+.feed .item-title:not([data-unread="0"]) {
+	font-weight: normal;
+}
+
 /*=== New article notification */
 #new-article {
 	font-size: 0.9em;
@@ -770,6 +782,10 @@ li.item.active {
 	position: absolute;
 }
 
+.flux .tags .icon {
+	padding: 0.25rem;
+}
+
 .flux .website span {
 	margin-left: 2rem;
 }
@@ -913,6 +929,10 @@ li.item.active {
 	line-height: 3em;
 }
 
+#nav_entries .item a:hover {
+	background-color: var(--bg);
+}
+
 #bigMarkAsRead {
 	text-decoration: none;
 }
@@ -1039,10 +1059,9 @@ li.item.active {
 }
 
 .drag-drop-marker {
-	margin: -1px;
+	border: 2px dashed var(--highlight);
 }
 
-
 /*BEGINS BASE.CSS*/
 
 /*=== GENERAL */
@@ -1122,16 +1141,27 @@ option {
 /*=== Aside main page (categories) */
 .aside_feed .tree-folder-title > .title:not([data-unread="0"])::after {
 	margin: 10px 0;
-	padding: 0 10px;
+	padding: 0 0.5rem;
 	font-size: 0.9rem;
 }
 
 .aside .category .title:not([data-unread="0"])::after,
 .aside .feed .item-title:not([data-unread="0"])::after {
+	margin: calc(var(--frss-padding-top-bottom)) 0 0 0;
 	text-align: right;
 	right: 0.25rem;
 }
 
+.aside .feed.active .item-title:not([data-unread="0"])::after {
+	color: var(--bg);
+	border: none;
+	background-color: var(--highlight);
+}
+
+.aside .feed.active:hover .item-title:not([data-unread="0"])::after {
+	background-color: var(--text);
+}
+
 /*=== Aside main page (feeds) */
 .aside_feed .tree-folder-items .dropdown-menu::after {
 	left: 2px;

p/themes/Nord/nord.rtl.css

@@ -107,6 +107,12 @@ input, select, textarea {
 	vertical-align: middle;
 }
 
+input:invalid,
+select:invalid,
+textarea:invalid {
+	border-color: var(--nord11-aurora);
+}
+
 select {
 	padding-top: 10px;
 	padding-bottom: 9px;
@@ -162,7 +168,7 @@ table {
 }
 
 table tr {
-	border-bottom: 1px solid
+	border-bottom: 1px solid var(--border-elements);
 }
 
 table th, table td {
@@ -694,16 +700,18 @@ img.favicon {
 
 .item.feed.active {
 	background-color: var(--accent-bg);
-	font-weight: bold;
 }
 
 .item.feed.active a {
 	color: var(--highlight);
 }
 
+.item.feed.active .item-title {
+	font-weight: bold;
+}
+
 li.item.active {
 	background-color: var(--bg);
-	font-weight: bold;
 }
 
 .item.feed:hover {
@@ -711,6 +719,10 @@ li.item.active {
 	transition: .3s;
 }
 
+.feed .item-title:not([data-unread="0"]) {
+	font-weight: normal;
+}
+
 /*=== New article notification */
 #new-article {
 	font-size: 0.9em;
@@ -770,6 +782,10 @@ li.item.active {
 	position: absolute;
 }
 
+.flux .tags .icon {
+	padding: 0.25rem;
+}
+
 .flux .website span {
 	margin-right: 2rem;
 }
@@ -913,6 +929,10 @@ li.item.active {
 	line-height: 3em;
 }
 
+#nav_entries .item a:hover {
+	background-color: var(--bg);
+}
+
 #bigMarkAsRead {
 	text-decoration: none;
 }
@@ -1039,10 +1059,9 @@ li.item.active {
 }
 
 .drag-drop-marker {
-	margin: -1px;
+	border: 2px dashed var(--highlight);
 }
 
-
 /*BEGINS BASE.CSS*/
 
 /*=== GENERAL */
@@ -1122,16 +1141,27 @@ option {
 /*=== Aside main page (categories) */
 .aside_feed .tree-folder-title > .title:not([data-unread="0"])::after {
 	margin: 10px 0;
-	padding: 0 10px;
+	padding: 0 0.5rem;
 	font-size: 0.9rem;
 }
 
 .aside .category .title:not([data-unread="0"])::after,
 .aside .feed .item-title:not([data-unread="0"])::after {
+	margin: calc(var(--frss-padding-top-bottom)) 0 0 0;
 	text-align: left;
 	left: 0.25rem;
 }
 
+.aside .feed.active .item-title:not([data-unread="0"])::after {
+	color: var(--bg);
+	border: none;
+	background-color: var(--highlight);
+}
+
+.aside .feed.active:hover .item-title:not([data-unread="0"])::after {
+	background-color: var(--text);
+}
+
 /*=== Aside main page (feeds) */
 .aside_feed .tree-folder-items .dropdown-menu::after {
 	right: 2px;

p/themes/base-theme/frss.css

@@ -1114,7 +1114,7 @@ input[type="search"] {
 
 .aside_feed .tree-folder-title .icon,
 .aside_feed .tree-folder-items .feed .icon {
-	padding: 0 0.5rem 0 0;
+	margin: 0 0.5rem 0 0;
 }
 
 .aside_feed .tree-folder-items .feed .favicon {
@@ -2330,8 +2330,8 @@ html.slider-active {
 	}
 
 	.aside_feed .tree-folder-items .feed .favicon {
-		margin: 0;
-		padding: 0 0.5rem 0 0;
+		margin: 0 0.5rem 0 0;
+		padding: 0;
 	}
 
 	.flux_header .item.website {

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

@@ -1114,7 +1114,7 @@ input[type="search"] {
 
 .aside_feed .tree-folder-title .icon,
 .aside_feed .tree-folder-items .feed .icon {
-	padding: 0 0 0 0.5rem;
+	margin: 0 0 0 0.5rem;
 }
 
 .aside_feed .tree-folder-items .feed .favicon {
@@ -2330,8 +2330,8 @@ html.slider-active {
 	}
 
 	.aside_feed .tree-folder-items .feed .favicon {
-		margin: 0;
-		padding: 0 0 0 0.5rem;
+		margin: 0 0 0 0.5rem;
+		padding: 0;
 	}
 
 	.flux_header .item.website {