lazy loading icon for both mobile and desktop

This commit is contained in:
azivner 2018-12-30 21:13:35 +01:00
parent 6963e662ef
commit de9e0c7929
5 changed files with 54 additions and 4 deletions

View file

@ -1,4 +1,4 @@
FROM node:10.14.0-alpine
FROM node:10.15.0-alpine
# Create app directory
WORKDIR /usr/src/app

View file

@ -1,7 +1,7 @@
#!/usr/bin/env bash
PKG_DIR=dist/trilium-linux-x64-server
NODE_VERSION=10.14.1
NODE_VERSION=10.15.0
rm -r $PKG_DIR
mkdir $PKG_DIR

View file

@ -61,4 +61,18 @@
#context-menu-container .dropdown-item {
padding: 0 7px 0 10px;
}
.fancytree-loading span.fancytree-expander {
width: 16px;
height: 16px;
margin-left: 6px;
}
.fancytree-loading span.fancytree-expander:after {
width: 12px;
height: 12px;
margin-top: 2px;
border-width: 1px;
border-style: solid;
}

View file

@ -88,4 +88,18 @@ kbd {
.dropdown-menu {
font-size: larger;
}
.fancytree-loading span.fancytree-expander {
width: 32px;
height: 32px;
margin-left: 4px;
}
.fancytree-loading span.fancytree-expander:after {
width: 20px;
height: 20px;
margin: 4px;
border-width: 2px;
border-style: solid;
}

View file

@ -16,13 +16,13 @@ body {
flex-grow: 100;
}
.fancytree-node .fancytree-expander {
.fancytree-node:not(.fancytree-loading) .fancytree-expander {
background: none;
width: auto;
height: auto;
}
.fancytree-node .fancytree-expander:before {
.fancytree-node:not(.fancytree-loading) .fancytree-expander:before {
font-family: 'jam-icons' !important;
speak: none;
font-style: normal;
@ -687,4 +687,26 @@ div[data-notify="container"] {
margin: var(--ck-spacing-large) 0;
color: #aaa;
}
.fancytree-loading span.fancytree-expander {
background-image: none !important;
display: inline-block;
}
.fancytree-loading span.fancytree-expander:after {
content: " ";
display: block;
border-radius: 50%;
border-color: #000 transparent #000 transparent;
animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}