Change inner borders in media galleries in web UI (#31852)

This commit is contained in:
Eugen Rochko 2024-09-11 09:29:18 +02:00 committed by GitHub
parent 9e12fa254e
commit a3215c0f88
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 59 additions and 1 deletions

View file

@ -327,7 +327,7 @@ class MediaGallery extends PureComponent {
} }
return ( return (
<div className='media-gallery' style={style} ref={this.handleRef}> <div className={`media-gallery media-gallery--layout-${size}`} style={style} ref={this.handleRef}>
{(!visible || uncached) && ( {(!visible || uncached) && (
<div className={classNames('spoiler-button', { 'spoiler-button--click-thru': uncached })}> <div className={classNames('spoiler-button', { 'spoiler-button--click-thru': uncached })}>
{spoilerButton} {spoilerButton}

View file

@ -6953,6 +6953,64 @@ a.status-card {
grid-template-columns: 50% 50%; grid-template-columns: 50% 50%;
grid-template-rows: 50% 50%; grid-template-rows: 50% 50%;
gap: 2px; gap: 2px;
&--layout-2 {
.media-gallery__item:nth-child(1) {
border-end-end-radius: 0;
border-start-end-radius: 0;
}
.media-gallery__item:nth-child(2) {
border-start-start-radius: 0;
border-end-start-radius: 0;
}
}
&--layout-3 {
.media-gallery__item:nth-child(1) {
border-end-end-radius: 0;
border-start-end-radius: 0;
}
.media-gallery__item:nth-child(2) {
border-start-start-radius: 0;
border-end-start-radius: 0;
border-end-end-radius: 0;
}
.media-gallery__item:nth-child(3) {
border-start-start-radius: 0;
border-end-start-radius: 0;
border-start-end-radius: 0;
}
}
&--layout-4 {
.media-gallery__item:nth-child(1) {
border-end-end-radius: 0;
border-start-end-radius: 0;
border-end-start-radius: 0;
}
.media-gallery__item:nth-child(2) {
border-start-start-radius: 0;
border-end-start-radius: 0;
border-end-end-radius: 0;
}
.media-gallery__item:nth-child(3) {
border-start-start-radius: 0;
border-start-end-radius: 0;
border-end-start-radius: 0;
border-end-end-radius: 0;
}
.media-gallery__item:nth-child(4) {
border-start-start-radius: 0;
border-end-start-radius: 0;
border-start-end-radius: 0;
}
}
} }
.media-gallery__item { .media-gallery__item {