Fix style
This commit is contained in:
parent
25d37302a8
commit
9860489f88
3 changed files with 14 additions and 12 deletions
|
@ -8,10 +8,10 @@
|
||||||
<MkError v-if="error" @retry="init()"/>
|
<MkError v-if="error" @retry="init()"/>
|
||||||
|
|
||||||
<div v-show="more && reversed" style="margin-bottom: var(--margin);">
|
<div v-show="more && reversed" style="margin-bottom: var(--margin);">
|
||||||
<button class="_buttonPrimary" @click="fetchMoreFeature" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }">
|
<MkButton class="_buttonPrimary" style="margin: 0 auto;" @click="fetchMoreFeature" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }">
|
||||||
<template v-if="!moreFetching">{{ $ts.loadMore }}</template>
|
<template v-if="!moreFetching">{{ $ts.loadMore }}</template>
|
||||||
<template v-if="moreFetching"><MkLoading inline/></template>
|
<template v-if="moreFetching"><MkLoading inline/></template>
|
||||||
</button>
|
</MkButton>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<XList ref="notes" :items="notes" v-slot="{ item: note }" :direction="reversed ? 'up' : 'down'" :reversed="reversed">
|
<XList ref="notes" :items="notes" v-slot="{ item: note }" :direction="reversed ? 'up' : 'down'" :reversed="reversed">
|
||||||
|
@ -19,10 +19,10 @@
|
||||||
</XList>
|
</XList>
|
||||||
|
|
||||||
<div v-show="more && !reversed" style="margin-top: var(--margin);">
|
<div v-show="more && !reversed" style="margin-top: var(--margin);">
|
||||||
<button class="_buttonPrimary" v-appear="$store.state.enableInfiniteScroll ? fetchMore : null" @click="fetchMore" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }">
|
<MkButton class="_buttonPrimary" style="margin: 0 auto;" v-appear="$store.state.enableInfiniteScroll ? fetchMore : null" @click="fetchMore" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }">
|
||||||
<template v-if="!moreFetching">{{ $ts.loadMore }}</template>
|
<template v-if="!moreFetching">{{ $ts.loadMore }}</template>
|
||||||
<template v-if="moreFetching"><MkLoading inline/></template>
|
<template v-if="moreFetching"><MkLoading inline/></template>
|
||||||
</button>
|
</MkButton>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -32,10 +32,11 @@ import { defineComponent } from 'vue';
|
||||||
import paging from '@/scripts/paging';
|
import paging from '@/scripts/paging';
|
||||||
import XNote from './note.vue';
|
import XNote from './note.vue';
|
||||||
import XList from './date-separated-list.vue';
|
import XList from './date-separated-list.vue';
|
||||||
|
import MkButton from '@/components/ui/button.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
XNote, XList,
|
XNote, XList, MkButton,
|
||||||
},
|
},
|
||||||
|
|
||||||
mixins: [
|
mixins: [
|
||||||
|
|
|
@ -8,10 +8,10 @@
|
||||||
<MkError v-if="error" @retry="init()"/>
|
<MkError v-if="error" @retry="init()"/>
|
||||||
|
|
||||||
<div v-show="more && reversed" style="margin-bottom: var(--margin);">
|
<div v-show="more && reversed" style="margin-bottom: var(--margin);">
|
||||||
<button class="_buttonPrimary" @click="fetchMore" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }">
|
<MkButton class="_buttonPrimary" style="margin: 0 auto;" @click="fetchMore" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }">
|
||||||
<template v-if="!moreFetching">{{ $ts.loadMore }}</template>
|
<template v-if="!moreFetching">{{ $ts.loadMore }}</template>
|
||||||
<template v-if="moreFetching"><MkLoading inline/></template>
|
<template v-if="moreFetching"><MkLoading inline/></template>
|
||||||
</button>
|
</MkButton>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<XList ref="notes" :items="notes" v-slot="{ item: note }" :direction="reversed ? 'up' : 'down'" :reversed="reversed">
|
<XList ref="notes" :items="notes" v-slot="{ item: note }" :direction="reversed ? 'up' : 'down'" :reversed="reversed">
|
||||||
|
@ -19,10 +19,10 @@
|
||||||
</XList>
|
</XList>
|
||||||
|
|
||||||
<div v-show="more && !reversed" style="margin-top: var(--margin);">
|
<div v-show="more && !reversed" style="margin-top: var(--margin);">
|
||||||
<button class="_buttonPrimary" v-appear="$store.state.enableInfiniteScroll ? fetchMore : null" @click="fetchMore" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }">
|
<MkButton class="_buttonPrimary" style="margin: 0 auto;" v-appear="$store.state.enableInfiniteScroll ? fetchMore : null" @click="fetchMore" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }">
|
||||||
<template v-if="!moreFetching">{{ $ts.loadMore }}</template>
|
<template v-if="!moreFetching">{{ $ts.loadMore }}</template>
|
||||||
<template v-if="moreFetching"><MkLoading inline/></template>
|
<template v-if="moreFetching"><MkLoading inline/></template>
|
||||||
</button>
|
</MkButton>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -32,10 +32,11 @@ import { defineComponent } from 'vue';
|
||||||
import paging from '@/scripts/paging';
|
import paging from '@/scripts/paging';
|
||||||
import XNote from './note.vue';
|
import XNote from './note.vue';
|
||||||
import XList from './date-separated-list.vue';
|
import XList from './date-separated-list.vue';
|
||||||
|
import MkButton from '@/components/ui/button.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
XNote, XList,
|
XNote, XList, MkButton,
|
||||||
},
|
},
|
||||||
|
|
||||||
mixins: [
|
mixins: [
|
||||||
|
|
|
@ -221,9 +221,8 @@ export default defineComponent({
|
||||||
queueUpdated(q) {
|
queueUpdated(q) {
|
||||||
if (this.$refs.body.offsetWidth !== 0) {
|
if (this.$refs.body.offsetWidth !== 0) {
|
||||||
const rect = this.$refs.body.getBoundingClientRect();
|
const rect = this.$refs.body.getBoundingClientRect();
|
||||||
const scrollTop = getScrollPosition(this.$refs.body);
|
|
||||||
this.width = this.$refs.body.offsetWidth;
|
this.width = this.$refs.body.offsetWidth;
|
||||||
this.top = rect.top + scrollTop;
|
this.top = rect.top;
|
||||||
this.bottom = this.$refs.body.offsetHeight;
|
this.bottom = this.$refs.body.offsetHeight;
|
||||||
}
|
}
|
||||||
this.queue = q;
|
this.queue = q;
|
||||||
|
@ -264,6 +263,7 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
|
|
||||||
.dbiokgaf.tl {
|
.dbiokgaf.tl {
|
||||||
|
position: relative;
|
||||||
padding: 16px 0;
|
padding: 16px 0;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
|
Loading…
Reference in a new issue