Commander1024/lostplaces-backend
Commander1024/lostplaces-backend
1
0
Fork 0
Code Issues 14 Pull Requests Releases Wiki Activity

CSS for adding and deleting images

Browse Source
This commit is contained in:
reverend 2020-09-26 09:47:34 +02:00
parent 5f304b91f3
commit 277cac323e
1 changed files with 50 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
django_lostplaces/lostplaces/static/main.css
View File

@ -1588,23 +1588,56 @@ body {
border: none; }
.LP-ImageGrid__Container {
gap: 10px; }
.LP-ImageGrid .LP-ImageGrid__Item, .LP-ImageGrid .LP-ImageGrid__Item * {
.LP-ImageGrid__Item {
position: relative; }
.LP-ImageGrid__Item, .LP-ImageGrid__Item * {
overflow: hidden;
word-break: break-all; }
.LP-ImageGrid .LP-ImageGrid__Item img {
.LP-ImageGrid__Item img {
width: 100%;
height: 100%;
object-fit: cover; }
.LP-ImageGrid .LP-ImageGrid__Item--left img {
.LP-ImageGrid__Item--left img {
object-position: left; }
.LP-ImageGrid .LP-ImageGrid__Item--center img {
.LP-ImageGrid__Item--center img {
object-position: center; }
.LP-ImageGrid .LP-ImageGrid__Item--top img {
.LP-ImageGrid__Item--top img {
object-position: top; }
.LP-ImageGrid .LP-ImageGrid__Item--bottom img {
.LP-ImageGrid__Item--bottom img {
object-position: botom; }
.LP-ImageGrid .LP-ImageGrid__Item--center img {
.LP-ImageGrid__Item--center img {
object-position: center; }
.LP-ImageGrid__Item--add .LP-Link {
width: 100%;
height: 100%;
position: relative;
display: block;
background: #f9f9f9; }
.LP-ImageGrid__Item--add .LP-Link .LP-Icon {
width: 35px;
height: 35px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%); }
.LP-ImageGrid__DeleteItem {
opacity: 0.7;
visibility: hidden;
position: absolute;
top: 10px;
right: 10px;
background-color: #C09F80;
border-radius: 50%;
height: 35px;
width: 35px; }
.LP-ImageGrid__DeleteItem .LP-Link .LP-Icon {
height: 20px;
width: 20px;
position: relative;
left: 8.33333px;
top: 8.33333px; }
.LP-ImageGrid__Item > .LP-Link:hover + .LP-ImageGrid__DeleteItem, .LP-ImageGrid__DeleteItem:hover {
visibility: visible; }
.LP-MainContainer {
margin: 0 auto;