mirror of
https://activitypub.software/TransFem-org/Sharkey
synced 2024-11-26 07:55:14 +00:00
🎨
This commit is contained in:
parent
23753ec75a
commit
4ba4062519
3 changed files with 37 additions and 28 deletions
|
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue