mirror/MisskeyIO
1
0
Fork 0
mirror of https://github.com/MisskeyIO/misskey synced 2024-11-27 14:28:49 +09:00
Code

🎨

Browse Source
This commit is contained in:
syuilo 2021-10-16 18:18:41 +09:00
parent 23753ec75a
commit 4ba4062519
3 changed files with 37 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/client/components/tab.vue
View File

@ -35,8 +35,8 @@ export default defineComponent({
> button {
flex: 1;
padding: 15px 12px 12px 12px;
border-bottom: solid 3px transparent;
padding: 10px 8px;
border-radius: 6px;
&:disabled {
opacity: 1 !important;
@ -45,11 +45,16 @@ export default defineComponent({
&.active {
color: var(--accent);
border-bottom-color: var(--accent);
background: var(--accentedBg);
}
&:not(.active):hover {
color: var(--fgHighlighted);
background: var(--panelHighlight);
}
&:not(:first-child) {
margin-left: 8px;
}
> .icon {
@ -61,7 +66,7 @@ export default defineComponent({
font-size: 80%;
> button {
padding: 11px 8px 8px 8px;
padding: 11px 8px;
}
}
}

48
src/client/pages/pages.vue
View File

@ -2,33 +2,35 @@
<div>
<MkHeader :info="header"/>
<!-- TODO: MkHeaderに統合 -->
<MkTab v-model="tab" v-if="$i">
<option value="featured"><i class="fas fa-fire-alt"></i> {{ $ts._pages.featured }}</option>
<option value="my"><i class="fas fa-edit"></i> {{ $ts._pages.my }}</option>
<option value="liked"><i class="fas fa-heart"></i> {{ $ts._pages.liked }}</option>
</MkTab>
<MkSpacer>
<!-- TODO: MkHeaderに統合 -->
<MkTab v-model="tab" v-if="$i">
<option value="featured"><i class="fas fa-fire-alt"></i> {{ $ts._pages.featured }}</option>
<option value="my"><i class="fas fa-edit"></i> {{ $ts._pages.my }}</option>
<option value="liked"><i class="fas fa-heart"></i> {{ $ts._pages.liked }}</option>
</MkTab>
<div class="_section">
<div class="rknalgpo _content" v-if="tab === 'featured'">
<MkPagination :pagination="featuredPagesPagination" #default="{items}">
<MkPagePreview v-for="page in items" class="ckltabjg" :page="page" :key="page.id"/>
</MkPagination>
</div>
<div class="_section">
<div class="rknalgpo _content" v-if="tab === 'featured'">
<MkPagination :pagination="featuredPagesPagination" #default="{items}">
<MkPagePreview v-for="page in items" class="ckltabjg" :page="page" :key="page.id"/>
</MkPagination>
</div>
<div class="rknalgpo _content my" v-if="tab === 'my'">
<MkButton class="new" @click="create()"><i class="fas fa-plus"></i></MkButton>
<MkPagination :pagination="myPagesPagination" #default="{items}">
<MkPagePreview v-for="page in items" class="ckltabjg" :page="page" :key="page.id"/>
</MkPagination>
</div>
<div class="rknalgpo _content my" v-if="tab === 'my'">
<MkButton class="new" @click="create()"><i class="fas fa-plus"></i></MkButton>
<MkPagination :pagination="myPagesPagination" #default="{items}">
<MkPagePreview v-for="page in items" class="ckltabjg" :page="page" :key="page.id"/>
</MkPagination>
</div>
<div class="rknalgpo _content" v-if="tab === 'liked'">
<MkPagination :pagination="likedPagesPagination" #default="{items}">
<MkPagePreview v-for="like in items" class="ckltabjg" :page="like.page" :key="like.page.id"/>
</MkPagination>
<div class="rknalgpo _content" v-if="tab === 'liked'">
<MkPagination :pagination="likedPagesPagination" #default="{items}">
<MkPagePreview v-for="like in items" class="ckltabjg" :page="like.page" :key="like.page.id"/>
</MkPagination>
</div>
</div>
</div>
</MkSpacer>
</div>
</template>

4
src/client/pages/user/index.timeline.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="yrzkoczt" v-sticky-container>
<MkTab v-model="with_" class="_gap tab">
<MkTab v-model="with_" class="tab">
<option :value="null">{{ $ts.notes }}</option>
<option value="replies">{{ $ts.notesAndReplies }}</option>
<option value="files">{{ $ts.withFiles }}</option>
@ -60,6 +60,8 @@ export default defineComponent({
<style lang="scss" scoped>
.yrzkoczt {
> .tab {
margin: calc(var(--margin) / 2) 0;
padding: calc(var(--margin) / 2) 0;
background: var(--bg);
}
}