vikunja
/
frontend
Archived
6
39
Fork 49
Code Issues 1 Pull Requests 4 Projects Releases 26 Activity

feat: defer everything until the api config is loaded #926

Merged
konrad merged 27 commits from feature/ready-state into main 2021-11-13 19:49:03 +00:00
Conversation 3 Commits 27 Files Changed 10 +29 -31
1 changed files with 29 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 06b2632fb5 - Show all commits

60
src/styles/theme/loading.scss
View File

@ -1,40 +1,38 @@
// FIXME: move to loading.vue
.loader-container {
&.is-loading {
position: relative;
pointer-events: none;
opacity: 0.5;
.loader-container.is-loading {
konrad marked this conversation as resolved Outdated
dpschen commented 2021-11-04 15:53:04 +00:00
Outdated
Review
Copy Link

how about:

// FIXME: move to loading.vue 
.loader-container.is-loading {
    position: relative;
    pointer-events: none;
    opacity: 0.5;

    &::after {
        @include loader;
        position: absolute;
        top: calc(50% - 2.5rem);
        left: calc(50% - 2.5rem);
        width: 5rem;
        height: 5rem;
        border-width: 0.25rem;
    }
    &.is-loading-small::after {
        width: 1.5rem;
        height: 1.5rem;
        top: calc(50% - .75rem);
        left: calc(50% - .75rem);
        border-width: 2px;
    }
}
how about: ```scss // FIXME: move to loading.vue .loader-container.is-loading { position: relative; pointer-events: none; opacity: 0.5; &::after { @include loader; position: absolute; top: calc(50% - 2.5rem); left: calc(50% - 2.5rem); width: 5rem; height: 5rem; border-width: 0.25rem; } &.is-loading-small::after { width: 1.5rem; height: 1.5rem; top: calc(50% - .75rem); left: calc(50% - .75rem); border-width: 2px; } } ```
konrad commented 2021-11-10 19:11:26 +00:00
Outdated
Review
Copy Link

Makes sense. Done.

Makes sense. Done.
position: relative;
pointer-events: none;
opacity: 0.5;
&::after {
@include loader;
position: absolute;
top: calc(50% - 2.5rem);
left: calc(50% - 2.5rem);
width: 5rem;
height: 5rem;
border-width: 0.25rem;
}
}
&::after {
@include loader;
position: absolute;
top: calc(50% - 2.5rem);
left: calc(50% - 2.5rem);
width: 5rem;
height: 5rem;
border-width: 0.25rem;
}
&.is-loading-small.is-loading::after {
width: 1.5rem;
height: 1.5rem;
top: calc(50% - .75rem);
left: calc(50% - .75rem);
border-width: 2px;
}
&.is-loading-small::after {
width: 1.5rem;
height: 1.5rem;
top: calc(50% - .75rem);
left: calc(50% - .75rem);
border-width: 2px;
}
}
// FIXME: move to ShowTasks.vue
.spinner.is-loading {
pointer-events: none;
pointer-events: none;
&::after {
@include loader;
width: 2rem;
height: 2rem;
margin-left: calc(50% - 1rem);
margin-top: 1rem;
border-width: 0.25rem;
}
&::after {
@include loader;
width: 2rem;
height: 2rem;
margin-left: calc(50% - 1rem);
margin-top: 1rem;
border-width: 0.25rem;
}
}