valvin
/
ttrss
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

combined mode: use flex-box for header/footer layout

This commit is contained in:
Andrew Dolgov 2018-12-05 08:28:18 +03:00
parent a2e06410c2
commit 88c2da72d5
6 changed files with 47 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
classes/feeds.php
View File

@ -468,7 +468,7 @@ class Feeds extends Handler_Protected {
id=\"RROW-$id\" data-content=\"$content_encoded\" data-article-id='$id' data-orig-feed-id='$feed_id' $mouseover_attrs>"; id=\"RROW-$id\" data-content=\"$content_encoded\" data-article-id='$id' data-orig-feed-id='$feed_id' $mouseover_attrs>";
$tmp_content .= "<div class=\"header\">"; $tmp_content .= "<div class=\"header\">";
$tmp_content .= "<div style=\"vertical-align : middle\">"; $tmp_content .= "<div class=\"buttons\">";
$tmp_content .= "<input dojoType=\"dijit.form.CheckBox\" $tmp_content .= "<input dojoType=\"dijit.form.CheckBox\"
type=\"checkbox\" onclick=\"Headlines.onRowChecked(this)\" type=\"checkbox\" onclick=\"Headlines.onRowChecked(this)\"
@ -597,7 +597,7 @@ class Feeds extends Handler_Protected {
$tags_str = Article::format_tags_string($tags, $id); $tags_str = Article::format_tags_string($tags, $id);
$tmp_content .= "<span class='left'>"; $tmp_content .= "<div class='left'>";
$tmp_content .= "<img src='images/tag.png' alt='Tags' title='Tags'> $tmp_content .= "<img src='images/tag.png' alt='Tags' title='Tags'>
<span id=\"ATSTR-$id\">$tags_str</span> <span id=\"ATSTR-$id\">$tags_str</span>
@ -625,8 +625,8 @@ class Feeds extends Handler_Protected {
if ($entry_comments) $tmp_content .= "&nbsp;($entry_comments)"; if ($entry_comments) $tmp_content .= "&nbsp;($entry_comments)";
$tmp_content .= "</span>"; $tmp_content .= "</div>";
$tmp_content .= "<div>"; $tmp_content .= "<div class='right'>";
foreach (PluginHost::getInstance()->get_hooks(PluginHost::HOOK_ARTICLE_BUTTON) as $p) { foreach (PluginHost::getInstance()->get_hooks(PluginHost::HOOK_ARTICLE_BUTTON) as $p) {
$tmp_content .= $p->hook_article_button($line); $tmp_content .= $p->hook_article_button($line);

49
css/cdm.less
View File

@ -1,30 +1,24 @@
.cdm { .cdm {
//margin-right : 4px;
.header, .footer { .header, .footer {
display : table; display : flex;
} flex-direction : row;
flex-wrap : nowrap;
.header img, .header input, .footer img {
vertical-align : middle;
}
.header > div, .footer > div {
white-space : nowrap;
}
.header > span, .footer > span.left {
width : 100%;
} }
.header img, .footer img { .header img, .footer img {
margin : 0px 4px; margin : 0px 4px;
vertical-align: middle;
} }
.header { .header {
> * { > * {
display : table-cell; align-self : center;
padding : 5px; padding : 5px;
white-space : nowrap;
}
.titleWrap {
flex-grow : 2;
} }
span.updated { span.updated {
@ -32,21 +26,6 @@
font-weight : normal; font-weight : normal;
font-size : 11px; font-size : 11px;
white-space : nowrap; white-space : nowrap;
vertical-align : middle;
}
input {
margin-right : 5px;
}
div.updPic {
width : 25px;
display : inline-block;
text-align : center;
}
div.updPic img {
vertical-align : middle;
} }
input { input {
@ -63,8 +42,11 @@
clear : both; clear : both;
> * { > * {
display : table-cell; align-self : center;
vertical-align : middle; }
.left {
flex-grow : 2;
} }
} }
@ -360,7 +342,6 @@ div#floatingTitle.Unread a.title {
white-space : nowrap; white-space : nowrap;
text-overflow : ellipsis; text-overflow : ellipsis;
overflow : hidden; overflow : hidden;
max-width : 500px;
} }
.excerpt { .excerpt {

43
css/default.css
View File

@ -1040,46 +1040,28 @@ body.ttrss_main .dijitDialog h4:first-of-type {
} }
.cdm .header, .cdm .header,
.cdm .footer { .cdm .footer {
display: table; display: flex;
} flex-direction: row;
.cdm .header img, flex-wrap: nowrap;
.cdm .header input,
.cdm .footer img {
vertical-align: middle;
}
.cdm .header > div,
.cdm .footer > div {
white-space: nowrap;
}
.cdm .header > span,
.cdm .footer > span.left {
width: 100%;
} }
.cdm .header img, .cdm .header img,
.cdm .footer img { .cdm .footer img {
margin: 0px 4px; margin: 0px 4px;
vertical-align: middle;
} }
.cdm .header > * { .cdm .header > * {
display: table-cell; align-self: center;
padding: 5px; padding: 5px;
white-space: nowrap;
}
.cdm .header .titleWrap {
flex-grow: 2;
} }
.cdm .header span.updated { .cdm .header span.updated {
color: #555555; color: #555555;
font-weight: normal; font-weight: normal;
font-size: 11px; font-size: 11px;
white-space: nowrap; white-space: nowrap;
vertical-align: middle;
}
.cdm .header input {
margin-right: 5px;
}
.cdm .header div.updPic {
width: 25px;
display: inline-block;
text-align: center;
}
.cdm .header div.updPic img {
vertical-align: middle;
} }
.cdm .header input { .cdm .header input {
margin-left: 4px; margin-left: 4px;
@ -1093,8 +1075,10 @@ body.ttrss_main .dijitDialog h4:first-of-type {
clear: both; clear: both;
} }
.cdm .footer > * { .cdm .footer > * {
display: table-cell; align-self: center;
vertical-align: middle; }
.cdm .footer .left {
flex-grow: 2;
} }
.cdm .intermediate { .cdm .intermediate {
margin: 10px; margin: 10px;
@ -1332,7 +1316,6 @@ div#floatingTitle.Unread a.title {
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
max-width: 500px;
} }
.cdm.expandable .excerpt { .cdm.expandable .excerpt {
white-space: nowrap; white-space: nowrap;

2
css/default.css.map
View File

File diff suppressed because one or more lines are too long

43
themes/night.css
View File

@ -1040,46 +1040,28 @@ body.ttrss_main .dijitDialog h4:first-of-type {
} }
.cdm .header, .cdm .header,
.cdm .footer { .cdm .footer {
display: table; display: flex;
} flex-direction: row;
.cdm .header img, flex-wrap: nowrap;
.cdm .header input,
.cdm .footer img {
vertical-align: middle;
}
.cdm .header > div,
.cdm .footer > div {
white-space: nowrap;
}
.cdm .header > span,
.cdm .footer > span.left {
width: 100%;
} }
.cdm .header img, .cdm .header img,
.cdm .footer img { .cdm .footer img {
margin: 0px 4px; margin: 0px 4px;
vertical-align: middle;
} }
.cdm .header > * { .cdm .header > * {
display: table-cell; align-self: center;
padding: 5px; padding: 5px;
white-space: nowrap;
}
.cdm .header .titleWrap {
flex-grow: 2;
} }
.cdm .header span.updated { .cdm .header span.updated {
color: #555555; color: #555555;
font-weight: normal; font-weight: normal;
font-size: 11px; font-size: 11px;
white-space: nowrap; white-space: nowrap;
vertical-align: middle;
}
.cdm .header input {
margin-right: 5px;
}
.cdm .header div.updPic {
width: 25px;
display: inline-block;
text-align: center;
}
.cdm .header div.updPic img {
vertical-align: middle;
} }
.cdm .header input { .cdm .header input {
margin-left: 4px; margin-left: 4px;
@ -1093,8 +1075,10 @@ body.ttrss_main .dijitDialog h4:first-of-type {
clear: both; clear: both;
} }
.cdm .footer > * { .cdm .footer > * {
display: table-cell; align-self: center;
vertical-align: middle; }
.cdm .footer .left {
flex-grow: 2;
} }
.cdm .intermediate { .cdm .intermediate {
margin: 10px; margin: 10px;
@ -1332,7 +1316,6 @@ div#floatingTitle.Unread a.title {
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
max-width: 500px;
} }
.cdm.expandable .excerpt { .cdm.expandable .excerpt {
white-space: nowrap; white-space: nowrap;

2
themes/night.css.map
View File

File diff suppressed because one or more lines are too long