Commit 476bf0af authored by Shpuld Shpludson's avatar Shpuld Shpludson

Fix media timeline attachments being small by adding an option to not render...

Fix media timeline attachments being small by adding an option to not render background tabs in tab switcher
parent fbe7af3d
/* eslint-env browser */
import TabSwitcher from '../tab_switcher/tab_switcher.jsx'
import TabSwitcher from '../tab_switcher/tab_switcher.js'
import StyleSwitcher from '../style_switcher/style_switcher.vue'
import InterfaceLanguageSwitcher from '../interface_language_switcher/interface_language_switcher.vue'
import { filter, trim } from 'lodash'
......
......@@ -7,7 +7,7 @@ import OpacityInput from '../opacity_input/opacity_input.vue'
import ShadowControl from '../shadow_control/shadow_control.vue'
import FontControl from '../font_control/font_control.vue'
import ContrastRatio from '../contrast_ratio/contrast_ratio.vue'
import TabSwitcher from '../tab_switcher/tab_switcher.jsx'
import TabSwitcher from '../tab_switcher/tab_switcher.js'
import Preview from './preview.vue'
import ExportImport from '../export_import/export_import.vue'
......
......@@ -4,6 +4,7 @@ import './tab_switcher.scss'
export default Vue.component('tab-switcher', {
name: 'TabSwitcher',
props: ['renderOnlyFocused'],
data () {
return {
active: this.$slots.default.findIndex(_ => _.tag)
......@@ -44,11 +45,12 @@ export default Vue.component('tab-switcher', {
const contents = this.$slots.default.map((slot, index) => {
if (!slot.tag) return
const active = index === this.active
return (
<div class={active ? 'active' : 'hidden'}>
{slot}
</div>
)
if (this.renderOnlyFocused) {
return active
? <div class="active">{slot}</div>
: <div class="hidden"></div>
}
return <div class={active ? 'active' : 'hidden' }>{slot}</div>
})
return (
......
<template>
<div>
<div v-if="user.id" class="user-profile panel panel-default">
<user-card-content :user="user" :switcher="true" :selected="timeline.viewing"></user-card-content>
<tab-switcher>
<Timeline :label="$t('user_card.statuses')" :embedded="true" :title="$t('user_profile.timeline_title')" :timeline="timeline" :timeline-name="'user'" :user-id="fetchBy"/>
<user-card-content
:user="user"
:switcher="true"
:selected="timeline.viewing"
/>
<tab-switcher :renderOnlyFocused="true">
<Timeline
:label="$t('user_card.statuses')"
:embedded="true"
:title="$t('user_profile.timeline_title')"
:timeline="timeline"
:timeline-name="'user'"
:user-id="fetchBy"
/>
<div :label="$t('user_card.followees')">
<div v-if="friends">
<user-card v-for="friend in friends" :key="friend.id" :user="friend" :showFollows="true"></user-card>
<user-card
v-for="friend in friends"
:key="friend.id"
:user="friend"
:showFollows="true"
/>
</div>
<div class="userlist-placeholder" v-else>
<i class="icon-spin3 animate-spin"></i>
......@@ -14,14 +30,32 @@
</div>
<div :label="$t('user_card.followers')">
<div v-if="followers">
<user-card v-for="follower in followers" :key="follower.id" :user="follower" :showFollows="false"></user-card>
<user-card
v-for="follower in followers"
:key="follower.id"
:user="follower"
:showFollows="false"
/>
</div>
<div class="userlist-placeholder" v-else>
<i class="icon-spin3 animate-spin"></i>
</div>
</div>
<Timeline :label="$t('user_card.media')" :embedded="true" :title="$t('user_card.media')" timeline-name="media" :timeline="media" :user-id="fetchBy" />
<Timeline v-if="isUs" :label="$t('user_card.favorites')" :embedded="true" :title="$t('user_card.favorites')" timeline-name="favorites" :timeline="favorites"/>
<Timeline
:label="$t('user_card.media')"
:embedded="true" :title="$t('user_card.media')"
timeline-name="media"
:timeline="media"
:user-id="fetchBy"
/>
<Timeline
v-if="isUs"
:label="$t('user_card.favorites')"
:embedded="true"
:title="$t('user_card.favorites')"
timeline-name="favorites"
:timeline="favorites"
/>
</tab-switcher>
</div>
<div v-else class="panel user-profile-placeholder">
......
import TabSwitcher from '../tab_switcher/tab_switcher.jsx'
import TabSwitcher from '../tab_switcher/tab_switcher.js'
import StyleSwitcher from '../style_switcher/style_switcher.vue'
import fileSizeFormatService from '../../services/file_size_format/file_size_format.js'
......
......@@ -130,7 +130,7 @@
<div class="setting-item">
<h2>{{$t('settings.follow_import')}}</h2>
<p>{{$t('settings.import_followers_from_a_csv_file')}}</p>
<form v-model="followImportForm">
<form>
<input type="file" ref="followlist" v-on:change="followListChange"></input>
</form>
<i class=" icon-spin4 animate-spin uploading" v-if="followListUploading"></i>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment