From 2dba24d0da54b5be3d5435c250af832276ae2c8e Mon Sep 17 00:00:00 2001
From: rinsuki <428rinsuki+git@gmail.com>
Date: Mon, 26 Mar 2018 16:56:46 +0900
Subject: [PATCH 1/4] mk-images -> mk-media-list, mk-images-image ->
mk-media-image
---
src/web/app/common/views/components/index.ts | 4 ++--
.../components/{images.vue => media-list.vue} | 18 +++++++++---------
src/web/app/desktop/views/components/index.ts | 8 ++++----
...image-dialog.vue => media-image-dialog.vue} | 4 ++--
.../{images-image.vue => media-image.vue} | 8 ++++----
.../views/components/post-detail.sub.vue | 2 +-
.../desktop/views/components/post-detail.vue | 2 +-
.../desktop/views/components/posts.post.vue | 2 +-
.../views/components/sub-post-content.vue | 2 +-
src/web/app/mobile/views/components/index.ts | 4 ++--
.../{images-image.vue => media-image.vue} | 4 ++--
.../mobile/views/components/post-detail.vue | 2 +-
src/web/app/mobile/views/components/post.vue | 2 +-
.../views/components/sub-post-content.vue | 2 +-
14 files changed, 32 insertions(+), 32 deletions(-)
rename src/web/app/common/views/components/{images.vue => media-list.vue} (82%)
rename src/web/app/desktop/views/components/{images-image-dialog.vue => media-image-dialog.vue} (94%)
rename src/web/app/desktop/views/components/{images-image.vue => media-image.vue} (89%)
rename src/web/app/mobile/views/components/{images-image.vue => media-image.vue} (82%)
diff --git a/src/web/app/common/views/components/index.ts b/src/web/app/common/views/components/index.ts
index fbf9d22a0..b58ba37ec 100644
--- a/src/web/app/common/views/components/index.ts
+++ b/src/web/app/common/views/components/index.ts
@@ -11,7 +11,7 @@ import reactionIcon from './reaction-icon.vue';
import reactionsViewer from './reactions-viewer.vue';
import time from './time.vue';
import timer from './timer.vue';
-import images from './images.vue';
+import mediaList from './media-list.vue';
import uploader from './uploader.vue';
import specialMessage from './special-message.vue';
import streamIndicator from './stream-indicator.vue';
@@ -36,7 +36,7 @@ Vue.component('mk-reaction-icon', reactionIcon);
Vue.component('mk-reactions-viewer', reactionsViewer);
Vue.component('mk-time', time);
Vue.component('mk-timer', timer);
-Vue.component('mk-images', images);
+Vue.component('mk-media-list', mediaList);
Vue.component('mk-uploader', uploader);
Vue.component('mk-special-message', specialMessage);
Vue.component('mk-stream-indicator', streamIndicator);
diff --git a/src/web/app/common/views/components/images.vue b/src/web/app/common/views/components/media-list.vue
similarity index 82%
rename from src/web/app/common/views/components/images.vue
rename to src/web/app/common/views/components/media-list.vue
index dc802a018..b0e668508 100644
--- a/src/web/app/common/views/components/images.vue
+++ b/src/web/app/common/views/components/media-list.vue
@@ -1,6 +1,6 @@
<template>
-<div class="mk-images">
- <mk-images-image v-for="image in images" ref="image" :image="image" :key="image.id"/>
+<div class="mk-media-list">
+ <mk-media-image v-for="media in mediaList" ref="media" :image="media" :key="media.id"/>
</div>
</template>
@@ -8,16 +8,16 @@
import Vue from 'vue';
export default Vue.extend({
- props: ['images'],
+ props: ['mediaList'],
mounted() {
- const tags = this.$refs.image as Vue[];
+ const tags = this.$refs.media as Vue[];
- if (this.images.length == 1) {
+ if (this.mediaList.length == 1) {
(this.$el.style as any).gridTemplateRows = '1fr';
(tags[0].$el.style as any).gridColumn = '1 / 2';
(tags[0].$el.style as any).gridRow = '1 / 2';
- } else if (this.images.length == 2) {
+ } else if (this.mediaList.length == 2) {
(this.$el.style as any).gridTemplateColumns = '1fr 1fr';
(this.$el.style as any).gridTemplateRows = '1fr';
@@ -25,7 +25,7 @@ export default Vue.extend({
(tags[0].$el.style as any).gridRow = '1 / 2';
(tags[1].$el.style as any).gridColumn = '2 / 3';
(tags[1].$el.style as any).gridRow = '1 / 2';
- } else if (this.images.length == 3) {
+ } else if (this.mediaList.length == 3) {
(this.$el.style as any).gridTemplateColumns = '1fr 0.5fr';
(this.$el.style as any).gridTemplateRows = '1fr 1fr';
@@ -35,7 +35,7 @@ export default Vue.extend({
(tags[1].$el.style as any).gridRow = '1 / 2';
(tags[2].$el.style as any).gridColumn = '2 / 3';
(tags[2].$el.style as any).gridRow = '2 / 3';
- } else if (this.images.length == 4) {
+ } else if (this.mediaList.length == 4) {
(this.$el.style as any).gridTemplateColumns = '1fr 1fr';
(this.$el.style as any).gridTemplateRows = '1fr 1fr';
@@ -53,7 +53,7 @@ export default Vue.extend({
</script>
<style lang="stylus" scoped>
-.mk-images
+.mk-media-list
display grid
grid-gap 4px
height 256px
diff --git a/src/web/app/desktop/views/components/index.ts b/src/web/app/desktop/views/components/index.ts
index 52b9680ba..9bca603a5 100644
--- a/src/web/app/desktop/views/components/index.ts
+++ b/src/web/app/desktop/views/components/index.ts
@@ -11,8 +11,8 @@ import postFormWindow from './post-form-window.vue';
import repostFormWindow from './repost-form-window.vue';
import analogClock from './analog-clock.vue';
import ellipsisIcon from './ellipsis-icon.vue';
-import imagesImage from './images-image.vue';
-import imagesImageDialog from './images-image-dialog.vue';
+import mediaImage from './media-image.vue';
+import mediaImageDialog from './media-image-dialog.vue';
import notifications from './notifications.vue';
import postForm from './post-form.vue';
import repostForm from './repost-form.vue';
@@ -40,8 +40,8 @@ Vue.component('mk-post-form-window', postFormWindow);
Vue.component('mk-repost-form-window', repostFormWindow);
Vue.component('mk-analog-clock', analogClock);
Vue.component('mk-ellipsis-icon', ellipsisIcon);
-Vue.component('mk-images-image', imagesImage);
-Vue.component('mk-images-image-dialog', imagesImageDialog);
+Vue.component('mk-media-image', mediaImage);
+Vue.component('mk-media-image-dialog', mediaImageDialog);
Vue.component('mk-notifications', notifications);
Vue.component('mk-post-form', postForm);
Vue.component('mk-repost-form', repostForm);
diff --git a/src/web/app/desktop/views/components/images-image-dialog.vue b/src/web/app/desktop/views/components/media-image-dialog.vue
similarity index 94%
rename from src/web/app/desktop/views/components/images-image-dialog.vue
rename to src/web/app/desktop/views/components/media-image-dialog.vue
index 60afa7af8..dec140d1c 100644
--- a/src/web/app/desktop/views/components/images-image-dialog.vue
+++ b/src/web/app/desktop/views/components/media-image-dialog.vue
@@ -1,5 +1,5 @@
<template>
-<div class="mk-images-image-dialog">
+<div class="mk-media-image-dialog">
<div class="bg" @click="close"></div>
<img :src="image.url" :alt="image.name" :title="image.name" @click="close"/>
</div>
@@ -34,7 +34,7 @@ export default Vue.extend({
</script>
<style lang="stylus" scoped>
-.mk-images-image-dialog
+.mk-media-image-dialog
display block
position fixed
z-index 2048
diff --git a/src/web/app/desktop/views/components/images-image.vue b/src/web/app/desktop/views/components/media-image.vue
similarity index 89%
rename from src/web/app/desktop/views/components/images-image.vue
rename to src/web/app/desktop/views/components/media-image.vue
index 5b7dc4173..bc02d0f9b 100644
--- a/src/web/app/desktop/views/components/images-image.vue
+++ b/src/web/app/desktop/views/components/media-image.vue
@@ -1,5 +1,5 @@
<template>
-<a class="mk-images-image"
+<a class="mk-media-image"
:href="image.url"
@mousemove="onMousemove"
@mouseleave="onMouseleave"
@@ -11,7 +11,7 @@
<script lang="ts">
import Vue from 'vue';
-import MkImagesImageDialog from './images-image-dialog.vue';
+import MkMediaImageDialog from './media-image-dialog.vue';
export default Vue.extend({
props: ['image'],
@@ -39,7 +39,7 @@ export default Vue.extend({
},
onClick() {
- (this as any).os.new(MkImagesImageDialog, {
+ (this as any).os.new(MkMediaImageDialog, {
image: this.image
});
}
@@ -48,7 +48,7 @@ export default Vue.extend({
</script>
<style lang="stylus" scoped>
-.mk-images-image
+.mk-media-image
display block
cursor zoom-in
overflow hidden
diff --git a/src/web/app/desktop/views/components/post-detail.sub.vue b/src/web/app/desktop/views/components/post-detail.sub.vue
index bf6e3ac3b..322e1a173 100644
--- a/src/web/app/desktop/views/components/post-detail.sub.vue
+++ b/src/web/app/desktop/views/components/post-detail.sub.vue
@@ -18,7 +18,7 @@
<div class="body">
<mk-post-html v-if="post.ast" :ast="post.ast" :i="os.i" :class="$style.text"/>
<div class="media" v-if="post.media">
- <mk-images :images="post.media"/>
+ <mk-media-list :mediaList="post.media"/>
</div>
</div>
</div>
diff --git a/src/web/app/desktop/views/components/post-detail.vue b/src/web/app/desktop/views/components/post-detail.vue
index 98777e224..59cd01fbf 100644
--- a/src/web/app/desktop/views/components/post-detail.vue
+++ b/src/web/app/desktop/views/components/post-detail.vue
@@ -40,7 +40,7 @@
<div class="body">
<mk-post-html :class="$style.text" v-if="p.ast" :ast="p.ast" :i="os.i"/>
<div class="media" v-if="p.media">
- <mk-images :images="p.media"/>
+ <mk-media-list :mediaList="p.media"/>
</div>
<mk-poll v-if="p.poll" :post="p"/>
<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
diff --git a/src/web/app/desktop/views/components/posts.post.vue b/src/web/app/desktop/views/components/posts.post.vue
index 073b89957..cde9b6f85 100644
--- a/src/web/app/desktop/views/components/posts.post.vue
+++ b/src/web/app/desktop/views/components/posts.post.vue
@@ -42,7 +42,7 @@
<a class="rp" v-if="p.repost">RP:</a>
</div>
<div class="media" v-if="p.media">
- <mk-images :images="p.media"/>
+ <mk-media-list :mediaList="p.media"/>
</div>
<mk-poll v-if="p.poll" :post="p" ref="pollViewer"/>
<div class="tags" v-if="p.tags && p.tags.length > 0">
diff --git a/src/web/app/desktop/views/components/sub-post-content.vue b/src/web/app/desktop/views/components/sub-post-content.vue
index 7f4c3b4f6..662853f65 100644
--- a/src/web/app/desktop/views/components/sub-post-content.vue
+++ b/src/web/app/desktop/views/components/sub-post-content.vue
@@ -8,7 +8,7 @@
</div>
<details v-if="post.media">
<summary>({{ post.media.length }}つのメディア)</summary>
- <mk-images :images="post.media"/>
+ <mk-media-list :mediaList="post.media"/>
</details>
<details v-if="post.poll">
<summary>投票</summary>
diff --git a/src/web/app/mobile/views/components/index.ts b/src/web/app/mobile/views/components/index.ts
index 19135d08d..4743f50e0 100644
--- a/src/web/app/mobile/views/components/index.ts
+++ b/src/web/app/mobile/views/components/index.ts
@@ -4,7 +4,7 @@ import ui from './ui.vue';
import timeline from './timeline.vue';
import post from './post.vue';
import posts from './posts.vue';
-import imagesImage from './images-image.vue';
+import mediaImage from './media-image.vue';
import drive from './drive.vue';
import postPreview from './post-preview.vue';
import subPostContent from './sub-post-content.vue';
@@ -26,7 +26,7 @@ Vue.component('mk-ui', ui);
Vue.component('mk-timeline', timeline);
Vue.component('mk-post', post);
Vue.component('mk-posts', posts);
-Vue.component('mk-images-image', imagesImage);
+Vue.component('mk-media-image', mediaImage);
Vue.component('mk-drive', drive);
Vue.component('mk-post-preview', postPreview);
Vue.component('mk-sub-post-content', subPostContent);
diff --git a/src/web/app/mobile/views/components/images-image.vue b/src/web/app/mobile/views/components/media-image.vue
similarity index 82%
rename from src/web/app/mobile/views/components/images-image.vue
rename to src/web/app/mobile/views/components/media-image.vue
index 6bc1dc0ae..faf8bad48 100644
--- a/src/web/app/mobile/views/components/images-image.vue
+++ b/src/web/app/mobile/views/components/media-image.vue
@@ -1,5 +1,5 @@
<template>
-<a class="mk-images-image" :href="image.url" target="_blank" :style="style" :title="image.name"></a>
+<a class="mk-media-image" :href="image.url" target="_blank" :style="style" :title="image.name"></a>
</template>
<script lang="ts">
@@ -19,7 +19,7 @@ export default Vue.extend({
</script>
<style lang="stylus" scoped>
-.mk-images-image
+.mk-media-image
display block
overflow hidden
width 100%
diff --git a/src/web/app/mobile/views/components/post-detail.vue b/src/web/app/mobile/views/components/post-detail.vue
index 4b0b59eff..db7509d0f 100644
--- a/src/web/app/mobile/views/components/post-detail.vue
+++ b/src/web/app/mobile/views/components/post-detail.vue
@@ -43,7 +43,7 @@
<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
</div>
<div class="media" v-if="p.media">
- <mk-images :images="p.media"/>
+ <mk-media-list :mediaList="p.media"/>
</div>
<mk-poll v-if="p.poll" :post="p"/>
<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
diff --git a/src/web/app/mobile/views/components/post.vue b/src/web/app/mobile/views/components/post.vue
index 8df4dbf22..cf4c38337 100644
--- a/src/web/app/mobile/views/components/post.vue
+++ b/src/web/app/mobile/views/components/post.vue
@@ -41,7 +41,7 @@
<a class="rp" v-if="p.repost != null">RP:</a>
</div>
<div class="media" v-if="p.media">
- <mk-images :images="p.media"/>
+ <mk-media-list :mediaList="p.media"/>
</div>
<mk-poll v-if="p.poll" :post="p" ref="pollViewer"/>
<div class="tags" v-if="p.tags && p.tags.length > 0">
diff --git a/src/web/app/mobile/views/components/sub-post-content.vue b/src/web/app/mobile/views/components/sub-post-content.vue
index b97f08255..7a9fcb633 100644
--- a/src/web/app/mobile/views/components/sub-post-content.vue
+++ b/src/web/app/mobile/views/components/sub-post-content.vue
@@ -7,7 +7,7 @@
</div>
<details v-if="post.media">
<summary>({{ post.media.length }}個のメディア)</summary>
- <mk-images :images="post.media"/>
+ <mk-media-list :mediaList="post.media"/>
</details>
<details v-if="post.poll">
<summary>%i18n:mobile.tags.mk-sub-post-content.poll%</summary>
From 4d25db59a9593dbd234423b99fdd792e8d7b6cc7 Mon Sep 17 00:00:00 2001
From: rinsuki <428rinsuki+git@gmail.com>
Date: Mon, 26 Mar 2018 17:03:20 +0900
Subject: [PATCH 2/4] :mediaList -> :media-list
---
src/web/app/desktop/views/components/post-detail.sub.vue | 2 +-
src/web/app/desktop/views/components/post-detail.vue | 2 +-
src/web/app/desktop/views/components/posts.post.vue | 2 +-
src/web/app/desktop/views/components/sub-post-content.vue | 2 +-
src/web/app/mobile/views/components/post-detail.vue | 2 +-
src/web/app/mobile/views/components/post.vue | 2 +-
src/web/app/mobile/views/components/sub-post-content.vue | 2 +-
7 files changed, 7 insertions(+), 7 deletions(-)
diff --git a/src/web/app/desktop/views/components/post-detail.sub.vue b/src/web/app/desktop/views/components/post-detail.sub.vue
index 322e1a173..c35a07d7c 100644
--- a/src/web/app/desktop/views/components/post-detail.sub.vue
+++ b/src/web/app/desktop/views/components/post-detail.sub.vue
@@ -18,7 +18,7 @@
<div class="body">
<mk-post-html v-if="post.ast" :ast="post.ast" :i="os.i" :class="$style.text"/>
<div class="media" v-if="post.media">
- <mk-media-list :mediaList="post.media"/>
+ <mk-media-list :media-list="post.media"/>
</div>
</div>
</div>
diff --git a/src/web/app/desktop/views/components/post-detail.vue b/src/web/app/desktop/views/components/post-detail.vue
index 59cd01fbf..5845ab4f8 100644
--- a/src/web/app/desktop/views/components/post-detail.vue
+++ b/src/web/app/desktop/views/components/post-detail.vue
@@ -40,7 +40,7 @@
<div class="body">
<mk-post-html :class="$style.text" v-if="p.ast" :ast="p.ast" :i="os.i"/>
<div class="media" v-if="p.media">
- <mk-media-list :mediaList="p.media"/>
+ <mk-media-list :media-list="p.media"/>
</div>
<mk-poll v-if="p.poll" :post="p"/>
<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
diff --git a/src/web/app/desktop/views/components/posts.post.vue b/src/web/app/desktop/views/components/posts.post.vue
index cde9b6f85..71cbbc68d 100644
--- a/src/web/app/desktop/views/components/posts.post.vue
+++ b/src/web/app/desktop/views/components/posts.post.vue
@@ -42,7 +42,7 @@
<a class="rp" v-if="p.repost">RP:</a>
</div>
<div class="media" v-if="p.media">
- <mk-media-list :mediaList="p.media"/>
+ <mk-media-list :media-list="p.media"/>
</div>
<mk-poll v-if="p.poll" :post="p" ref="pollViewer"/>
<div class="tags" v-if="p.tags && p.tags.length > 0">
diff --git a/src/web/app/desktop/views/components/sub-post-content.vue b/src/web/app/desktop/views/components/sub-post-content.vue
index 662853f65..8c8f42c80 100644
--- a/src/web/app/desktop/views/components/sub-post-content.vue
+++ b/src/web/app/desktop/views/components/sub-post-content.vue
@@ -8,7 +8,7 @@
</div>
<details v-if="post.media">
<summary>({{ post.media.length }}つのメディア)</summary>
- <mk-media-list :mediaList="post.media"/>
+ <mk-media-list :media-list="post.media"/>
</details>
<details v-if="post.poll">
<summary>投票</summary>
diff --git a/src/web/app/mobile/views/components/post-detail.vue b/src/web/app/mobile/views/components/post-detail.vue
index db7509d0f..9baa5de6d 100644
--- a/src/web/app/mobile/views/components/post-detail.vue
+++ b/src/web/app/mobile/views/components/post-detail.vue
@@ -43,7 +43,7 @@
<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
</div>
<div class="media" v-if="p.media">
- <mk-media-list :mediaList="p.media"/>
+ <mk-media-list :media-list="p.media"/>
</div>
<mk-poll v-if="p.poll" :post="p"/>
<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
diff --git a/src/web/app/mobile/views/components/post.vue b/src/web/app/mobile/views/components/post.vue
index cf4c38337..d53649b11 100644
--- a/src/web/app/mobile/views/components/post.vue
+++ b/src/web/app/mobile/views/components/post.vue
@@ -41,7 +41,7 @@
<a class="rp" v-if="p.repost != null">RP:</a>
</div>
<div class="media" v-if="p.media">
- <mk-media-list :mediaList="p.media"/>
+ <mk-media-list :media-list="p.media"/>
</div>
<mk-poll v-if="p.poll" :post="p" ref="pollViewer"/>
<div class="tags" v-if="p.tags && p.tags.length > 0">
diff --git a/src/web/app/mobile/views/components/sub-post-content.vue b/src/web/app/mobile/views/components/sub-post-content.vue
index 7a9fcb633..389fc420e 100644
--- a/src/web/app/mobile/views/components/sub-post-content.vue
+++ b/src/web/app/mobile/views/components/sub-post-content.vue
@@ -7,7 +7,7 @@
</div>
<details v-if="post.media">
<summary>({{ post.media.length }}個のメディア)</summary>
- <mk-media-list :mediaList="post.media"/>
+ <mk-media-list :media-list="post.media"/>
</details>
<details v-if="post.poll">
<summary>%i18n:mobile.tags.mk-sub-post-content.poll%</summary>
From 1696c50c8690382160c0986533a37d27d140791b Mon Sep 17 00:00:00 2001
From: rinsuki <428rinsuki+git@gmail.com>
Date: Mon, 26 Mar 2018 17:26:21 +0900
Subject: [PATCH 3/4] =?UTF-8?q?media-list=E3=81=AEgrid=E3=81=AE=E5=87=A6?=
=?UTF-8?q?=E7=90=86=E3=82=92JS=E3=81=8B=E3=82=89CSS=E3=81=AB=E7=A7=BB?=
=?UTF-8?q?=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../common/views/components/media-list.vue | 77 +++++++++----------
1 file changed, 35 insertions(+), 42 deletions(-)
diff --git a/src/web/app/common/views/components/media-list.vue b/src/web/app/common/views/components/media-list.vue
index b0e668508..d0da584a4 100644
--- a/src/web/app/common/views/components/media-list.vue
+++ b/src/web/app/common/views/components/media-list.vue
@@ -1,6 +1,8 @@
<template>
-<div class="mk-media-list">
- <mk-media-image v-for="media in mediaList" ref="media" :image="media" :key="media.id"/>
+<div class="mk-media-list" :data-count="mediaList.length">
+ <template v-for="media in mediaList">
+ <mk-media-image :image="media" :key="media.id"/>
+ </template>
</div>
</template>
@@ -9,46 +11,6 @@ import Vue from 'vue';
export default Vue.extend({
props: ['mediaList'],
- mounted() {
- const tags = this.$refs.media as Vue[];
-
- if (this.mediaList.length == 1) {
- (this.$el.style as any).gridTemplateRows = '1fr';
-
- (tags[0].$el.style as any).gridColumn = '1 / 2';
- (tags[0].$el.style as any).gridRow = '1 / 2';
- } else if (this.mediaList.length == 2) {
- (this.$el.style as any).gridTemplateColumns = '1fr 1fr';
- (this.$el.style as any).gridTemplateRows = '1fr';
-
- (tags[0].$el.style as any).gridColumn = '1 / 2';
- (tags[0].$el.style as any).gridRow = '1 / 2';
- (tags[1].$el.style as any).gridColumn = '2 / 3';
- (tags[1].$el.style as any).gridRow = '1 / 2';
- } else if (this.mediaList.length == 3) {
- (this.$el.style as any).gridTemplateColumns = '1fr 0.5fr';
- (this.$el.style as any).gridTemplateRows = '1fr 1fr';
-
- (tags[0].$el.style as any).gridColumn = '1 / 2';
- (tags[0].$el.style as any).gridRow = '1 / 3';
- (tags[1].$el.style as any).gridColumn = '2 / 3';
- (tags[1].$el.style as any).gridRow = '1 / 2';
- (tags[2].$el.style as any).gridColumn = '2 / 3';
- (tags[2].$el.style as any).gridRow = '2 / 3';
- } else if (this.mediaList.length == 4) {
- (this.$el.style as any).gridTemplateColumns = '1fr 1fr';
- (this.$el.style as any).gridTemplateRows = '1fr 1fr';
-
- (tags[0].$el.style as any).gridColumn = '1 / 2';
- (tags[0].$el.style as any).gridRow = '1 / 2';
- (tags[1].$el.style as any).gridColumn = '2 / 3';
- (tags[1].$el.style as any).gridRow = '1 / 2';
- (tags[2].$el.style as any).gridColumn = '1 / 2';
- (tags[2].$el.style as any).gridRow = '2 / 3';
- (tags[3].$el.style as any).gridColumn = '2 / 3';
- (tags[3].$el.style as any).gridRow = '2 / 3';
- }
- }
});
</script>
@@ -60,4 +22,35 @@ export default Vue.extend({
@media (max-width 500px)
height 192px
+
+ &[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)
+ grid-row 1 / 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)
+ grid-column 1 / 2
+ grid-row 1 / 2
+ :nth-child(2)
+ grid-column 2 / 3
+ grid-row 1 / 2
+ :nth-child(3)
+ grid-column 1 / 2
+ grid-row 2 / 3
+ :nth-child(4)
+ grid-column 2 / 3
+ grid-row 2 / 3
+
</style>
From 8eab25f22c3ecb65c5869afa26afbbf791f0066d Mon Sep 17 00:00:00 2001
From: rinsuki <428rinsuki+git@gmail.com>
Date: Mon, 26 Mar 2018 17:33:29 +0900
Subject: [PATCH 4/4] add mobile.tags.mk-user-timeline.load-more translation
---
locales/en.yml | 1 +
locales/ja.yml | 1 +
2 files changed, 2 insertions(+)
diff --git a/locales/en.yml b/locales/en.yml
index e55984677..2cc857f69 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -654,6 +654,7 @@ mobile:
mk-user-timeline:
no-posts: "This user seems never post"
no-posts-with-media: "There is no posts with media"
+ load-more: "More"
mk-user:
follows-you: "Follows you"
diff --git a/locales/ja.yml b/locales/ja.yml
index b60e9e3f4..86b594990 100644
--- a/locales/ja.yml
+++ b/locales/ja.yml
@@ -654,6 +654,7 @@ mobile:
mk-user-timeline:
no-posts: "このユーザーはまだ投稿していないようです。"
no-posts-with-media: "メディア付き投稿はありません。"
+ load-more: "もっとみる"
mk-user:
follows-you: "フォローされています"