writing mode: gallery vertical support

This commit is contained in:
Yhëhtozr 2022-12-23 00:05:43 +09:00
parent 38650ac713
commit f132e01014
2 changed files with 15 additions and 2 deletions

View file

@ -89,9 +89,9 @@ const Gallery = {
},
rowStyle (row) {
if (row.audio) {
return { 'padding-bottom': '25%' } // fixed reduced height for audio
return { 'padding-block-end': '25%' } // fixed reduced height for audio
} else if (!row.minimal && !row.grid) {
return { 'padding-bottom': `${(100 / (row.items.length + 0.6))}%` }
return { 'padding-block-end': `${(100 / (row.items.length + 0.6))}%` }
}
},
itemStyle (id, row) {

View file

@ -87,6 +87,7 @@
<style lang="scss">
@import '../../_variables.scss';
@import '../../_logical.scss';
.Gallery {
.gallery-rows {
@ -116,6 +117,18 @@
/* Autoprefixed seem to ignore this one, and also syntax is different */
-webkit-mask-composite: xor;
mask-composite: exclude;
.#{$writing-mode-vertical}lr & {
mask:
linear-gradient(to left, white, transparent) right/70px 100% no-repeat,
linear-gradient(to left, white, white);
mask-composite: exclude;
}
.#{$writing-mode-vertical}rl & {
mask:
linear-gradient(to right, white, transparent) left/70px 100% no-repeat,
linear-gradient(to right, white, white);
mask-composite: exclude;
}
}
}