Initial
This commit is contained in:
121
themes/gallerydeluxe/assets/css/gallerydeluxe/styles.css
Normal file
121
themes/gallerydeluxe/assets/css/gallerydeluxe/styles.css
Normal file
@@ -0,0 +1,121 @@
|
||||
.gd-figure:hover {
|
||||
filter: brightness(1.25);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.gd-modal-target {
|
||||
width: 300px;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.gd-modal-target:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.gd-modal {
|
||||
display: none;
|
||||
position: fixed;
|
||||
z-index: 5;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
background-color: rgb(0, 0, 0);
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
|
||||
.gd-modal-content-wrapper {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Modal Content (image) */
|
||||
.gd-modal-content {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
margin: auto;
|
||||
overflow: auto;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.gd-modal-content.gd-modal-thumbnail {
|
||||
backdrop-filter: blur(5px);
|
||||
transition: opacity 0.75s ease;
|
||||
z-index: 10;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.gd-modal-content.gd-modal-loaded.gd-modal-thumbnail {
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.gd-modal-exif {
|
||||
position: absolute;
|
||||
z-index: 20;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
color: #fff;
|
||||
background-color: #8a8a8a;
|
||||
padding: 0.75rem;
|
||||
opacity: 0.75;
|
||||
filter: drop-shadow(-1px -1px 2px #ccc);
|
||||
}
|
||||
|
||||
.gd-modal-exif-ontimeout {
|
||||
transition: opacity 2s ease-out;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.gd-modal-exif:hover {
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.gd-modal-exif dl dd {
|
||||
display: inline;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.gd-modal-exif dl dd:after {
|
||||
display: block;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.gd-modal-exif dl dt {
|
||||
display: inline-block;
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
.gd-modal-close {
|
||||
position: absolute;
|
||||
z-index: 20;
|
||||
top: 0px;
|
||||
right: 10px;
|
||||
color: #8a8a8a;
|
||||
font-size: 40px;
|
||||
font-weight: bold;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
@media only screen and (max-device-width: 800px) {
|
||||
.gd-modal-close {
|
||||
font-size: 45px;
|
||||
}
|
||||
}
|
||||
|
||||
.gd-modal-close:hover,
|
||||
.gd-modal-close:focus {
|
||||
color: #bbb;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
Reference in New Issue
Block a user