Fix CSS hover long title (#2882)

* Fix CSS hover long title

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

* Fix Ansum

* Fix Mapco

10 files changed, 20 insertions, 22 deletions

diff --git a/p/themes/Alternative-Dark/template.css b/p/themes/Alternative-Dark/template.css
index cb584fdd5..21a6e5b42 100644
--- a/p/themes/Alternative-Dark/template.css
+++ b/p/themes/Alternative-Dark/template.css
@@ -647,6 +647,7 @@ a.btn {
 
 /*=== Feed article header and footer */
 .flux_header {
+	background: inherit;
 	position: relative;
 }
 
diff --git a/p/themes/Alternative-Dark/template.rtl.css b/p/themes/Alternative-Dark/template.rtl.css
index 7696ae8b4..82b216f64 100644
--- a/p/themes/Alternative-Dark/template.rtl.css
+++ b/p/themes/Alternative-Dark/template.rtl.css
@@ -647,6 +647,7 @@ a.btn {
 
 /*=== Feed article header and footer */
 .flux_header {
+	background: inherit;
 	position: relative;
 }
 
diff --git a/p/themes/Ansum/_list-view.scss b/p/themes/Ansum/_list-view.scss
index e5a1f575a..5577a5801 100644
--- a/p/themes/Ansum/_list-view.scss
+++ b/p/themes/Ansum/_list-view.scss
@@ -42,7 +42,7 @@
 		}
 
 		.item.date {
-			color: unquote($unread-font-color+"99"); //--------------------
+			color: scale-color($unread-font-color, $alpha: -50%);
 		}
 	}
 
@@ -72,9 +72,8 @@
 	}
 
 	.date {
-		color: $main-font-color;
+		color: scale-color($main-font-color, $alpha: -50%);
 		font-size: 0.85rem;
-		opacity: 0.75;
 	}
 
 	.bottom {
diff --git a/p/themes/Ansum/ansum.css b/p/themes/Ansum/ansum.css
index 7b4281d2b..da350b983 100644
--- a/p/themes/Ansum/ansum.css
+++ b/p/themes/Ansum/ansum.css
@@ -972,7 +972,7 @@ form th {
   .flux.not_read .item.website a {
     color: #161a38; }
   .flux.not_read .item.date {
-    color: #161a3899; }
+    color: rgba(22, 26, 56, 0.5); }
   .flux.favorite {
     border-left-color: #ffc300;
     -webkit-transition: all 0.15s ease-in-out;
@@ -989,9 +989,8 @@ form th {
   .flux .website .favicon {
     padding: 5px; }
   .flux .date {
-    color: #363330;
-    font-size: 0.85rem;
-    opacity: 0.75; }
+    color: rgba(54, 51, 48, 0.5);
+    font-size: 0.85rem; }
   .flux .bottom {
     font-size: 1rem;
     text-align: center; }
diff --git a/p/themes/Ansum/ansum.rtl.css b/p/themes/Ansum/ansum.rtl.css
index 45b61afdc..d17988101 100644
--- a/p/themes/Ansum/ansum.rtl.css
+++ b/p/themes/Ansum/ansum.rtl.css
@@ -972,7 +972,7 @@ form th {
   .flux.not_read .item.website a {
     color: #161a38; }
   .flux.not_read .item.date {
-    color: #161a3899; }
+    color: rgba(22, 26, 56, 0.5); }
   .flux.favorite {
     border-right-color: #ffc300;
     -webkit-transition: all 0.15s ease-in-out;
@@ -989,9 +989,8 @@ form th {
   .flux .website .favicon {
     padding: 5px; }
   .flux .date {
-    color: #363330;
-    font-size: 0.85rem;
-    opacity: 0.75; }
+    color: rgba(54, 51, 48, 0.5);
+    font-size: 0.85rem; }
   .flux .bottom {
     font-size: 1rem;
     text-align: center; }
diff --git a/p/themes/Mapco/_list-view.scss b/p/themes/Mapco/_list-view.scss
index 760aea96c..1e0b3ddc2 100644
--- a/p/themes/Mapco/_list-view.scss
+++ b/p/themes/Mapco/_list-view.scss
@@ -43,7 +43,7 @@
 		}
 
 		.item.date {
-			color: unquote($unread-font-color+"99"); //--------------------
+			color: scale-color($unread-font-color, $alpha: -50%);
 		}
 	}
 
@@ -73,9 +73,8 @@
 	}
 
 	.date {
-		color: $main-font-color;
+		color: scale-color($main-font-color, $alpha: -50%);
 		font-size: 0.85rem;
-		opacity: 0.75;
 	}
 
 	.bottom {
diff --git a/p/themes/Mapco/mapco.css b/p/themes/Mapco/mapco.css
index bbbad8560..c9fc880a6 100644
--- a/p/themes/Mapco/mapco.css
+++ b/p/themes/Mapco/mapco.css
@@ -979,7 +979,7 @@ form th {
   .flux.not_read .item.website a {
     color: #36c; }
   .flux.not_read .item.date {
-    color: #36c99; }
+    color: rgba(51, 102, 204, 0.5); }
   .flux.favorite {
     border-left-color: #ffc300;
     -webkit-transition: all 0.15s ease-in-out;
@@ -997,9 +997,8 @@ form th {
   .flux .website .favicon {
     padding: 5px; }
   .flux .date {
-    color: #303136;
-    font-size: 0.85rem;
-    opacity: 0.75; }
+    color: rgba(48, 49, 54, 0.5);
+    font-size: 0.85rem; }
   .flux .bottom {
     font-size: 1rem;
     text-align: center; }
diff --git a/p/themes/Mapco/mapco.rtl.css b/p/themes/Mapco/mapco.rtl.css
index 4f56b1453..19c2a5fdd 100644
--- a/p/themes/Mapco/mapco.rtl.css
+++ b/p/themes/Mapco/mapco.rtl.css
@@ -979,7 +979,7 @@ form th {
   .flux.not_read .item.website a {
     color: #36c; }
   .flux.not_read .item.date {
-    color: #36c99; }
+    color: rgba(51, 102, 204, 0.5); }
   .flux.favorite {
     border-right-color: #ffc300;
     -webkit-transition: all 0.15s ease-in-out;
@@ -997,9 +997,8 @@ form th {
   .flux .website .favicon {
     padding: 5px; }
   .flux .date {
-    color: #303136;
-    font-size: 0.85rem;
-    opacity: 0.75; }
+    color: rgba(48, 49, 54, 0.5);
+    font-size: 0.85rem; }
   .flux .bottom {
     font-size: 1rem;
     text-align: center; }
diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index cda380928..48fa4e9bf 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -647,6 +647,7 @@ a.btn {
 
 /*=== Feed article header and footer */
 .flux_header {
+	background: inherit;
 	position: relative;
 }
 
diff --git a/p/themes/base-theme/template.rtl.css b/p/themes/base-theme/template.rtl.css
index 1f1ad9626..d90d712b9 100644
--- a/p/themes/base-theme/template.rtl.css
+++ b/p/themes/base-theme/template.rtl.css
@@ -647,6 +647,7 @@ a.btn {
 
 /*=== Feed article header and footer */
 .flux_header {
+	background: inherit;
 	position: relative;
 }