photoprism/frontend/css/photo.css
2018-09-25 08:18:02 +02:00

119 lines
No EOL
1.8 KiB
CSS

.photo-tile {
cursor: pointer;
}
.photo-tile.selected {
opacity: 0.6;
}
.photo-grid .photo {
background: #eeeeee;
display: block;
width: 250px;
height: 250px;
float: left;
margin: 3px;
overflow: hidden;
position: relative;
cursor: pointer;
}
.photo-grid .photo img {
margin: 0;
padding: 0;
}
.photo-grid .photo .info {
display: none;
position: absolute;
top: 0;
left: 0;
right: 0;
opacity: 0.75;
background: black;
font-size: 12px;
padding: 8px 12px;
color: white;
cursor: text;
}
.photo-grid .photo:hover .info {
display: block;
}
.photo-grid .photo .right {
float: right;
}
.photo-grid .photo .left {
float: left;
}
.photo-grid .photo .actions {
display: block;
position: absolute;
bottom: 0;
left: 0;
right: 0;
opacity: 1;
background: transparent;
font-size: 14px;
padding: 6px 12px;
color: white;
text-align: center;
cursor: default;
}
.photo-grid .photo:hover .actions {
background: black;
opacity: 0.75;
}
.photo-grid .photo .actions .action {
display: none;
}
.photo-grid .photo .location {
display: none;
font-size: 12px;
text-decoration: none;
color: white;
}
.photo-grid .photo:hover .location {
display: inline;
}
.photo-grid .photo:hover .actions .action,
.photo-grid .photo .actions .action.favorite {
display: inline;
cursor: pointer;
}
.photo-carousel {
overflow: hidden;
}
.photo-carousel .next,
.photo-carousel .prev {
position: absolute;
top: 50%;
z-index: 1;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.photo-carousel .next {
right: 5px;
}
.photo-carousel .prev {
left: 5px;
}
.photo-carousel .photo-img {
margin: 0;
padding: 0;
cursor: pointer
}