Keep the reader view article date on one line (#9388)

Follow-up to #9369, as discussed in https://github.com/FreshRSS/FreshRSS/pull/9369#issuecomment-5954861516

Changes proposed in this pull request:

- In the reader view, the date in the line under the article title had a fixed `width: 155px`. A long date such as "28 September 2026 at 18:30" needs about 190px, so at desktop width it broke into two lines. This was already the case before #9369.
- `.content .subtitle.horizontal-list .item.date` now uses the 155px as `min-width` and has `white-space: nowrap`, so the box grows to fit the date and the date stays on one line.
- Short dates are unchanged: they keep the 155px box and the same position.
- If the feed name, authors and date do not fit on one row, the date moves to the next line as a whole (the `flex-wrap` from #9369), instead of breaking in the middle.
- In the `max-width: 840px` block the date is reset to `min-width: 0; white-space: normal`, so nothing can overflow on very narrow screens. The phone layout from #9369 is unchanged.
- `frss.rtl.css` was regenerated with `rtlcss`.
This commit is contained in:
Abdelrhman Mohamed authored and GitHub committed 2026-10-04 18:21:22 +02:00
1 parent 4e5e142cd0
commit 820687e78c
2 files changed
+8 -4

No files matched your search

+4 -2
View File
@@ -1800,8 +1800,9 @@ a.website:hover .favicon {
.content .subtitle.horizontal-list .item.date {
padding: 0.25rem;
width: 155px;
min-width: 155px;
text-align: right;
white-space: nowrap;
}
.content .article-header-topline.horizontal-list .item.link,
@@ -2868,8 +2869,9 @@ html.slider-active {
}
.content .subtitle.horizontal-list .item.date {
width: auto;
min-width: 0;
text-align: left;
white-space: normal;
}
table {
+4 -2
View File
@@ -1800,8 +1800,9 @@ a.website:hover .favicon {
.content .subtitle.horizontal-list .item.date {
padding: 0.25rem;
width: 155px;
min-width: 155px;
text-align: left;
white-space: nowrap;
}
.content .article-header-topline.horizontal-list .item.link,
@@ -2868,8 +2869,9 @@ html.slider-active {
}
.content .subtitle.horizontal-list .item.date {
width: auto;
min-width: 0;
text-align: right;
white-space: normal;
}
table {