banananetwork
/
tt-rss
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

rework article header to use flexbox

Browse Source
master
Andrew Dolgov 6 years ago
parent 3bf006abef
commit 26c074ed7e
6 changed files with 119 additions and 125 deletions
Show Stats Download Patch File Download Diff File

104
classes/article.php
Unescape Escape View File

@ -627,7 +627,8 @@ class Article extends Handler_Protected {
} else {
if ($line["comments"] && $line["link"] != $line["comments"]) {
$entry_comments = "<a class=\"comments\" target='_blank' rel=\"noopener noreferrer\" href=\"".htmlspecialchars($line["comments"])."\">".__("comments")."</a>";
$entry_comments = "<a class=\"comments\" target='_blank' rel=\"noopener noreferrer\" href=\"".
htmlspecialchars($line["comments"])."\">".__("comments")."</a>";
}
}
@ -676,54 +677,56 @@ class Article extends Handler_Protected {
$rv['content'] .= "<meta property=\"og:image\" content=\"" . htmlspecialchars($og_image) . "\"/>";
}
$rv['content'] .= "<body class=\"claro ttrss_utility ttrss_zoom\">";
$rv['content'] .= "<body class='flat ttrss_utility ttrss_zoom'>";
}
$rv['content'] .= "<div class=\"post\" id=\"POST-$id\">";
$rv['content'] .= "<div class='post post-$id'>";
$rv['content'] .= "<div class=\"header\">";
/* header */
$entry_author = $line["author"];
if ($entry_author) {
$entry_author = __(" - ") . $entry_author;
}
$rv['content'] .= "<div class='header'>";
$rv['content'] .= "<div class='row'>"; # row
//$entry_author = $line["author"] ? " - " . $line["author"] : "";
$parsed_updated = make_local_datetime($line["updated"], true,
$owner_uid, true);
if (!$zoom_mode)
$rv['content'] .= "<div class=\"date\">$parsed_updated</div>";
if ($line["link"]) {
$rv['content'] .= "<div class='title'><a target='_blank' rel='noopener noreferrer'
title=\"".htmlspecialchars($line['title'])."\"
href=\"" .
htmlspecialchars($line["link"]) . "\">" .
$line["title"] . "</a>" .
"<span class='author'>$entry_author</span></div>";
href=\"" .htmlspecialchars($line["link"]) . "\">" . $line["title"] . "</a></div>";
} else {
$rv['content'] .= "<div class='title'>" . $line["title"] . "$entry_author</div>";
$rv['content'] .= "<div class='title'>" . $line["title"] . "</div>";
}
if ($zoom_mode) {
$feed_title = htmlspecialchars($line["feed_title"]);
if (!$zoom_mode)
$rv['content'] .= "<div class='date'>$parsed_updated<br/></div>";
$rv['content'] .= "<div class=\"feed-title\">$feed_title</div>";
$rv['content'] .= "</div>"; # row
$rv['content'] .= "<div class=\"date\">$parsed_updated</div>";
$rv['content'] .= "<div class='row'>"; # row
/* left buttons */
$rv['content'] .= "<div class='buttons left'>";
foreach (PluginHost::getInstance()->get_hooks(PluginHost::HOOK_ARTICLE_LEFT_BUTTON) as $p) {
$rv['content'] .= $p->hook_article_left_button($line);
}
$rv['content'] .= "</div>";
/* comments */
$rv['content'] .= "<div class='comments'>$entry_comments</div>";
$rv['content'] .= "<div class='author'>".$line['author']."</div>";
/* tags */
$tags_str = Article::format_tags_string($line["tags"], $id);
$tags_str_full = join(", ", $line["tags"]);
if (!$tags_str_full) $tags_str_full = __("no tags");
if (!$entry_comments) $entry_comments = "&nbsp;"; # placeholder
$rv['content'] .= "<div class='tags' style='float : right'>
<img src='images/tag.png'
class='tagsPic' alt='Tags' title='Tags'>&nbsp;";
$rv['content'] .= "<i class='material-icons'>label_outline</i><div>";
if (!$zoom_mode) {
$rv['content'] .= "<span id=\"ATSTR-$id\">$tags_str</span>
@ -734,22 +737,39 @@ class Article extends Handler_Protected {
id=\"ATSTRTIP-$id\" connectId=\"ATSTR-$id\"
position=\"below\">$tags_str_full</div>";
foreach (PluginHost::getInstance()->get_hooks(PluginHost::HOOK_ARTICLE_BUTTON) as $p) {
$rv['content'] .= $p->hook_article_button($line);
}
} else {
$tags_str = strip_tags($tags_str);
$rv['content'] .= "<span id=\"ATSTR-$id\">$tags_str</span>";
}
$rv['content'] .= "</div>";
$rv['content'] .= "<div clear='both'>";
foreach (PluginHost::getInstance()->get_hooks(PluginHost::HOOK_ARTICLE_LEFT_BUTTON) as $p) {
$rv['content'] .= $p->hook_article_left_button($line);
/* buttons */
$rv['content'] .= "<div class='buttons right'>";
foreach (PluginHost::getInstance()->get_hooks(PluginHost::HOOK_ARTICLE_BUTTON) as $p) {
$rv['content'] .= $p->hook_article_button($line);
}
$rv['content'] .= "</div>";
$rv['content'] .= "</div>"; # row
$rv['content'] .= "</div>"; # header
/* note */
$rv['content'] .= "<div id=\"POSTNOTE-$id\">";
if ($line['note']) {
$rv['content'] .= Article::format_article_note($id, $line['note'], !$zoom_mode);
}
$rv['content'] .= "</div>";
/* content */
$lang = $line['lang'] ? $line['lang'] : "en";
$rv['content'] .= "<div class=\"content\" lang=\"$lang\">";
$rv['content'] .= "$entry_comments</div>";
/* originally from */
if ($line["orig_feed_id"]) {
@ -776,17 +796,7 @@ class Article extends Handler_Protected {
}
}
$rv['content'] .= "</div>";
$rv['content'] .= "<div id=\"POSTNOTE-$id\">";
if ($line['note']) {
$rv['content'] .= Article::format_article_note($id, $line['note'], !$zoom_mode);
}
$rv['content'] .= "</div>";
if (!$line['lang']) $line['lang'] = 'en';
$rv['content'] .= "<div class=\"content\" lang=\"".$line['lang']."\">";
/* content body */
$rv['content'] .= $line["content"];
@ -797,9 +807,9 @@ class Article extends Handler_Protected {
$line["hide_images"]);
}
$rv['content'] .= "</div>";
$rv['content'] .= "</div>"; # content
$rv['content'] .= "</div>";
$rv['content'] .= "</div>"; # post
}

8
classes/feeds.php
Unescape Escape View File

@ -581,10 +581,10 @@ class Feeds extends Handler_Protected {
$tmp_content .= "<div class='left'>";
$tmp_content .= "<img src='images/tag.png' alt='Tags' title='Tags'>
<span id=\"ATSTR-$id\">$tags_str</span>
<a title=\"".__('Edit tags for this article')."\"
href=\"#\" onclick=\"Article.editTags($id)\">(+)</a>";
$tmp_content .= "<i class='material-icons'>label_outline</i>
<span id=\"ATSTR-$id\">$tags_str</span>
<a title=\"".__('Edit tags for this article')."\"
href=\"#\" onclick=\"Article.editTags($id)\">(+)</a>";
$num_comments = (int) $line["num_comments"];
$entry_comments = "";

5
css/cdm.less
Unescape Escape View File

@ -148,11 +148,6 @@ div.cdm.active div.content {
}
.cdm {
div.content div.postEnclosures {
margin-top: 1em;
color: @default-text;
}
div.feed-title {
border: 0px solid @color-link;
border-bottom-width: 1px;

58
css/default.css
Unescape Escape View File

@ -21,6 +21,7 @@ body.ttrss_main :focus {
}
body.ttrss_main div.post {
padding: 0px;
font-size: 13px;
}
body.ttrss_main div.post div.header {
padding: 5px;
@ -29,30 +30,39 @@ body.ttrss_main div.post div.header {
border-bottom-width: 1px;
background: #f0f0f0;
}
body.ttrss_main div.post div.header div.date {
text-align: right;
float: right;
body.ttrss_main div.post div.header .left,
body.ttrss_main div.post div.header .right {
display: flex;
}
body.ttrss_main div.post div.header div {
padding-bottom: 3px;
body.ttrss_main div.post div.header .row {
display: flex;
margin-bottom: 4px;
flex-wrap: nowrap;
}
body.ttrss_main div.post div.header span.author {
color: #555555;
font-size: 11px;
font-weight: normal;
body.ttrss_main div.post div.header .row > * {
align-self: center;
}
body.ttrss_main div.post div.title {
overflow: hidden;
font-size: 15px;
text-overflow: ellipsis;
body.ttrss_main div.post div.header .comments {
flex-grow: 2;
}
body.ttrss_main div.post div.header .date {
text-align: right;
white-space: nowrap;
align-self: flex-start;
}
body.ttrss_main div.post div.header img,
body.ttrss_main div.post div.header i {
margin: 0px 4px;
vertical-align: middle;
}
body.ttrss_main div.post div.header .title {
flex-grow: 2;
align-self: flex-start;
font-size: 15px;
font-weight: 600;
text-rendering: optimizelegibility;
font-family: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
body.ttrss_main div.post div.date {
padding-left: 10px;
}
body.ttrss_main div.post div.content {
padding: 10px;
font-size: 16px;
@ -70,18 +80,6 @@ body.ttrss_main div.post div.content iframe {
min-width: 50%;
max-width: 98%;
}
body.ttrss_main div.post div.postEnclosures {
color: #555555;
}
body.ttrss_main div.post img.tagsPic {
width: 16px;
height: 16px;
margin-left: 4px;
vertical-align: middle;
}
body.ttrss_main div.post span.author {
font-size: 12px;
}
body.ttrss_main div.articleNote {
background-color: #fff7d5;
padding: 5px;
@ -1148,10 +1146,6 @@ div.cdm.expanded.Unread div.content {
div.cdm.active div.content {
color: black;
}
.cdm div.content div.postEnclosures {
margin-top: 1em;
color: #555555;
}
.cdm div.feed-title {
border: 0px solid #257aa7;
border-bottom-width: 1px;

2
css/default.css.map
View File

File diff suppressed because one or more lines are too long

67
css/tt-rss.less
Unescape Escape View File

@ -11,6 +11,7 @@ body.ttrss_main {
div.post {
padding : 0px;
font-size : 13px;
div.header {
padding : 5px;
@ -19,34 +20,43 @@ body.ttrss_main {
border-bottom-width: 1px;
background: #f0f0f0;
div.date {
text-align : right;
float : right;
.left, .right {
display : flex;
}
div {
padding-bottom : 3px;
.row {
display : flex;
margin-bottom : 4px;
flex-wrap : nowrap;
> * {
align-self : center;
}
}
span.author {
color : @default-text;
font-size : 11px;
font-weight : normal;
.comments {
flex-grow : 2;
}
}
div.title {
overflow : hidden;
font-size : 15px;
text-overflow: ellipsis;
white-space : nowrap;
font-weight : 600;
text-rendering: optimizelegibility;
font-family : @fonts-ui-bold;
}
.date {
text-align : right;
white-space : nowrap;
align-self : flex-start;
}
div.date {
padding-left : 10px;
img, i {
margin : 0px 4px;
vertical-align: middle;
}
.title {
flex-grow : 2;
align-self : flex-start;
font-size : 15px;
font-weight : 600;
text-rendering: optimizelegibility;
font-family : @fonts-ui-bold;
}
}
div.content {
@ -69,21 +79,6 @@ body.ttrss_main {
max-width : 98%;
}
}
div.postEnclosures {
color : @default-text;
}
img.tagsPic {
width : 16px;
height : 16px;
margin-left : 4px;
vertical-align : middle;
}
span.author {
font-size : 12px;
}
}
div.articleNote {

Write Preview
Loading…
Cancel
Save