From ec2b1ec3f0035466585d9cc2a7842e519e14e31a Mon Sep 17 00:00:00 2001 From: syuilo Date: Fri, 20 Jul 2018 02:40:37 +0900 Subject: #1334 --- .../app/common/views/components/media-list.vue | 24 ++++++++++++++++------ 1 file changed, 18 insertions(+), 6 deletions(-) (limited to 'src/client/app/common') diff --git a/src/client/app/common/views/components/media-list.vue b/src/client/app/common/views/components/media-list.vue index 2f8a1943ad..cdfc2c8d3c 100644 --- a/src/client/app/common/views/components/media-list.vue +++ b/src/client/app/common/views/components/media-list.vue @@ -46,33 +46,45 @@ export default Vue.extend({ display grid grid-gap 4px + > * + overflow hidden + border-radius 4px + &[data-count="1"] grid-template-rows 1fr + &[data-count="2"] grid-template-columns 1fr 1fr grid-template-rows 1fr + &[data-count="3"] grid-template-columns 1fr 0.5fr grid-template-rows 1fr 1fr - :nth-child(1) + + > *:nth-child(1) grid-row 1 / 3 - :nth-child(3) + + > *:nth-child(3) grid-column 2 / 3 grid-row 2 / 3 + &[data-count="4"] grid-template-columns 1fr 1fr grid-template-rows 1fr 1fr - :nth-child(1) + > *:nth-child(1) grid-column 1 / 2 grid-row 1 / 2 - :nth-child(2) + + > *:nth-child(2) grid-column 2 / 3 grid-row 1 / 2 - :nth-child(3) + + > *:nth-child(3) grid-column 1 / 2 grid-row 2 / 3 - :nth-child(4) + + > *:nth-child(4) grid-column 2 / 3 grid-row 2 / 3 -- cgit v1.2.3-freya