mirror of
https://github.com/penpot/penpot.git
synced 2025-03-11 23:31:21 -05:00
🐛 Fix loader position while verifying token
This commit is contained in:
parent
443d157dbe
commit
5cb8ce3319
7 changed files with 38 additions and 7 deletions
|
@ -600,6 +600,22 @@
|
|||
color: var(--modal-button-foreground-color-error);
|
||||
}
|
||||
|
||||
.loader-base {
|
||||
@include flexCenter;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
z-index: $z-index-alert;
|
||||
background-color: var(--loader-background);
|
||||
:global(svg#loader-pencil) {
|
||||
height: $s-100;
|
||||
width: $s-100;
|
||||
animation: loaderColor 5s infinite ease;
|
||||
fill: var(--icon-foreground);
|
||||
}
|
||||
}
|
||||
// UI ELEMENTS
|
||||
.asset-element {
|
||||
@include titleTipography;
|
||||
|
|
|
@ -5,3 +5,7 @@
|
|||
// Copyright (c) KALEIDOS INC
|
||||
|
||||
@use "./common.scss";
|
||||
|
||||
.verify-token {
|
||||
@extend .loader-base;
|
||||
}
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
;; Copyright (c) KALEIDOS INC
|
||||
|
||||
(ns app.main.ui.loader
|
||||
(:require-macros [app.main.style :as stl])
|
||||
(:require
|
||||
[app.main.store :as st]
|
||||
[app.main.ui.icons :as i]
|
||||
|
@ -15,4 +16,5 @@
|
|||
(mf/defc loader
|
||||
[]
|
||||
(when (mf/deref st/loader)
|
||||
[:div.loader-content i/loader-pencil]))
|
||||
[:div {:class (stl/css :loader-content)}
|
||||
i/loader-pencil]))
|
||||
|
|
11
frontend/src/app/main/ui/loader.scss
Normal file
11
frontend/src/app/main/ui/loader.scss
Normal file
|
@ -0,0 +1,11 @@
|
|||
// This Source Code Form is subject to the terms of the Mozilla Public
|
||||
// License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
// file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
//
|
||||
// Copyright (c) KALEIDOS INC
|
||||
|
||||
@import "refactor/common-refactor.scss";
|
||||
|
||||
.loader-content {
|
||||
@extend .loader-base;
|
||||
}
|
|
@ -607,6 +607,6 @@
|
|||
(let [props (obj/merge props #js {:data data :key (dm/str file-id)})]
|
||||
[:> viewer-content props])
|
||||
|
||||
[:div.loader-content.viewer-loader
|
||||
[:div {:class (stl/css :loader-content)}
|
||||
i/loader-pencil]))
|
||||
|
||||
|
|
|
@ -175,8 +175,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
:global(svg#loader-pencil) {
|
||||
fill: var(--icon-foreground);
|
||||
.loader-content {
|
||||
@extend .loader-base;
|
||||
}
|
||||
|
||||
/** FULLSCREEN */
|
||||
|
|
|
@ -30,9 +30,7 @@
|
|||
grid-template-columns: auto 1fr auto;
|
||||
|
||||
.workspace-loader {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@include flexCenter;
|
||||
grid-area: viewport;
|
||||
background-color: var(--loader-background);
|
||||
:global(svg#loader-pencil) {
|
||||
|
|
Loading…
Add table
Reference in a new issue