Update mx_AppLoading
to improve maintainability (#10783)
* Nesting: mx_AppLoading * Conform class and animation name to the naming policy * Nesting for maintainability, preventing the rule from becoming an orphan * Rename the class: mx_AppLoading to mx_AppTile_loading
This commit is contained in:
parent
631ac742aa
commit
aed5fcf64a
2 changed files with 22 additions and 24 deletions
|
@ -379,7 +379,7 @@ $MinWidth: 240px;
|
|||
}
|
||||
}
|
||||
|
||||
.mx_AppLoading {
|
||||
.mx_AppTile_loading {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
@ -391,24 +391,26 @@ $MinWidth: 240px;
|
|||
/* match bg of border so that the cut corners have the right fill */
|
||||
background-color: $widget-body-bg-color !important;
|
||||
border-radius: 8px;
|
||||
|
||||
iframe {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* const loadingElement */
|
||||
.mx_AppTile_loading_fadeInSpinner {
|
||||
animation-fill-mode: backwards;
|
||||
animation-duration: 200ms;
|
||||
animation-delay: 500ms;
|
||||
animation-name: mx_AppTile_loading_fadeInSpinnerAnimation;
|
||||
|
||||
.mx_Spinner {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_AppLoading .mx_Spinner {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.mx_AppLoading_spinner_fadeIn {
|
||||
animation-fill-mode: backwards;
|
||||
animation-duration: 200ms;
|
||||
animation-delay: 500ms;
|
||||
animation-name: mx_AppLoading_spinner_fadeIn_animation;
|
||||
}
|
||||
|
||||
@keyframes mx_AppLoading_spinner_fadeIn_animation {
|
||||
@keyframes mx_AppTile_loading_fadeInSpinnerAnimation {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
|
@ -417,10 +419,6 @@ $MinWidth: 240px;
|
|||
}
|
||||
}
|
||||
|
||||
.mx_AppLoading iframe {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mx_AppsDrawer_resizing .mx_AppTile_persistedWrapper {
|
||||
z-index: 1;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue