From 02624379751fa3ba2a455188d71c722fd03d81c3 Mon Sep 17 00:00:00 2001
From: ThatOneCalculator <kainoa@t1c.dev>
Date: Sat, 8 Apr 2023 20:34:36 -0700
Subject: [PATCH] sticky~
---
packages/client/src/components/MkTab.vue | 1 -
.../client/src/pages/timeline.discover.vue | 64 ++++++++++---------
packages/client/src/pages/timeline.foryou.vue | 64 ++++++++++---------
.../client/src/pages/user/index.timeline.vue | 2 +-
4 files changed, 69 insertions(+), 62 deletions(-)
diff --git a/packages/client/src/components/MkTab.vue b/packages/client/src/components/MkTab.vue
index 444e6d77bc..1f62a48cac 100644
--- a/packages/client/src/components/MkTab.vue
+++ b/packages/client/src/components/MkTab.vue
@@ -51,7 +51,6 @@ export default defineComponent({
display: flex;
font-size: 90%;
border-radius: var(--radius);
- margin-top: -10px;
> button {
flex: 1;
diff --git a/packages/client/src/pages/timeline.discover.vue b/packages/client/src/pages/timeline.discover.vue
index 81f40c1df9..f59560f07c 100644
--- a/packages/client/src/pages/timeline.discover.vue
+++ b/packages/client/src/pages/timeline.discover.vue
@@ -1,35 +1,39 @@
<template>
<MkSpacer :content-max="800">
- <MkTab v-model="tab" style="margin-bottom: var(--margin)">
- <option value="hot">{{ i18n.ts._timelines.hot }}</option>
- <option v-if="isRecommendedTimelineAvailable" value="recommended">
- {{ i18n.ts._timelines.recommended }}
- </option>
- <option v-if="isGlobalTimelineAvailable" value="global">
- {{ i18n.ts._timelines.global }}
- </option>
- </MkTab>
- <XTimeline
- v-if="tab === 'hot'"
- ref="tl"
- class="tl"
- src="featured"
- :sound="true"
- />
- <XTimeline
- v-else-if="tab === 'recommended'"
- ref="tl"
- class="tl"
- src="recommended"
- :sound="true"
- />
- <XTimeline
- v-else-if="tab === 'global'"
- ref="tl"
- class="tl"
- src="global"
- :sound="true"
- />
+ <MkStickyContainer style="margin: 10px; top: 62px">
+ <template #header>
+ <MkTab v-model="tab" style="margin-bottom: var(--margin)">
+ <option value="hot">{{ i18n.ts._timelines.hot }}</option>
+ <option v-if="isRecommendedTimelineAvailable" value="recommended">
+ {{ i18n.ts._timelines.recommended }}
+ </option>
+ <option v-if="isGlobalTimelineAvailable" value="global">
+ {{ i18n.ts._timelines.global }}
+ </option>
+ </MkTab>
+ <XTimeline
+ v-if="tab === 'hot'"
+ ref="tl"
+ class="tl"
+ src="featured"
+ :sound="true"
+ />
+ <XTimeline
+ v-else-if="tab === 'recommended'"
+ ref="tl"
+ class="tl"
+ src="recommended"
+ :sound="true"
+ />
+ <XTimeline
+ v-else-if="tab === 'global'"
+ ref="tl"
+ class="tl"
+ src="global"
+ :sound="true"
+ />
+ </template>
+ </MkStickyContainer>
</MkSpacer>
</template>
diff --git a/packages/client/src/pages/timeline.foryou.vue b/packages/client/src/pages/timeline.foryou.vue
index 3ba52f9789..1b626a0973 100644
--- a/packages/client/src/pages/timeline.foryou.vue
+++ b/packages/client/src/pages/timeline.foryou.vue
@@ -1,35 +1,39 @@
<template>
<MkSpacer :content-max="800">
- <MkTab v-model="tab" style="margin-bottom: var(--margin)">
- <option v-if="isLocalTimelineAvailable" value="social">
- {{ i18n.ts._timelines.social }}
- </option>
- <option value="home">{{ i18n.ts._timelines.home }}</option>
- <option value="local" v-if="isLocalTimelineAvailable">
- {{ i18n.ts._timelines.local }}
- </option>
- </MkTab>
- <XTimeline
- v-if="tab === 'social'"
- ref="tl"
- class="tl"
- src="social"
- :sound="true"
- />
- <XTimeline
- v-else-if="tab === 'home'"
- ref="tl"
- class="tl"
- src="home"
- :sound="true"
- />
- <XTimeline
- v-else-if="tab === 'local'"
- ref="tl"
- class="tl"
- src="local"
- :sound="true"
- />
+ <MkStickyContainer style="margin: 10px; top: 62px">
+ <template #header>
+ <MkTab v-model="tab" style="margin-bottom: var(--margin)">
+ <option v-if="isLocalTimelineAvailable" value="social">
+ {{ i18n.ts._timelines.social }}
+ </option>
+ <option value="home">{{ i18n.ts._timelines.home }}</option>
+ <option value="local" v-if="isLocalTimelineAvailable">
+ {{ i18n.ts._timelines.local }}
+ </option>
+ </MkTab>
+ <XTimeline
+ v-if="tab === 'social'"
+ ref="tl"
+ class="tl"
+ src="social"
+ :sound="true"
+ />
+ <XTimeline
+ v-else-if="tab === 'home'"
+ ref="tl"
+ class="tl"
+ src="home"
+ :sound="true"
+ />
+ <XTimeline
+ v-else-if="tab === 'local'"
+ ref="tl"
+ class="tl"
+ src="local"
+ :sound="true"
+ />
+ </template>
+ </MkStickyContainer>
</MkSpacer>
</template>
diff --git a/packages/client/src/pages/user/index.timeline.vue b/packages/client/src/pages/user/index.timeline.vue
index 1792b6357c..b5fb292015 100644
--- a/packages/client/src/pages/user/index.timeline.vue
+++ b/packages/client/src/pages/user/index.timeline.vue
@@ -1,5 +1,5 @@
<template>
- <MkStickyContainer>
+ <MkStickyContainer style="margin: 10px; top: 62px">
<template #header>
<MkTab v-model="include" :class="$style.tab">
<option :value="null">{{ i18n.ts.notes }}</option>