1
0
mirror of https://github.com/xuthus83/pigallery2.git synced 2024-11-03 21:04:03 +08:00

improving unrendered photo position

This commit is contained in:
Patrik J. Braun 2018-05-15 21:30:41 -04:00
parent a30fee8c45
commit a2c39653e5
6 changed files with 16 additions and 3 deletions

View File

@ -7,9 +7,11 @@
}
.static span {
top: calc(50% - 61px);
left: calc(50% - 25px);
margin-top: 36px;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
left: 50%;
display: table;
}
.sk-cube-grid {

View File

@ -7,6 +7,7 @@ img {
-ms-animation: fadein 2s; /* Internet Explorer */
-o-animation: fadein 2s; /* Opera < 12.1 */
animation: fadein 2s;
vertical-align: unset;
}
@keyframes fadein {
@ -61,6 +62,7 @@ img {
-moz-transition: margin .3s ease-out, background-color .3s ease-out;
-webkit-transition: margin .3s ease-out, background-color .3s ease-out;
-o-transition: margin .3s ease-out, background-color .3s ease-out;
-ms-transition: margin .3s ease-out, background-color .3s ease-out;
}
.photo-container {

View File

@ -23,6 +23,7 @@ app-gallery-lightbox-photo {
background-color: black;
transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
}
@ -53,6 +54,7 @@ app-gallery-lightbox-photo {
transition: width 0.3s ease-in-out, opacity 1s;
-webkit-transition: width 0.3s ease-in-out, opacity 1s;
-o-transition: width 0.3s ease-in-out, opacity 1s;
-ms-transition: width 0.3s ease-in-out, opacity 1s;
-moz-transition: width 0.3s ease-in-out, opacity 1s;
}
@ -104,6 +106,7 @@ app-gallery-lightbox-photo {
-moz-transition: opacity .2s ease-out;
-webkit-transition: opacity .2s ease-out;
-o-transition: opacity .2s ease-out;
-ms-transition: opacity .2s ease-out;
}
.highlight:hover {
@ -138,6 +141,7 @@ app-info-panel {
top: 0;
transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
}

View File

@ -12,6 +12,7 @@
cursor: pointer;
transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
}
@ -31,6 +32,7 @@
background-color: black;
transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
}
@ -64,6 +66,7 @@
-moz-transition: opacity .2s ease-out;
-webkit-transition: opacity .2s ease-out;
-o-transition: opacity .2s ease-out;
-ms-transition: opacity .2s ease-out;
}
.highlight:hover {

View File

@ -30,5 +30,6 @@
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

View File

@ -22,6 +22,7 @@
<div style="position: absolute;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
left: 50%;
text-align: center">
<img src="assets/icon.png" style="max-width: 256px"/>