You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
cryptpad/customize.dist/src/less2/loading.less

74 lines
1.8 KiB
Plaintext

/*
WARNING: THIS FILE DOES NOTHING
It exists only as a proposal of what CSS you should use in loading.js
The CSS inside of loading.js is precompiled in order to save 200ish milliseconds to the loading screen.
*/
@import (once) "./include/colortheme-all.less";
@import (once) "./include/browser.less";
#cp-loading {
transition: opacity 0.75s, visibility 0s 0.75s;
visibility: visible;
opacity: 1;
position: fixed;
z-index: 10000000; // #loading
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
background: @colortheme_loading-bg;
color: @colortheme_loading-color;
text-align: center;
font-size: 1.5em;
.cp-loading-container {
margin-top: 50vh;
transform: translateY(-50%);
}
.cp-loading-cryptofist {
margin-left: auto;
margin-right: auto;
height: 300px;
margin-bottom: 2em;
@media screen and (max-height: @browser_media-short-screen) {
display: none;
}
}
.cp-loading-spinner-container {
position: relative;
height: 100px;
> div {
height: 100px;
}
}
&.cp-loading-hidden {
opacity: 0;
visibility: hidden;
}
}
#cp-loading-tip {
position: fixed;
z-index: 10000000; // loading tip
top: 80%;
left: 0;
right: 0;
text-align: center;
transition: opacity 750ms;
transition-delay: 3000ms;
@media screen and (max-height: @browser_media-medium-screen) {
display: none;
}
span {
background: @colortheme_loading-bg;
color: @colortheme_loading-color;
text-align: center;
font-size: 1.5em;
opacity: 0.7;
font-family: @colortheme_font;
padding: 15px;
max-width: 60%;
display: inline-block;
}
}