mirror
/
ila-microblog.pub
kopia lustrzana https://github.com/Aonrud/ila-microblog.pub
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

fix: correct sensitive attachment layout to prevent overflow

ila
Aonrud 2023-02-11 12:12:48 +00:00
rodzic b950478541
commit 98756c816c
1 zmienionych plików z 54 dodań i 45 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

99
app/scss/ila.scss
Wyświetl plik

@ -256,27 +256,11 @@ header.microblog {
padding-left: 50px;
max-width: 100%;
flex-wrap: wrap;
.attachment-item, .attachment-wrapper {
flex: 1 1 50%;
max-height: 360px;
padding: 5px;
a {
display: flex;
width: 100%;
height: 100%;
justify-content: center;
align-content: center;
}
img {
max-width: 100%;
object-fit: cover;
}
}
&.single {
.attachment-item, .attachment-wrapper {
max-height: fit-content;
}
}
}
.icon {
display: block;
position: absolute;
@ -290,6 +274,59 @@ header.microblog {
}
}
.attachment-item, .attachment-wrapper {
flex: 1 1 50%;
max-height: 360px;
padding: 5px;
a {
display: flex;
width: 100%;
height: 100%;
justify-content: center;
align-content: center;
}
img {
max-width: 100%;
object-fit: cover;
}
}
.attachment-wrapper, .attachment-wrapper > div {
display: flex;
flex-direction: column;
}
.attachment-wrapper > div {
max-height: calc(100% - 1.5em);
}
.show-hide-sensitive-btn {
cursor: pointer;
}
.sensitive-attachment {
display: flex;
flex-direction: column;
max-height: 100%;
.sensitive-attachment-state {
display: none;
}
.sensitive-attachment-state:checked ~ .sensitive-attachment-box div {
display: none;
}
.sensitive-attachment-box {
position: relative;
max-height: 100%;
div {
position: absolute;
width: 100%;
height: 100%;
z-index: 10;
backdrop-filter: blur(2em);
}
}
}
.video-gif-overlay {
display: none;
}
@ -342,10 +379,6 @@ header.microblog {
margin-left: 0;
}
/*******************************************************************
* Straight from main.scss
*/
.emoji, .custom-emoji {
max-width: 25px;
}
@ -383,30 +416,6 @@ header.microblog {
}
}
.show-hide-sensitive-btn {
cursor: pointer;
}
.sensitive-attachment {
display: inline-block;
.sensitive-attachment-state {
display: none;
}
.sensitive-attachment-state:checked ~ .sensitive-attachment-box div {
display:none;
}
.sensitive-attachment-box {
position: relative;
div {
position: absolute;
width: 100%;
height: 100%;
z-index: 10;
backdrop-filter: blur(2em);
}
}
}
.public-interactions {
display: flex;
flex-wrap: wrap;