fix: CSS "content:" (#4985)

* fix

* frss.css

* improve bubble for unread articles in global  view

p/themes/Alternative-Dark/adark.css

@@ -582,7 +582,8 @@ kbd {
 
 .aside.aside_feed .category .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 {
+.global .box.category .title:not([data-unread="0"])::after,
+.global .feed .item-title:not([data-unread="0"])::after {
 	background-color: var(--background-color-dark);
 	color: var(--font-color-middle);
 }
@@ -991,6 +992,10 @@ kbd {
 	text-shadow: none;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	margin: 1rem 0px 0px;
+}
+
 /*=== Slider */
 #slider {
 	background: var(--background-color-dark);

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

@@ -582,7 +582,8 @@ kbd {
 
 .aside.aside_feed .category .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 {
+.global .box.category .title:not([data-unread="0"])::after,
+.global .feed .item-title:not([data-unread="0"])::after {
 	background-color: var(--background-color-dark);
 	color: var(--font-color-middle);
 }
@@ -991,6 +992,10 @@ kbd {
 	text-shadow: none;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	margin: 1rem 0px 0px;
+}
+
 /*=== Slider */
 #slider {
 	background: var(--background-color-dark);

p/themes/Ansum/_forms.scss

@@ -130,7 +130,6 @@ input.extend {
 	border-radius: 3px;
 
 	&::after {
-		content: "";
 		display: block;
 		clear: both;
 	}

p/themes/Ansum/ansum.css

@@ -173,7 +173,6 @@ input.extend {
 	border-radius: 3px;
 }
 .form-group::after {
-	content: "";
 	display: block;
 	clear: both;
 }

p/themes/Ansum/ansum.rtl.css

@@ -173,7 +173,6 @@ input.extend {
 	border-radius: 3px;
 }
 .form-group::after {
-	content: "";
 	display: block;
 	clear: both;
 }

p/themes/BlueLagoon/BlueLagoon.css

@@ -323,7 +323,6 @@ a.btn {
 	height: 10px;
 	border-top: 1px solid #171717;
 	border-left: 1px solid #171717;
-	content: "";
 	position: absolute;
 	top: -6px;
 	right: 13px;
@@ -1039,6 +1038,10 @@ a.btn {
 	color: #222;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	margin-top: 1rem;
+}
+
 /*=== PANEL */
 /*===========*/
 #panel {

p/themes/BlueLagoon/BlueLagoon.rtl.css

@@ -323,7 +323,6 @@ a.btn {
 	height: 10px;
 	border-top: 1px solid #171717;
 	border-right: 1px solid #171717;
-	content: "";
 	position: absolute;
 	top: -6px;
 	left: 13px;
@@ -1039,6 +1038,10 @@ a.btn {
 	color: #222;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	margin-top: 1rem;
+}
+
 /*=== PANEL */
 /*===========*/
 #panel {

p/themes/Dark/dark.css

@@ -911,6 +911,11 @@ a.btn {
 	text-shadow: none;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	background-color: #171717;
+	margin-top: 1rem;
+}
+
 /*=== Panel */
 #panel {
 	background: #1c1c1c;

p/themes/Dark/dark.rtl.css

@@ -911,6 +911,11 @@ a.btn {
 	text-shadow: none;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	background-color: #171717;
+	margin-top: 1rem;
+}
+
 /*=== Panel */
 #panel {
 	background: #1c1c1c;

p/themes/Flat/flat.css

@@ -103,7 +103,6 @@ form th {
 }
 
 .form-group::after {
-	content: "";
 	display: block;
 	clear: both;
 }
@@ -445,7 +444,6 @@ a.btn {
 
 .box .box-content .item {
 	font-size: 0.9rem;
-	line-height: 2.5em;
 }
 
 .box .box-title .configure .icon,

p/themes/Flat/flat.rtl.css

@@ -103,7 +103,6 @@ form th {
 }
 
 .form-group::after {
-	content: "";
 	display: block;
 	clear: both;
 }
@@ -445,7 +444,6 @@ a.btn {
 
 .box .box-content .item {
 	font-size: 0.9rem;
-	line-height: 2.5em;
 }
 
 .box .box-title .configure .icon,

p/themes/Mapco/_forms.scss

@@ -129,7 +129,6 @@ input.extend {
 	border-radius: 3px;
 
 	&::after {
-		content: "";
 		display: block;
 		clear: both;
 	}

p/themes/Mapco/mapco.css

@@ -172,7 +172,6 @@ input.extend {
 	border-radius: 3px;
 }
 .form-group::after {
-	content: "";
 	display: block;
 	clear: both;
 }

p/themes/Mapco/mapco.rtl.css

@@ -172,7 +172,6 @@ input.extend {
 	border-radius: 3px;
 }
 .form-group::after {
-	content: "";
 	display: block;
 	clear: both;
 }

p/themes/Nord/nord.css

@@ -388,7 +388,6 @@ img.favicon {
 .box .box-content .item {
 	padding: 0 10px;
 	font-size: 0.9rem;
-	line-height: 2.5em;
 }
 
 /*=== Draggable */
@@ -524,10 +523,6 @@ img.favicon {
 
 }
 
-.category .title:not([data-unread="0"])::after {
-	content: attr(data-unread);
-}
-
 li.item.active {
 	background-color: var(--bg);
 	font-weight: bold;
@@ -754,7 +749,6 @@ li.item.active {
 /*===========*/
 .category .title.error::before {
 	color: var(--accent-light);
-	content: "⚠ ";
 }
 
 
@@ -794,11 +788,6 @@ li.item.active {
 	.flux_content .content a {
 		color: #000;
 	}
-
-	.flux_content .content a::after {
-		content: " [" attr(href) "] ";
-		font-style: italic;
-	}
 }
 
 /*=== PREVIEW */
@@ -834,15 +823,6 @@ li.item.active {
 	margin: -1px;
 }
 
-.feed .item-title:not([data-unread="0"])::before {
-	content: "(" attr(data-unread) ") ";
-	display: none
-}
-
-.feed .item-title:not([data-unread="0"])::after {
-	content: " (" attr(data-unread) ")";
-}
-
 
 /*BEGINS BASE.CSS*/
 
@@ -899,7 +879,6 @@ input.extend {
 
 /*=== Dropdown */
 .dropdown-menu::after {
-	content: "";
 	position: absolute;
 	top: -6px;
 	right: 13px;

p/themes/Nord/nord.rtl.css

@@ -388,7 +388,6 @@ img.favicon {
 .box .box-content .item {
 	padding: 0 10px;
 	font-size: 0.9rem;
-	line-height: 2.5em;
 }
 
 /*=== Draggable */
@@ -524,10 +523,6 @@ img.favicon {
 
 }
 
-.category .title:not([data-unread="0"])::after {
-	content: attr(data-unread);
-}
-
 li.item.active {
 	background-color: var(--bg);
 	font-weight: bold;
@@ -754,7 +749,6 @@ li.item.active {
 /*===========*/
 .category .title.error::before {
 	color: var(--accent-light);
-	content: "⚠ ";
 }
 
 
@@ -794,11 +788,6 @@ li.item.active {
 	.flux_content .content a {
 		color: #000;
 	}
-
-	.flux_content .content a::after {
-		content: " [" attr(href) "] ";
-		font-style: italic;
-	}
 }
 
 /*=== PREVIEW */
@@ -834,15 +823,6 @@ li.item.active {
 	margin: -1px;
 }
 
-.feed .item-title:not([data-unread="0"])::before {
-	content: "(" attr(data-unread) ") ";
-	display: none
-}
-
-.feed .item-title:not([data-unread="0"])::after {
-	content: " (" attr(data-unread) ")";
-}
-
 
 /*BEGINS BASE.CSS*/
 
@@ -899,7 +879,6 @@ input.extend {
 
 /*=== Dropdown */
 .dropdown-menu::after {
-	content: "";
 	position: absolute;
 	top: -6px;
 	left: 13px;

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

@@ -77,6 +77,10 @@ a.btn,
 	font-size: 0.8rem;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	margin-top: 0.125rem;
+}
+
 .aside.aside_feed .feed .item-title:not([data-unread="0"])::after {
 	font-size: 0.7rem;
 }

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

@@ -77,6 +77,10 @@ a.btn,
 	font-size: 0.8rem;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	margin-top: 0.125rem;
+}
+
 .aside.aside_feed .feed .item-title:not([data-unread="0"])::after {
 	font-size: 0.7rem;
 }

p/themes/Origine/origine.css

@@ -679,7 +679,8 @@ a:hover .icon {
 
 /*=== Aside main page (categories) */
 .aside.aside_feed .category .title:not([data-unread="0"])::after,
-.global .box.category .title:not([data-unread="0"])::after {
+.global .box.category .title:not([data-unread="0"])::after,
+.global .feed .item-title:not([data-unread="0"])::after {
 	background-color: var(--background-color-light-shadowed);
 	color: var(--font-color-grey);
 }

p/themes/Origine/origine.rtl.css

@@ -679,7 +679,8 @@ a:hover .icon {
 
 /*=== Aside main page (categories) */
 .aside.aside_feed .category .title:not([data-unread="0"])::after,
-.global .box.category .title:not([data-unread="0"])::after {
+.global .box.category .title:not([data-unread="0"])::after,
+.global .feed .item-title:not([data-unread="0"])::after {
 	background-color: var(--background-color-light-shadowed);
 	color: var(--font-color-grey);
 }

p/themes/Pafat/pafat.css

@@ -476,7 +476,6 @@ a.btn {
 
 .box .box-content .item {
 	font-size: 0.9rem;
-	line-height: 2.5;
 }
 
 /*=== Tree */
@@ -540,7 +539,6 @@ a.btn {
 	background-color: var(--background-color-white);
 	width: 0.5rem;
 	height: 0.5rem;
-	content: "";
 	position: absolute;
 	top: 1rem;
 	left: -0.25rem;
@@ -1022,6 +1020,11 @@ a.signin {
 	border: none;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	background-color: var(--background-color-category);
+	color: var(--font-color-white);
+}
+
 /*=== DIVERS */
 /*===========*/
 .aside.aside_feed .nav-form input,

p/themes/Pafat/pafat.rtl.css

@@ -476,7 +476,6 @@ a.btn {
 
 .box .box-content .item {
 	font-size: 0.9rem;
-	line-height: 2.5;
 }
 
 /*=== Tree */
@@ -540,7 +539,6 @@ a.btn {
 	background-color: var(--background-color-white);
 	width: 0.5rem;
 	height: 0.5rem;
-	content: "";
 	position: absolute;
 	top: 1rem;
 	right: -0.25rem;
@@ -1022,6 +1020,11 @@ a.signin {
 	border: none;
 }
 
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	background-color: var(--background-color-category);
+	color: var(--font-color-white);
+}
+
 /*=== DIVERS */
 /*===========*/
 .aside.aside_feed .nav-form input,

p/themes/Screwdriver/screwdriver.css

@@ -471,7 +471,6 @@ a.btn {
 
 .box .box-content .item {
 	font-size: 0.9rem;
-	line-height: 2.5em;
 }
 
 /*=== Tree */

p/themes/Screwdriver/screwdriver.rtl.css

@@ -471,7 +471,6 @@ a.btn {
 
 .box .box-content .item {
 	font-size: 0.9rem;
-	line-height: 2.5em;
 }
 
 /*=== Tree */

p/themes/Swage/swage.css

@@ -71,7 +71,6 @@ select:invalid {
 }
 
 .flux::after, .form-group::after {
-	content: "";
 	display: block;
 	clear: both;
 }
@@ -329,9 +328,6 @@ form th {
 .dropdown-menu .dropdown-section .item a:hover {
 	background-color: var(--color-background-nav);
 }
-.dropdown-menu::after {
-	content: none;
-}
 .dropdown-menu > .item {
 	padding: 0 0 0 0.5rem;
 }
@@ -488,7 +484,6 @@ form th {
 .box .box-content .item {
 	padding: 0 10px;
 	font-size: 0.9rem;
-	line-height: 2.5;
 }
 .box .box-content .item .configure .icon {
 	vertical-align: middle;
@@ -1169,4 +1164,6 @@ button.as-link {
 
 #slider label {
 	min-height: initial;
-}
+}
+
+/*# sourceMappingURL=swage.css.map */

p/themes/Swage/swage.rtl.css

@@ -71,7 +71,6 @@ select:invalid {
 }
 
 .flux::after, .form-group::after {
-	content: "";
 	display: block;
 	clear: both;
 }
@@ -329,9 +328,6 @@ form th {
 .dropdown-menu .dropdown-section .item a:hover {
 	background-color: var(--color-background-nav);
 }
-.dropdown-menu::after {
-	content: none;
-}
 .dropdown-menu > .item {
 	padding: 0 0.5rem 0 0;
 }
@@ -488,7 +484,6 @@ form th {
 .box .box-content .item {
 	padding: 0 10px;
 	font-size: 0.9rem;
-	line-height: 2.5;
 }
 .box .box-content .item .configure .icon {
 	vertical-align: middle;
@@ -1169,4 +1164,4 @@ button.as-link {
 
 #slider label {
 	min-height: initial;
-}
+}

p/themes/Swage/swage.scss

@@ -89,7 +89,6 @@ $color_hover:	#fff;
 }
 
 %after {
-	content: "";
 	display: block;
 	clear: both;
 }
@@ -429,10 +428,6 @@ form {
 		}
 	}
 
-	&::after {
-		content: none;
-	}
-
 	> {
 		.item {
 
@@ -626,7 +621,6 @@ form {
 		.item {
 			padding: 0 10px;
 			font-size: 0.9rem;
-			line-height: 2.5;
 
 			.configure {
 				.icon {

p/themes/base-theme/base.css

@@ -218,7 +218,6 @@ a.btn {
 }
 
 .dropdown-menu::after {
-	content: "";
 	position: absolute;
 	top: -6px;
 	right: 13px;

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

@@ -218,7 +218,6 @@ a.btn {
 }
 
 .dropdown-menu::after {
-	content: "";
 	position: absolute;
 	top: -6px;
 	left: 13px;

p/themes/base-theme/frss.css

@@ -1871,6 +1871,26 @@ input:checked + .slide-container .properties {
 	margin: 1em 0 0 0;
 }
 
+#stream.global .feed {
+	position: relative;
+}
+
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	margin: 0.5rem 0px 0px;
+	padding: 5px 10px;
+	min-width: 20px;
+	display: block;
+	content: attr(data-unread);
+	position: absolute;
+	top: 0px;
+	right: 0px;
+	text-align: center;
+	font-size: 0.75rem;
+	border-radius: 12px;
+	line-height: 1;
+	font-weight: initial;
+}
+
 .feed.active .item-title:not([data-unread="0"])::after {
 	color: var(--frss-font-color-light);
 	border: 1px solid var(--frss-border-color);

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

@@ -1871,6 +1871,26 @@ input:checked + .slide-container .properties {
 	margin: 1em 0 0 0;
 }
 
+#stream.global .feed {
+	position: relative;
+}
+
+#stream.global .feed .item-title:not([data-unread="0"])::after {
+	margin: 0.5rem 0px 0px;
+	padding: 5px 10px;
+	min-width: 20px;
+	display: block;
+	content: attr(data-unread);
+	position: absolute;
+	top: 0px;
+	left: 0px;
+	text-align: center;
+	font-size: 0.75rem;
+	border-radius: 12px;
+	line-height: 1;
+	font-weight: initial;
+}
+
 .feed.active .item-title:not([data-unread="0"])::after {
 	color: var(--frss-font-color-light);
 	border: 1px solid var(--frss-border-color);