forked from mystiq/hydrogen-web
change looks of gap tile as it's auto-loaded now
This commit is contained in:
parent
56efd7eee0
commit
2cfd38379f
2 changed files with 18 additions and 5 deletions
|
@ -67,3 +67,18 @@ limitations under the License.
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.GapView {
|
||||||
|
visibility: hidden;
|
||||||
|
display: flex;
|
||||||
|
padding: 10px 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.GapView.isLoading {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.GapView > div {
|
||||||
|
flex: 1;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
|
@ -15,6 +15,7 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {TemplateView} from "../../../general/TemplateView.js";
|
import {TemplateView} from "../../../general/TemplateView.js";
|
||||||
|
import {spinner} from "../../../common.js";
|
||||||
|
|
||||||
export class GapView extends TemplateView {
|
export class GapView extends TemplateView {
|
||||||
render(t, vm) {
|
render(t, vm) {
|
||||||
|
@ -22,12 +23,9 @@ export class GapView extends TemplateView {
|
||||||
GapView: true,
|
GapView: true,
|
||||||
isLoading: vm => vm.isLoading
|
isLoading: vm => vm.isLoading
|
||||||
};
|
};
|
||||||
const label = (vm.isUp ? "🠝" : "🠟") + " fill gap"; //no binding
|
|
||||||
return t.li({className}, [
|
return t.li({className}, [
|
||||||
t.button({
|
spinner(t),
|
||||||
onClick: () => vm.fill(),
|
t.div(vm.i18n`Loading more messages …`),
|
||||||
disabled: vm => vm.isLoading
|
|
||||||
}, label),
|
|
||||||
t.if(vm => vm.error, t.createTemplate(t => t.strong(vm => vm.error)))
|
t.if(vm => vm.error, t.createTemplate(t => t.strong(vm => vm.error)))
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue