1
0
mirror of https://github.com/xuthus83/pigallery2.git synced 2025-01-14 14:43:17 +08:00
pigallery2/src/frontend/app/ui/gallery/gallery.component.css
2022-01-13 23:25:36 +01:00

100 lines
1.8 KiB
CSS

.container-fluid {
width: 100%;
padding: 0;
margin-top: -20px;
}
.blog-wrapper {
opacity: 0.8;
display: flex;
position: relative;
}
.blog-wrapper:hover {
opacity: 1;
}
.blog-map-row {
width: 100%;
display: flex;
position: relative;
margin-top: 0.2em;
margin-bottom: 0.2em;
min-height: 80px;
}
.btn-blog-details {
width: calc(100% - 5px);
position: absolute;
bottom: 0;
margin-left: 2px;
margin-right: 2px;
color: #333;
border: 0;
}
.btn-blog-details:hover {
color: #000;
background-image: linear-gradient(transparent, #ccc);
}
app-gallery-blog {
float: left;
width: 100%;
margin-right: 0.25em;
margin-left: 2px;
}
app-gallery-map {
display: block;
height: 80px;
width: 100px;
position: absolute;
right: 4px
}
.directories {
margin-right: 2px;
margin-left: 2px;
}
.spinner {
margin-top: 50px;
width: 80px;
height: 80px;
background-color: #333;
margin-left: auto;
margin-right: auto;
-webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
animation: sk-rotateplane 1.2s infinite ease-in-out;
}
@-webkit-keyframes sk-rotateplane {
0% {
-webkit-transform: perspective(120px)
}
50% {
-webkit-transform: perspective(120px) rotateY(180deg)
}
100% {
-webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg)
}
}
@keyframes sk-rotateplane {
0% {
transform: perspective(120px) rotateX(0deg) rotateY(0deg);
-webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
}
50% {
transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
-webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
}
100% {
transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
-webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
}
}