natty
/
calckey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix channel design

This commit is contained in:
syuilo 2020-10-18 12:16:42 +09:00
parent 7d4c535233
commit ce5f552d0c
1 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/client/pages/channel.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div v-if="channel"> <div v-if="channel" class="_section">
<div class="wpgynlbz _panel _vMargin" :class="{ hide: !showBanner }"> <div class="wpgynlbz _content _panel _vMargin" :class="{ hide: !showBanner }">
<XChannelFollow-button :channel="channel" :full="true" class="subscribe"/> <XChannelFollowButton :channel="channel" :full="true" class="subscribe"/>
<button class="_button toggle" @click="() => showBanner = !showBanner"> <button class="_button toggle" @click="() => showBanner = !showBanner">
<template v-if="showBanner"><Fa :icon="faAngleUp"/></template> <template v-if="showBanner"><Fa :icon="faAngleUp"/></template>
<template v-else><Fa :icon="faAngleDown"/></template> <template v-else><Fa :icon="faAngleDown"/></template>
@ -10,8 +10,8 @@
</div> </div>
<div :style="{ backgroundImage: channel.bannerUrl ? `url(${channel.bannerUrl})` : null }" class="banner"> <div :style="{ backgroundImage: channel.bannerUrl ? `url(${channel.bannerUrl})` : null }" class="banner">
<div class="status"> <div class="status">
<div><Fa :icon="faUsers" fixed-width/><i18n path="_channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></i18n></div> <div><Fa :icon="faUsers" fixed-width/><i18n-t keypath="_channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></i18n-t></div>
<div><Fa :icon="faPencilAlt" fixed-width/><i18n path="_channel.notesCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.notesCount }}</b></template></i18n></div> <div><Fa :icon="faPencilAlt" fixed-width/><i18n-t keypath="_channel.notesCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.notesCount }}</b></template></i18n-t></div>
</div> </div>
<div class="fade"></div> <div class="fade"></div>
</div> </div>
@ -20,9 +20,9 @@
</div> </div>
</div> </div>
<XPostForm :channel="channel" class="post-form _panel _vMargin" fixed/> <XPostForm :channel="channel" class="post-form _content _panel _vMargin" fixed/>
<XTimeline class="_vMargin" src="channel" :channel="channelId" @before="before" @after="after"/> <XTimeline class="_content _vMargin" src="channel" :channel="channelId" @before="before" @after="after"/>
</div> </div>
</template> </template>
@ -91,6 +91,8 @@ export default defineComponent({
<style lang="scss" scoped> <style lang="scss" scoped>
.wpgynlbz { .wpgynlbz {
position: relative;
> .subscribe { > .subscribe {
position: absolute; position: absolute;
z-index: 1; z-index: 1;