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

use svg icon for headlines loadmore prompt

This commit is contained in:
Andrew Dolgov 2021-03-16 22:09:01 +03:00
parent 32c080bec0
commit 0f5fd9ea13
9 changed files with 42 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
index.php
View File

@ -131,9 +131,10 @@
<div id="main" dojoType="dijit.layout.BorderContainer">
<div id="feeds-holder" dojoType="dijit.layout.ContentPane" region="leading" style="width : 20%" splitter="true">
<div id="feedlistLoading">
<img src='images/indicator_tiny.gif'/>
<?= __("Loading, please wait..."); ?></div>
<div id="feedlistLoading" class="text-center text-muted text-small">
<img class="icon-three-dots" src="images/three-dots.svg?2">
<?= __("Loading, please wait..."); ?>
</div>
<?php
PluginHost::getInstance()->run_hooks_callback(PluginHost::HOOK_FEED_TREE, function ($result) {
echo $result;

3
js/Headlines.js
View File

@ -351,8 +351,7 @@ const Headlines = {
// invoke lazy load if last article in buffer is nearly visible OR is active
if (Article.getActive() == last_row.getAttribute("data-article-id") || last_row.offsetTop - 250 <= container.scrollTop + container.offsetHeight) {
hsp.innerHTML = "<span class='loading'><img src='images/indicator_tiny.gif'> " +
__("Loading, please wait...") + "</span>";
hsp.innerHTML = `<span class='text-muted text-small text-center'><img class="icon-three-dots" src="${App.getInitParam('icon_three_dots')}"> ${__("Loading, please wait...")}</span>`;
Headlines.loadMore();
return;

7
themes/compact.css
View File

@ -705,7 +705,6 @@ body.ttrss_main #headlines-frame #headlines-spacer {
text-align: center;
color: #555;
font-size: 11px;
font-style: italic;
}
body.ttrss_main #headlines-frame #headlines-spacer a,
body.ttrss_main #headlines-frame #headlines-spacer span {
@ -1193,6 +1192,11 @@ body.ttrss_utility hr {
width: 18px;
height: 18px;
}
.icon-three-dots {
width: 18px;
height: 18px;
vertical-align: middle;
}
::selection {
background: #257aa7;
color: white;
@ -1384,6 +1388,7 @@ body.ttrss_utility hr {
.cdm .content-inner .icon-unpack-pending {
width: 18px;
height: 18px;
vertical-align: middle;
}
.cdm .content-inner .embed-responsive {
overflow: hidden;

7
themes/compact_night.css
View File

@ -705,7 +705,6 @@ body.ttrss_main #headlines-frame #headlines-spacer {
text-align: center;
color: #ccc;
font-size: 11px;
font-style: italic;
}
body.ttrss_main #headlines-frame #headlines-spacer a,
body.ttrss_main #headlines-frame #headlines-spacer span {
@ -1193,6 +1192,11 @@ body.ttrss_utility hr {
width: 18px;
height: 18px;
}
.icon-three-dots {
width: 18px;
height: 18px;
vertical-align: middle;
}
::selection {
background: #b87d2c;
color: #333;
@ -1384,6 +1388,7 @@ body.ttrss_utility hr {
.cdm .content-inner .icon-unpack-pending {
width: 18px;
height: 18px;
vertical-align: middle;
}
.cdm .content-inner .embed-responsive {
overflow: hidden;

7
themes/light.css
View File

@ -705,7 +705,6 @@ body.ttrss_main #headlines-frame #headlines-spacer {
text-align: center;
color: #555;
font-size: 11px;
font-style: italic;
}
body.ttrss_main #headlines-frame #headlines-spacer a,
body.ttrss_main #headlines-frame #headlines-spacer span {
@ -1193,6 +1192,11 @@ body.ttrss_utility hr {
width: 18px;
height: 18px;
}
.icon-three-dots {
width: 18px;
height: 18px;
vertical-align: middle;
}
::selection {
background: #257aa7;
color: white;
@ -1384,6 +1388,7 @@ body.ttrss_utility hr {
.cdm .content-inner .icon-unpack-pending {
width: 18px;
height: 18px;
vertical-align: middle;
}
.cdm .content-inner .embed-responsive {
overflow: hidden;

3
themes/light/cdm.less
View File

@ -210,8 +210,7 @@
.content-inner {
.icon-unpack-pending {
width : 18px;
height : 18px;
.icon-three-dots;
}
}

7
themes/light/tt-rss.less
View File

@ -829,7 +829,6 @@ body.ttrss_main {
text-align : center;
color : @default-text;
font-size : @font-size-small;
font-style : italic;
a, span {
color : @default-text;
@ -1404,6 +1403,12 @@ body.ttrss_main, body.ttrss_utility {
}
}
.icon-three-dots {
width : 18px;
height : 18px;
vertical-align : middle;
}
::selection {
background : @color-accent;
color : @default-bg;

7
themes/night.css
View File

@ -706,7 +706,6 @@ body.ttrss_main #headlines-frame #headlines-spacer {
text-align: center;
color: #ccc;
font-size: 11px;
font-style: italic;
}
body.ttrss_main #headlines-frame #headlines-spacer a,
body.ttrss_main #headlines-frame #headlines-spacer span {
@ -1194,6 +1193,11 @@ body.ttrss_utility hr {
width: 18px;
height: 18px;
}
.icon-three-dots {
width: 18px;
height: 18px;
vertical-align: middle;
}
::selection {
background: #b87d2c;
color: #333;
@ -1385,6 +1389,7 @@ body.ttrss_utility hr {
.cdm .content-inner .icon-unpack-pending {
width: 18px;
height: 18px;
vertical-align: middle;
}
.cdm .content-inner .embed-responsive {
overflow: hidden;

7
themes/night_blue.css
View File

@ -706,7 +706,6 @@ body.ttrss_main #headlines-frame #headlines-spacer {
text-align: center;
color: #ccc;
font-size: 11px;
font-style: italic;
}
body.ttrss_main #headlines-frame #headlines-spacer a,
body.ttrss_main #headlines-frame #headlines-spacer span {
@ -1194,6 +1193,11 @@ body.ttrss_utility hr {
width: 18px;
height: 18px;
}
.icon-three-dots {
width: 18px;
height: 18px;
vertical-align: middle;
}
::selection {
background: #257aa7;
color: #333;
@ -1385,6 +1389,7 @@ body.ttrss_utility hr {
.cdm .content-inner .icon-unpack-pending {
width: 18px;
height: 18px;
vertical-align: middle;
}
.cdm .content-inner .embed-responsive {
overflow: hidden;