Tweak UI
This commit is contained in:
parent
08e1db45a9
commit
c27c3817a9
2 changed files with 53 additions and 34 deletions
|
@ -1,6 +1,7 @@
|
|||
<template>
|
||||
<div class="fcuexfpr _root">
|
||||
<div v-if="note" class="note" v-anim>
|
||||
<transition name="fade" mode="out-in">
|
||||
<div v-if="note" class="note">
|
||||
<div class="_gap" v-if="showNext">
|
||||
<XNotes class="_content" :pagination="next" :no-gap="true"/>
|
||||
</div>
|
||||
|
@ -28,10 +29,9 @@
|
|||
<XNotes class="_content" :pagination="prev" :no-gap="true"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="error">
|
||||
<MkError @retry="fetch()"/>
|
||||
</div>
|
||||
<MkError v-else-if="error" @retry="fetch()"/>
|
||||
<MkLoading v-else/>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -106,6 +106,7 @@ export default defineComponent({
|
|||
},
|
||||
methods: {
|
||||
fetch() {
|
||||
this.note = null;
|
||||
os.api('notes/show', {
|
||||
noteId: this.noteId
|
||||
}).then(note => {
|
||||
|
@ -138,6 +139,15 @@ export default defineComponent({
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 0.125s ease;
|
||||
}
|
||||
.fade-enter-from,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.fcuexfpr {
|
||||
> .note {
|
||||
> .main {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="ftskorzw wide _section" v-if="user && narrow === false">
|
||||
<transition name="fade" mode="out-in">
|
||||
<div class="ftskorzw wide" v-if="user && narrow === false">
|
||||
<MkRemoteCaution v-if="user.host != null" :href="user.url" class="_gap"/>
|
||||
|
||||
<div class="banner-container _gap" :style="style">
|
||||
|
@ -212,10 +212,9 @@
|
|||
<XPages v-else-if="page === 'pages'" :user="user" class="_gap"/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="error">
|
||||
<MkError @retry="fetch()"/>
|
||||
</div>
|
||||
</div>
|
||||
<MkError v-else-if="error" @retry="fetch()"/>
|
||||
<MkLoading v-else/>
|
||||
</transition>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
|
@ -324,6 +323,7 @@ export default defineComponent({
|
|||
|
||||
fetch() {
|
||||
if (this.acct == null) return;
|
||||
this.user = null;
|
||||
Progress.start();
|
||||
os.api('users/show', parseAcct(this.acct)).then(user => {
|
||||
this.user = user;
|
||||
|
@ -369,6 +369,15 @@ export default defineComponent({
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 0.125s ease;
|
||||
}
|
||||
.fade-enter-from,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.ftskorzw.wide {
|
||||
max-width: 1150px;
|
||||
margin: 0 auto;
|
||||
|
|
Loading…
Reference in a new issue