Added text to moderated picture

This commit is contained in:
Julien Constant
2023-03-08 13:31:07 +01:00
parent a9194c4f68
commit b7da4c5727
4 changed files with 72 additions and 31 deletions

View File

@ -66,7 +66,9 @@
}
}
> div > input,
> input {
box-sizing: border-box;
height: 40px;
width: 100%;
max-width: 300px;
@ -75,6 +77,16 @@
max-width: 100%;
}
}
> div {
width: 100%;
max-width: 300px;
}
> input[type=submit]:hover {
background-color: #287fb8;
color: white;
}
}
}
@ -136,8 +148,6 @@
> .photo,
> .album {
border: none;
box-sizing: border-box;
background-size: cover;
background-repeat: no-repeat;
@ -156,8 +166,24 @@
width: 100%;
}
> div {
&:hover > .text {
background-color: rgba(0, 0, 0, .5);
}
&:hover > .overlay {
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
~ .text {
background-color: transparent;
}
}
> .text {
position: absolute;
box-sizing: border-box;
top: 0;
left: 0;
width: 100%;
height: 100%;
@ -168,20 +194,22 @@
padding: 10px;
color: white;
&:hover {
background: rgba(0, 0, 0, .5);
}
}
&.not_moderated {
> .overlay {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
&::before {
content: '⚠️';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: '⚠️';
color: white;
display: flex;
justify-content: center;
@ -191,11 +219,6 @@
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px);
}
&:hover::before {
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
}
}
}
@ -205,5 +228,10 @@
text-align: left;
word-break: break-word;
}
> .photo > .text {
align-items: center;
padding-bottom: 30px;
}
}
}