mirror of
https://github.com/BobbyWibowo/lolisafe.git
synced 2024-12-13 16:06:21 +00:00
07b4ef8fc2
Added a new config entry named "cacheFileIdentifiers". More info in config.sample.js file. Improved some descriptions in config.sample.js file. Added some CSS animations wherever applicable. Bumped v1 version string.
201 lines
4.4 KiB
CSS
201 lines
4.4 KiB
CSS
#b {
|
|
width: 200px;
|
|
height: 200px;
|
|
border-radius: 100%;
|
|
display: inline-block;
|
|
margin-bottom: 40px;
|
|
position: relative;
|
|
vertical-align: top;
|
|
-webkit-animation-delay: 0.5s;
|
|
animation-delay: 0.5s;
|
|
-webkit-animation-duration: 1.5s;
|
|
animation-duration: 1.5s;
|
|
-webkit-animation-fill-mode: both;
|
|
animation-fill-mode: both;
|
|
-webkit-animation-name: floatUp;
|
|
animation-name: floatUp;
|
|
-webkit-animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
|
|
animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
|
|
-webkit-box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
}
|
|
|
|
#b img.logo {
|
|
max-height: 200px;
|
|
}
|
|
|
|
#dropzone * {
|
|
pointer-events: none;
|
|
}
|
|
|
|
#tokenContainer,
|
|
#panel {
|
|
display: none;
|
|
}
|
|
|
|
#maxFileSize {
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.dz-preview .dz-details {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
|
|
.dz-preview .dz-details .dz-size,
|
|
.dz-preview .dz-details .dz-filename {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1;
|
|
flex: 1;
|
|
}
|
|
|
|
.dz-preview img,
|
|
.dz-preview .dz-success-mark,
|
|
.dz-preview .dz-error-mark {
|
|
display: none;
|
|
}
|
|
|
|
@-webkit-keyframes floatUp {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
|
|
box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
|
|
-webkit-transform: scale(0.86);
|
|
transform: scale(0.86);
|
|
}
|
|
25% {
|
|
opacity: 100;
|
|
}
|
|
67% {
|
|
-webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
-webkit-box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
|
|
@keyframes floatUp {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
|
|
box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
|
|
-webkit-transform: scale(0.86);
|
|
transform: scale(0.86);
|
|
}
|
|
25% {
|
|
opacity: 100;
|
|
}
|
|
67% {
|
|
-webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
-webkit-box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
|
|
.uploads {
|
|
padding-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.uploads>div {
|
|
-webkit-animation: fadeInOpacity .5s;
|
|
animation: fadeInOpacity .5s;
|
|
}
|
|
|
|
.uploads.nojs {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.uploads progress {
|
|
margin-top: .5rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.uploads img {
|
|
max-width: 200px;
|
|
}
|
|
|
|
.name {
|
|
font-size: 1rem;
|
|
color: #bdc3c7;
|
|
word-break: break-all;
|
|
}
|
|
|
|
.link>a {
|
|
word-break: break-all;
|
|
}
|
|
|
|
.clipboard-mobile {
|
|
margin-top: 5px;
|
|
}
|
|
|
|
#albumDiv {
|
|
-webkit-animation: fadeInOpacity .5s;
|
|
animation: fadeInOpacity .5s;
|
|
}
|
|
|
|
#albumDiv .control {
|
|
text-align: inherit;
|
|
}
|
|
|
|
#linksColumn {
|
|
margin-left: -0.25rem;
|
|
margin-right: -0.25rem;
|
|
-webkit-animation: fadeInOpacity .5s;
|
|
animation: fadeInOpacity .5s;
|
|
}
|
|
|
|
#linksColumn .column {
|
|
padding-left: 0.25rem;
|
|
padding-right: 0.25rem;
|
|
}
|
|
|
|
#linksColumn>span {
|
|
padding: 0 0.3rem;
|
|
color: #7f8c8d;
|
|
}
|
|
|
|
#tabs {
|
|
margin-bottom: 1rem;
|
|
-webkit-animation: fadeInOpacity .5s;
|
|
animation: fadeInOpacity .5s;
|
|
}
|
|
|
|
#tabs ul {
|
|
border-bottom: 1px solid #bdc3c7;
|
|
}
|
|
|
|
#tabs li:not(.is-active) a {
|
|
color: #bdc3c7;
|
|
}
|
|
|
|
#tabs li:not(.is-active) a:hover {
|
|
color: #7f8c8d;
|
|
border-bottom-color: #7f8c8d;
|
|
}
|
|
|
|
.tabs li.is-active a {
|
|
border-bottom-color: #3794d2;
|
|
color: #3794d2;
|
|
}
|
|
|
|
.tab-content {
|
|
margin-bottom: -.75rem;
|
|
-webkit-animation: fadeInOpacity .5s;
|
|
animation: fadeInOpacity .5s;
|
|
}
|