Merge branch 'develop' into mkjs-n
This commit is contained in:
commit
f7a0213af9
|
@ -1,19 +1,20 @@
|
||||||
<template>
|
<template>
|
||||||
<MkStickyContainer>
|
<MkStickyContainer>
|
||||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||||
<div ref="rootEl" v-hotkey.global="keymap" class="tqmomfks">
|
<MkSpacer :contentMax="800">
|
||||||
<div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ i18n.ts.newNoteRecived }}</button></div>
|
<div ref="rootEl" v-hotkey.global="keymap">
|
||||||
<div class="tl">
|
<div v-if="queue > 0" :class="$style.new"><button class="_buttonPrimary" :class="$style.newButton" @click="top()">{{ i18n.ts.newNoteRecived }}</button></div>
|
||||||
<MkTimeline
|
<div :class="$style.tl">
|
||||||
ref="tlEl" :key="antennaId"
|
<MkTimeline
|
||||||
class="tl"
|
ref="tlEl" :key="antennaId"
|
||||||
src="antenna"
|
src="antenna"
|
||||||
:antenna="antennaId"
|
:antenna="antennaId"
|
||||||
:sound="true"
|
:sound="true"
|
||||||
@queue="queueUpdated"
|
@queue="queueUpdated"
|
||||||
/>
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</MkSpacer>
|
||||||
</MkStickyContainer>
|
</MkStickyContainer>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -89,36 +90,29 @@ definePageMetadata(computed(() => antenna ? {
|
||||||
} : null));
|
} : null));
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" module>
|
||||||
.tqmomfks {
|
.new {
|
||||||
padding: var(--margin);
|
position: sticky;
|
||||||
|
top: calc(var(--stickyTop, 0px) + 16px);
|
||||||
|
z-index: 1000;
|
||||||
|
width: 100%;
|
||||||
|
margin: calc(-0.675em - 8px) 0;
|
||||||
|
|
||||||
> .new {
|
&:first-child {
|
||||||
position: sticky;
|
margin-top: calc(-0.675em - 8px - var(--margin));
|
||||||
top: calc(var(--stickyTop, 0px) + 16px);
|
|
||||||
z-index: 1000;
|
|
||||||
width: 100%;
|
|
||||||
margin: calc(-0.675em - 8px - var(--margin)) 0 calc(-0.675em - 8px);
|
|
||||||
|
|
||||||
> button {
|
|
||||||
display: block;
|
|
||||||
margin: var(--margin) auto 0 auto;
|
|
||||||
padding: 8px 16px;
|
|
||||||
border-radius: 32px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> .tl {
|
|
||||||
background: var(--bg);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
overflow: clip;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@container (min-width: 800px) {
|
.newButton {
|
||||||
.tqmomfks {
|
display: block;
|
||||||
max-width: 800px;
|
margin: var(--margin) auto 0 auto;
|
||||||
margin: 0 auto;
|
padding: 8px 16px;
|
||||||
}
|
border-radius: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tl {
|
||||||
|
background: var(--bg);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
overflow: clip;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
<XTutorial v-if="$i && defaultStore.reactiveState.timelineTutorial.value != -1" class="_panel" style="margin-bottom: var(--margin);"/>
|
<XTutorial v-if="$i && defaultStore.reactiveState.timelineTutorial.value != -1" class="_panel" style="margin-bottom: var(--margin);"/>
|
||||||
<MkPostForm v-if="defaultStore.reactiveState.showFixedPostForm.value" :class="$style.postForm" class="post-form _panel" fixed style="margin-bottom: var(--margin);"/>
|
<MkPostForm v-if="defaultStore.reactiveState.showFixedPostForm.value" :class="$style.postForm" class="post-form _panel" fixed style="margin-bottom: var(--margin);"/>
|
||||||
|
|
||||||
<div v-if="queue > 0" :class="$style.new"><button class="_buttonPrimary" @click="top()">{{ i18n.ts.newNoteRecived }}</button></div>
|
<div v-if="queue > 0" :class="$style.new"><button class="_buttonPrimary" :class="$style.newButton" @click="top()">{{ i18n.ts.newNoteRecived }}</button></div>
|
||||||
<div :class="$style.tl">
|
<div :class="$style.tl">
|
||||||
<MkTimeline
|
<MkTimeline
|
||||||
ref="tlComponent"
|
ref="tlComponent"
|
||||||
|
@ -187,13 +187,13 @@ definePageMetadata(computed(() => ({
|
||||||
&:first-child {
|
&:first-child {
|
||||||
margin-top: calc(-0.675em - 8px - var(--margin));
|
margin-top: calc(-0.675em - 8px - var(--margin));
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
> button {
|
.newButton {
|
||||||
display: block;
|
display: block;
|
||||||
margin: var(--margin) auto 0 auto;
|
margin: var(--margin) auto 0 auto;
|
||||||
padding: 8px 16px;
|
padding: 8px 16px;
|
||||||
border-radius: 32px;
|
border-radius: 32px;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.postForm {
|
.postForm {
|
||||||
|
|
|
@ -1,19 +1,20 @@
|
||||||
<template>
|
<template>
|
||||||
<MkStickyContainer>
|
<MkStickyContainer>
|
||||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||||
<div ref="rootEl" class="eqqrhokj">
|
<MkSpacer :contentMax="800">
|
||||||
<div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ i18n.ts.newNoteRecived }}</button></div>
|
<div ref="rootEl">
|
||||||
<div class="tl">
|
<div v-if="queue > 0" :class="$style.new"><button class="_buttonPrimary" :class="$style.newButton" @click="top()">{{ i18n.ts.newNoteRecived }}</button></div>
|
||||||
<MkTimeline
|
<div :class="$style.tl">
|
||||||
ref="tlEl" :key="listId"
|
<MkTimeline
|
||||||
class="tl"
|
ref="tlEl" :key="listId"
|
||||||
src="list"
|
src="list"
|
||||||
:list="listId"
|
:list="listId"
|
||||||
:sound="true"
|
:sound="true"
|
||||||
@queue="queueUpdated"
|
@queue="queueUpdated"
|
||||||
/>
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</MkSpacer>
|
||||||
</MkStickyContainer>
|
</MkStickyContainer>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -82,36 +83,29 @@ definePageMetadata(computed(() => list ? {
|
||||||
} : null));
|
} : null));
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" module>
|
||||||
.eqqrhokj {
|
.new {
|
||||||
padding: var(--margin);
|
position: sticky;
|
||||||
|
top: calc(var(--stickyTop, 0px) + 16px);
|
||||||
|
z-index: 1000;
|
||||||
|
width: 100%;
|
||||||
|
margin: calc(-0.675em - 8px) 0;
|
||||||
|
|
||||||
> .new {
|
&:first-child {
|
||||||
position: sticky;
|
margin-top: calc(-0.675em - 8px - var(--margin));
|
||||||
top: calc(var(--stickyTop, 0px) + 16px);
|
|
||||||
z-index: 1000;
|
|
||||||
width: 100%;
|
|
||||||
margin: calc(-0.675em - 8px - var(--margin)) 0 calc(-0.675em - 8px);
|
|
||||||
|
|
||||||
> button {
|
|
||||||
display: block;
|
|
||||||
margin: var(--margin) auto 0 auto;
|
|
||||||
padding: 8px 16px;
|
|
||||||
border-radius: 32px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> .tl {
|
|
||||||
background: var(--bg);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
overflow: clip;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@container (min-width: 800px) {
|
.newButton {
|
||||||
.eqqrhokj {
|
display: block;
|
||||||
max-width: 800px;
|
margin: var(--margin) auto 0 auto;
|
||||||
margin: 0 auto;
|
padding: 8px 16px;
|
||||||
}
|
border-radius: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tl {
|
||||||
|
background: var(--bg);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
overflow: clip;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue