combined mode (and more) css class name updates

master
Andrew Dolgov 6 years ago
parent 2f961ee830
commit 8359ca6dad

@ -345,7 +345,7 @@ class Feeds extends Handler_Protected {
$score_pic = "images/" . get_score_pic($score);
$score_pic = "<img class='hlScorePic' score='$score' onclick='changeScore($id, this)' src=\"$score_pic\"
$score_pic = "<img class='score-pic' score='$score' onclick='changeScore($id, this)' src=\"$score_pic\"
title=\"$score\">";
if ($score > 500) {
@ -390,7 +390,7 @@ class Feeds extends Handler_Protected {
$vf_catchup_link = "<a class='catchup' onclick='catchupFeedInGroup($feed_id);' href='#'>".__('mark feed as read')."</a>";
$reply['content'] .= "<div data-feed-id='$feed_id' class='cdmFeedTitle'>".
$reply['content'] .= "<div data-feed-id='$feed_id' class='feed-titl'>".
"<div style='float : right'>$feed_icon_img</div>".
"<a class='title' href=\"#\" onclick=\"viewfeed({feed:$feed_id})\">".
$line["feed_title"]."</a>
@ -414,7 +414,7 @@ class Feeds extends Handler_Protected {
$reply['content'] .= "</div>";
$reply['content'] .= "<div onclick='return hlClicked(event, $id)'
class=\"hlTitle\"><span class='hlContent $hlc_suffix'>";
class=\"title\"><span class='hlContent $hlc_suffix'>";
$reply['content'] .= "<a class=\"title $hlc_suffix\"
href=\"" . htmlspecialchars($line["link"]) . "\"
onclick=\"\">" .
@ -434,7 +434,7 @@ class Feeds extends Handler_Protected {
if (@$line["feed_title"]) {
$rgba = @$rgba_cache[$feed_id];
$reply['content'] .= "<span class=\"hlFeed\"><a style=\"background : rgba($rgba, 0.3)\" href=\"#\" onclick=\"viewfeed({feed:$feed_id})\">".
$reply['content'] .= "<span class=\"feed\"><a style=\"background : rgba($rgba, 0.3)\" href=\"#\" onclick=\"viewfeed({feed:$feed_id})\">".
truncate_string($line["feed_title"],30)."</a></span>";
}
}
@ -486,7 +486,7 @@ class Feeds extends Handler_Protected {
$feed_icon_src = Feeds::getFeedIcon($feed_id);
$feed_icon_img = "<img class=\"tinyFeedIcon\" src=\"$feed_icon_src\">";
$reply['content'] .= "<div data-feed-id='$feed_id' class='cdmFeedTitle'>".
$reply['content'] .= "<div data-feed-id='$feed_id' class='feed-title'>".
"<div style=\"float : right\">$feed_icon_img</div>".
"<a href=\"#\" class='title' onclick=\"viewfeed({feed:$feed_id})\">".
$line["feed_title"]."</a> $vf_catchup_link</div>";
@ -499,7 +499,7 @@ class Feeds extends Handler_Protected {
$tmp_content = "<div class=\"cdm expanded $hlc_suffix $class\"
id=\"RROW-$id\" data-content=\"$content_encoded\" data-article-id='$id' data-orig-feed-id='$feed_id' $mouseover_attrs>";
$tmp_content .= "<div class=\"cdmHeader\">";
$tmp_content .= "<div class=\"header\">";
$tmp_content .= "<div style=\"vertical-align : middle\">";
$tmp_content .= "<input dojoType=\"dijit.form.CheckBox\"
@ -540,7 +540,7 @@ class Feeds extends Handler_Protected {
if (@$line["feed_title"]) {
$rgba = @$rgba_cache[$feed_id];
$tmp_content .= "<div class=\"hlFeed\">
$tmp_content .= "<div class=\"feed\">
<a href=\"#\" style=\"background-color: rgba($rgba,0.3)\"
onclick=\"viewfeed({feed:$feed_id})\">".
truncate_string($line["feed_title"],30)."</a>
@ -550,7 +550,7 @@ class Feeds extends Handler_Protected {
$tmp_content .= "<span class='updated' title='$date_entered_fmt'>$updated_fmt</span>";
$tmp_content .= "<div class='scoreWrap' style=\"vertical-align : middle\">";
$tmp_content .= "<div style=\"vertical-align : middle\">";
$tmp_content .= "$score_pic";
if (!get_pref("VFEED_GROUP_BY_FEED") && $line["feed_title"]) {
@ -558,11 +558,11 @@ class Feeds extends Handler_Protected {
title=\"".htmlspecialchars($line["feed_title"])."\"
onclick=\"viewfeed({feed:$feed_id})\">$feed_icon_img</span>";
}
$tmp_content .= "</div>"; //scoreWrap
$tmp_content .= "</div>"; //score wrapper2
$tmp_content .= "</div>"; //cdmHeader
$tmp_content .= "</div>"; //header
$tmp_content .= "<div class=\"cdmContent\" onclick=\"return cdmClicked(event, $id, true);\">";
$tmp_content .= "<div class=\"content\" onclick=\"return cdmClicked(event, $id, true);\">";
$tmp_content .= "<div id=\"POSTNOTE-$id\">";
if ($line['note']) {
@ -573,7 +573,7 @@ class Feeds extends Handler_Protected {
if (!$line['lang']) $line['lang'] = 'en';
// this is filled from RROW data-content
$tmp_content .= "<div class=\"cdmContentInner\" lang=\"".$line['lang']."\">";
$tmp_content .= "<div class=\"content-inner\" lang=\"".$line['lang']."\">";
if ($line["orig_feed_id"]) {
@ -601,8 +601,8 @@ class Feeds extends Handler_Protected {
}
}
$tmp_content .= "</div>"; //cdmContentInner
$tmp_content .= "<div class=\"cdmIntermediate\">";
$tmp_content .= "</div>"; //content-inner
$tmp_content .= "<div class=\"intermediate\">";
$always_display_enclosures = $line["always_display_enclosures"];
$tmp_content .= Article::format_article_enclosures($id, $always_display_enclosures,
@ -610,7 +610,7 @@ class Feeds extends Handler_Protected {
$tmp_content .= "</div>"; // cdmIntermediate
$tmp_content .= "<div class=\"cdmFooter\" onclick=\"event.stopPropagation()\">";
$tmp_content .= "<div class=\"footer\" onclick=\"event.stopPropagation()\">";
foreach (PluginHost::getInstance()->get_hooks(PluginHost::HOOK_ARTICLE_LEFT_BUTTON) as $p) {
$tmp_content .= $p->hook_article_left_button($line);
@ -655,7 +655,7 @@ class Feeds extends Handler_Protected {
$tmp_content .= "</div>"; // buttons
$tmp_content .= "</div>"; // cdmFooter
$tmp_content .= "</div>"; // cdm footer
$tmp_content .= "</div>"; // cdmContent
$tmp_content .= "</div>"; // RROW.cdm

@ -1,27 +1,27 @@
.cdm {
margin-right : 4px;
.cdmHeader, .cdmFooter {
.header, .footer {
display : table;
}
.cdmHeader img, .cdmHeader input, .cdmFooter img {
.header img, .header input, .footer img {
vertical-align : middle;
}
.cdmHeader > div, .cdmFooter > div {
.header > div, .footer > div {
white-space : nowrap;
}
.cdmHeader > span, .cdmFooter > span.left {
.header > span, .footer > span.left {
width : 100%;
}
.cdmHeader img, .cdmFooter img {
.header img, .footer img {
margin : 0px 4px;
}
.cdmHeader {
.header {
> * {
display : table-cell;
padding : 5px;
@ -55,7 +55,7 @@
}
}
.cdmFooter {
.footer {
height : 30px;
padding-left : 5px;
font-weight : normal;
@ -68,11 +68,11 @@
}
}
.cdmIntermediate {
.intermediate {
margin : 10px;
}
.cdmContentInner {
.content-inner {
margin : 10px;
line-height : 1.5;
font-size : 16px;
@ -89,10 +89,10 @@
}
.cdmIntermediate img,
.cdmIntermediate video,
.cdmContentInner img,
.cdmContentInner video {
.intermediate img,
.intermediate video,
.content-inner img,
.content-inner video {
border-width : 0px;
max-width : 98%;
height : auto;
@ -103,7 +103,7 @@
margin-top : 4px;
margin-bottom : 4px;
.cdmFooter {
.footer {
border: 0px solid #ddd;
border-bottom-width: 1px;
}
@ -115,11 +115,11 @@
}
div.cdm.expanded div.cdmHeader {
div.cdm.expanded div.header {
background : transparent ! important;
}
div.cdm.expanded div.cdmHeader a.title {
div.cdm.expanded div.header a.title {
font-size : 16px;
color : #999;
font-weight : 600;
@ -132,23 +132,23 @@ div.cdm.expanded.active {
background : white;
}
div.cdm.expanded.active div.cdmHeader a.title {
div.cdm.expanded.active div.header a.title {
color : @color-link;
}
div.cdm.expanded.Unread div.cdmHeader a.title {
div.cdm.expanded.Unread div.header a.title {
color : black;
}
div.cdm.expanded div.cdmContent {
div.cdm.expanded div.content {
color : @default-text;
}
div.cdm.expanded.Unread div.cdmContent {
div.cdm.expanded.Unread div.content {
color : black;
}
div.cdm.active div.cdmContent {
div.cdm.active div.content {
color : black;
}
@ -160,37 +160,37 @@ span.cdmExcerpt {
cursor : pointer;
}
div.cdmContent div.postEnclosures {
div.content div.postEnclosures {
margin-top : 1em;
color : @default-text;
}
div.cdmFeedTitle {
div.feed-title {
border: 0px solid @color-link;
border-bottom-width: 1px;
padding : 5px 3px 5px 5px;
}
div.cdmFeedTitle a.title {
div.feed-title a.title {
color : @default-text;
font-weight : bold;
}
div.cdmFeedTitle a {
div.feed-title a {
color : @default-text;
}
div.cdmFeedTitle a:hover {
div.feed-title a:hover {
color : @color-link;
}
div.cdmHeader span.hlFeed {
div.header span.feed {
float : right;
font-weight : normal;
font-style : italic;
}
div.cdmHeader div.hlFeed, div.cdmHeader div.hlFeed a {
div.header div.feed, div.header div.feed a {
vertical-align : middle;
color : @default-text;
font-weight : normal;
@ -198,25 +198,25 @@ div.cdmHeader div.hlFeed, div.cdmHeader div.hlFeed a {
font-size : 11px;
}
div.cdm .hlFeed a {
div.cdm .feed a {
border-radius : 4px;
display : inline-block;
padding : 1px 4px 1px 4px;
}
div.cdmContentInner p {
div.content-inner p {
/*max-width : 650px;*/
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
div.cdmContentInner iframe {
div.content-inner iframe {
min-width : 50%;
max-width : 98%;
}
div.cdmHeader span.author {
div.header span.author {
white-space : nowrap;
color : @default-text;
font-size : 11px;
@ -266,7 +266,7 @@ div#floatingTitle {
margin-left : 0px;
}
div.hlFeed {
div.feed {
padding-right : 10px;
color : @default-text;
font-weight : normal;
@ -275,7 +275,7 @@ div#floatingTitle {
white-space : nowrap;
}
div.hlFeed a {
div.feed a {
border-radius : 4px;
display : inline-block;
padding : 1px 4px 1px 4px;
@ -288,7 +288,7 @@ div#floatingTitle {
font-size : 11px;
}
div.hlFeed a {
div.feed a {
color : @default-text;
}
@ -298,7 +298,7 @@ div#floatingTitle {
}
.dijit,
img.hlScorePic {
img.score-pic {
display : none;
}
@ -308,7 +308,7 @@ div#floatingTitle.Unread a.title {
color : black;
}
.cdm.high .cdmHeader {
.cdm.high .header {
a.title.high,
.cdmExcerpt,
span.author {
@ -316,7 +316,7 @@ div#floatingTitle.Unread a.title {
}
}
.cdm.Unread.high .cdmHeader {
.cdm.Unread.high .header {
a.title.high,
.cdmExcerpt,
span.author {
@ -324,16 +324,16 @@ div#floatingTitle.Unread a.title {
}
}
.cdm .cdmHeader a.title.low,
.cdm.low .cdmHeader .cdmExcerpt,
.cdm.Unread .cdmHeader a.title.low,
.cdm.Unread.low .cdmHeader .cdmExcerpt,
.cdm.low .cdmHeader span.author {
.cdm .header a.title.low,
.cdm.low .header .cdmExcerpt,
.cdm.Unread .header a.title.low,
.cdm.Unread.low .header .cdmExcerpt,
.cdm.low .header span.author {
color : #909090;
text-decoration : line-through;
}
.cdmFeedTitle {
.feed-title {
> * {
display : table-cell;

File diff suppressed because one or more lines are too long

@ -221,7 +221,7 @@ body.ttrss_main {
padding : 1px;
transition : color 0.2s, background 0.2s;
div.hlTitle {
div.title {
display : table-cell;
cursor : pointer;
width : 100%;
@ -251,13 +251,13 @@ body.ttrss_main {
max-height : 16px;
}
span.hlFeed {
span.feed {
display : table-cell;
vertical-align : middle;
text-align : right;
}
span.hlFeed a {
span.feed a {
border-radius : 4px;
display : inline-block;
padding : 1px 4px 1px 4px;
@ -268,7 +268,7 @@ body.ttrss_main {
white-space : nowrap;
}
span.hlFeed a:hover {
span.feed a:hover {
color : @color-accent;
}
@ -304,7 +304,7 @@ body.ttrss_main {
height : 16px;
}
div.hlTitle a {
div.title a {
font-weight : 600;
text-rendering: optimizelegibility;
font-family : @fonts-ui;
@ -326,11 +326,11 @@ body.ttrss_main {
text-decoration : line-through;
}
.hl.Unread div.hlTitle a {
.hl.Unread div.title a {
color : black;
}
.hl.active div.hlTitle a {
.hl.active div.title a {
color : @color-accent;
/* text-shadow : 1px 1px 2px #fff; */
}
@ -345,7 +345,7 @@ body.ttrss_main {
background : desaturate(@color-accent, 25%);
a,
.hlFeed a,
.feed a,
.hlContent a.title,
span {
color : white;
@ -704,17 +704,17 @@ body.ttrss_main {
}
div#headlines-frame.wide .hlTitle {
div#headlines-frame.wide .title {
max-width : none;
overflow : visible;
white-space : normal;
}
div#headlines-frame.wide .hl .hlFeed {
div#headlines-frame.wide .hl .feed {
display : none;
}
img.hlScorePic {
img.score-pic {
vertical-align : middle;
width : 16px;
height : 16px;

@ -452,7 +452,7 @@ function catchupFeedInGroup(id) {
});
const feedTitles = $$("#headlines-frame > div[class='cdmFeedTitle']");
const feedTitles = $$("#headlines-frame > div[class='feed-title']");
for (let i = 0; i < feedTitles.length; i++) {
if (feedTitles[i].getAttribute("data-feed-id") == id) {

@ -86,7 +86,7 @@ function headlines_callback2(transport, offset, background, infscroll_req) {
while (tmp.hasChildNodes()) {
var row = tmp.removeChild(tmp.firstChild);
if (loaded_article_ids.indexOf(row.id) == -1 || row.hasClassName("cdmFeedTitle")) {
if (loaded_article_ids.indexOf(row.id) == -1 || row.hasClassName("feed-title")) {
dijit.byId("headlines-frame").domNode.appendChild(row);
loaded_article_ids.push(row.id);
@ -127,7 +127,7 @@ function headlines_callback2(transport, offset, background, infscroll_req) {
while (tmp.hasChildNodes()) {
let row = tmp.removeChild(tmp.firstChild);
if (loaded_article_ids.indexOf(row.id) == -1 || row.hasClassName("cdmFeedTitle")) {
if (loaded_article_ids.indexOf(row.id) == -1 || row.hasClassName("feed-title")) {
dijit.byId("headlines-frame").domNode.appendChild(row);
loaded_article_ids.push(row.id);
@ -1018,7 +1018,7 @@ function unpackVisibleHeadlines() {
const content = row.getAttribute("data-content");
row.select(".cdmContentInner")[0].innerHTML = content;
row.select(".content-inner")[0].innerHTML = content;
row.removeAttribute("data-content");
PluginHost.run(PluginHost.HOOK_ARTICLE_RENDERED_CDM, row);
@ -1672,7 +1672,7 @@ function setSelectionScore() {
const row = $("RROW-" + id);
if (row) {
const pic = row.getElementsByClassName("hlScorePic")[0];
const pic = row.getElementsByClassName("score-pic")[0];
if (pic) {
pic.src = pic.src.replace(/score_.*?\.png/,
@ -1739,7 +1739,7 @@ function updateFloatingTitle(unread_only) {
if (child && child.offsetTop + child.offsetHeight > hf.scrollTop) {
const header = child.getElementsByClassName("cdmHeader")[0];
const header = child.getElementsByClassName("header")[0];
if (unread_only || child.getAttribute("data-article-id") != $("floatingTitle").getAttribute("data-article-id")) {
if (child.getAttribute("data-article-id") != $("floatingTitle").getAttribute("data-article-id")) {

@ -10,7 +10,7 @@ function embedOriginalArticle(id) {
let c = false;
if (isCdmMode()) {
c = $$("div#RROW-" + id + " div[class=cdmContentInner]")[0];
c = $$("div#RROW-" + id + " div[class=content-inner]")[0];
} else if (id == getActiveArticleId()) {
c = $$("div[class=postContent]")[0];
}

@ -28,8 +28,8 @@ require(['dojo/_base/kernel', 'dojo/ready'], function (dojo, ready) {
PluginHost.register(PluginHost.HOOK_ARTICLE_RENDERED_CDM, function(row) {
window.setTimeout(function() {
if (row) {
const c_inner = row.select(".cdmContentInner")[0];
const c_inter = row.select(".cdmIntermediate")[0];
const c_inner = row.select(".content-inner")[0];
const c_inter = row.select(".intermediate")[0];
if (c_inner && c_inter &&
row.offsetHeight >= _shorten_expanded_threshold * window.innerHeight) {

@ -41,6 +41,6 @@ class BasicTest extends PHPUnit_Extensions_Selenium2TestCase {
$this->byCssSelector('#dijit__TreeNode_3')->click();
$this->byCssSelector('#RROW-1 > div.cdmHeader')->displayed();
$this->byCssSelector('#RROW-1 > .header')->displayed();
}
}

Loading…
Cancel
Save