Fix: global view unread article (#4559)

* template.css

* themes

p/themes/Alternative-Dark/adark.css

@@ -549,7 +549,8 @@ a.btn {
 }
 
 .aside.aside_feed .category .title:not([data-unread="0"])::after,
-.aside.aside_feed .feed .item-title:not([data-unread="0"])::after {
+.aside.aside_feed .feed .item-title:not([data-unread="0"])::after,
+.global .box.category .title:not([data-unread="0"])::after {
 	background-color: #171717;
 	color: #999;
 	border-color: #999;

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

@@ -549,7 +549,8 @@ a.btn {
 }
 
 .aside.aside_feed .category .title:not([data-unread="0"])::after,
-.aside.aside_feed .feed .item-title:not([data-unread="0"])::after {
+.aside.aside_feed .feed .item-title:not([data-unread="0"])::after,
+.global .box.category .title:not([data-unread="0"])::after {
 	background-color: #171717;
 	color: #999;
 	border-color: #999;

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

@@ -635,7 +635,8 @@ a.btn,
 }
 
 /*=== Aside main page (categories) */
-.aside.aside_feed .category .title:not([data-unread="0"])::after {
+.aside.aside_feed .category .title:not([data-unread="0"])::after,
+.global .box.category .title:not([data-unread="0"])::after {
 	margin: 0.5em 0 0 0;
 	background-color: #f6f6f6;
 	color: #444;

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

@@ -635,7 +635,8 @@ a.btn,
 }
 
 /*=== Aside main page (categories) */
-.aside.aside_feed .category .title:not([data-unread="0"])::after {
+.aside.aside_feed .category .title:not([data-unread="0"])::after,
+.global .box.category .title:not([data-unread="0"])::after {
 	margin: 0.5em 0 0 0;
 	background-color: #f6f6f6;
 	color: #444;

p/themes/Origine/origine.css

@@ -604,7 +604,8 @@ a.btn {
 }
 
 /*=== Aside main page (categories) */
-.aside.aside_feed .category .title:not([data-unread="0"])::after {
+.aside.aside_feed .category .title:not([data-unread="0"])::after,
+.global .box.category .title:not([data-unread="0"])::after {
 	background-color: #f6f6f6;
 	color: #444;
 }

p/themes/Origine/origine.rtl.css

@@ -604,7 +604,8 @@ a.btn {
 }
 
 /*=== Aside main page (categories) */
-.aside.aside_feed .category .title:not([data-unread="0"])::after {
+.aside.aside_feed .category .title:not([data-unread="0"])::after,
+.global .box.category .title:not([data-unread="0"])::after {
 	background-color: #f6f6f6;
 	color: #444;
 }

p/themes/Pafat/pafat.css

@@ -570,7 +570,8 @@ a.signin {
 }
 
 /*=== Aside main page (categories) */
-.aside_feed .tree-folder-title > .title:not([data-unread="0"])::after {
+.aside_feed .tree-folder-title > .title:not([data-unread="0"])::after,
+.global .box.category .title:not([data-unread="0"])::after {
 	margin: 0.5em 0 0 0;
 	background-color: white;
 	color: #428bca;

p/themes/Pafat/pafat.rtl.css

@@ -570,7 +570,8 @@ a.signin {
 }
 
 /*=== Aside main page (categories) */
-.aside_feed .tree-folder-title > .title:not([data-unread="0"])::after {
+.aside_feed .tree-folder-title > .title:not([data-unread="0"])::after,
+.global .box.category .title:not([data-unread="0"])::after {
 	margin: 0.5em 0 0 0;
 	background-color: white;
 	color: #428bca;

p/themes/base-theme/template.css

@@ -1712,8 +1712,8 @@ input:checked + .slide-container .properties {
 	color: white;
 }
 
-.category .title:not([data-unread="0"])::after,
-.feed .item-title:not([data-unread="0"])::after {
+.aside .category .title:not([data-unread="0"])::after,
+.aside .feed .item-title:not([data-unread="0"])::after {
 	margin: 0.75em 0 0 0;
 	padding: 5px 10px;
 	min-width: 20px;
@@ -1729,6 +1729,22 @@ input:checked + .slide-container .properties {
 	font-weight: initial;
 }
 
+.global .box.category .title:not([data-unread="0"])::after {
+	margin: 0.5rem 0 0 0;
+	padding: 5px 10px;
+	min-width: 20px;
+	display: block;
+	content: attr(data-unread);
+	position: absolute;
+	top: 0;
+	right: 10px;
+	text-align: center;
+	font-size: 0.75rem;
+	border-radius: 12px;
+	line-height: 1;
+	font-weight: initial;
+}
+
 .feed .item-title:not([data-unread="0"])::after {
 	margin: 1em 0 0 0;
 }

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

@@ -1712,8 +1712,8 @@ input:checked + .slide-container .properties {
 	color: white;
 }
 
-.category .title:not([data-unread="0"])::after,
-.feed .item-title:not([data-unread="0"])::after {
+.aside .category .title:not([data-unread="0"])::after,
+.aside .feed .item-title:not([data-unread="0"])::after {
 	margin: 0.75em 0 0 0;
 	padding: 5px 10px;
 	min-width: 20px;
@@ -1729,6 +1729,22 @@ input:checked + .slide-container .properties {
 	font-weight: initial;
 }
 
+.global .box.category .title:not([data-unread="0"])::after {
+	margin: 0.5rem 0 0 0;
+	padding: 5px 10px;
+	min-width: 20px;
+	display: block;
+	content: attr(data-unread);
+	position: absolute;
+	top: 0;
+	left: 10px;
+	text-align: center;
+	font-size: 0.75rem;
+	border-radius: 12px;
+	line-height: 1;
+	font-weight: initial;
+}
+
 .feed .item-title:not([data-unread="0"])::after {
 	margin: 1em 0 0 0;
 }