diff --git a/app/javascript/mastodon/components/media_gallery.jsx b/app/javascript/mastodon/components/media_gallery.jsx index 51b25199e1..84699871c5 100644 --- a/app/javascript/mastodon/components/media_gallery.jsx +++ b/app/javascript/mastodon/components/media_gallery.jsx @@ -94,15 +94,21 @@ class Item extends React.PureComponent { height = 50; } - if (size === 5 || size === 6) { + if (size === 5 || size === 6 || size === 9 || size === 10 || size === 11 || size === 12) { height = 33; } - if (size === 7 || size === 8) { + if (size === 7 || size === 8 || size === 13 || size === 14 || size === 15 || size === 16) { height = 25; } if ((size === 5 && index === 4) || (size === 7 && index === 6)) { width = 100; } + if (size === 9) { + width = 33; + } + if (size === 10 || size === 11 || size === 12 || size === 13 || size === 14 || size === 15 || size === 16) { + width = 25; + } if (attachment.get('description')?.length > 0) { badges.push(ALT); @@ -310,7 +316,7 @@ class MediaGallery extends React.PureComponent { style.aspectRatio = '16 / 9'; } - const maxSize = displayMediaExpand ? 8 : 4; + const maxSize = displayMediaExpand ? 16 : 4; const size = media.take(maxSize).size; const uncached = media.every(attachment => attachment.get('type') === 'unknown'); @@ -337,8 +343,15 @@ class MediaGallery extends React.PureComponent { ); } + const rowClass = (size === 5 || size === 6 || size === 9 || size === 10 || size === 11 || size === 12) ? 'media-gallery--row3' : + (size === 7 || size === 8 || size === 13 || size === 14 || size === 15 || size === 16) ? 'media-gallery--row4' : + 'media-gallery--row2'; + const columnClass = (size === 9) ? 'media-gallery--column3' : + (size === 10 || size === 11 || size === 12 || size === 13 || size === 14 || size === 15 || size === 16) ? 'media-gallery--column4' : + 'media-gallery--column2'; + return ( -
+
{spoilerButton}
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 547047324f..bbc140c66b 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -6517,6 +6517,14 @@ a.status-card.compact:hover { &--row4 { grid-template-rows: 25% 25% 25% 25%; } + + &--column3 { + grid-template-columns: 33% 34% 33%; + } + + &--column4 { + grid-template-columns: 25% 25% 25% 25%; + } } .media-gallery__item { diff --git a/config/locales/simple_form.ja.yml b/config/locales/simple_form.ja.yml index 4ed20fe03c..b2b7aaf14e 100644 --- a/config/locales/simple_form.ja.yml +++ b/config/locales/simple_form.ja.yml @@ -60,7 +60,7 @@ ja: setting_display_media_hide_all: メディアを常に隠す setting_display_media_show_all: メディアを常に表示する setting_hide_network: フォローとフォロワーの情報がプロフィールページで見られないようにします - setting_display_media_expand: Misskeyなどは4個を超えて投稿可能です。その追加分を最大8個まで表示します。kmyblueからアップロードはできません + setting_display_media_expand: Misskeyなどは4個を超えて投稿可能です。その追加分を最大16個まで表示します。kmyblueからアップロードはできません setting_noai: AI学習への利用を禁止するメタタグをプロフィールページに追加します。ただし実効性があるとは限りません setting_noindex: 公開プロフィールおよび各投稿ページに影響します setting_public_post_to_unlisted: 未対応のサードパーティアプリからもローカル公開で投稿できますが、公開投稿はWeb以外できなくなります @@ -221,7 +221,7 @@ ja: setting_disable_swiping: スワイプでの切り替えを無効にする setting_display_media: メディアの表示 setting_display_media_default: 標準 - setting_display_media_expand: 5個目以降のメディアも表示する (最大8) + setting_display_media_expand: 5個目以降のメディアも表示する (最大16) setting_display_media_hide_all: 非表示 setting_display_media_show_all: 表示 setting_expand_spoilers: 閲覧注意としてマークされた投稿を常に展開する