profxadke/misskey
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

More icons before I go to bed, it's 3AM 😴

Browse source
This commit is contained in:
ThatOneCalculator 2022-06-17 03:17:12 -07:00
parent fe2927049c
commit 4056cff614
30 changed files with 52 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

4
packages/client/src/components/drive.vue
View file

@ -24,7 +24,7 @@
<span v-if="folder != null" class="separator"><i class="ph-caret-right"></i></span>
<span v-if="folder != null" class="folder current">{{ folder.name }}</span>
</div>
<button class="menu _button" @click="showMenu"><i class="fas fa-ellipsis-h"></i></button>
<button class="menu _button" @click="showMenu"><i class="ph-dots-three-outline"></i></button>
</nav>
<div ref="main" class="main"
:class="{ uploading: uploadings.length > 0, fetching }"
@ -572,7 +572,7 @@ function getMenu() {
type: 'label'
}, {
text: i18n.ts.upload,
icon: 'fas fa-upload',
icon: 'ph-upload-simple',
action: () => { selectLocalFile(); }
}, {
text: i18n.ts.fromUrl,

2
packages/client/src/components/emoji-picker.section.vue
View file

@ -1,7 +1,7 @@
<template>
<section>
<header class="_acrylic" @click="shown = !shown">
<i class="toggle ph-fw" :class="shown ? 'fas fa-chevron-down' : 'fas fa-chevron-up'"></i> <slot></slot> ({{ emojis.length }})
<i class="toggle ph-fw" :class="shown ? 'ph-caret-down' : 'ph-caret-up'"></i> <slot></slot> ({{ emojis.length }})
</header>
<div v-if="shown">
<button v-for="emoji in emojis"

2
packages/client/src/components/form/select.vue
View file

@ -17,7 +17,7 @@
>
<slot></slot>
</select>
<div ref="suffixEl" class="suffix"><i class="fas fa-chevron-down"></i></div>
<div ref="suffixEl" class="suffix"><i class="ph-caret-down"></i></div>
</div>
<div class="caption"><slot name="caption"></slot></div>

4
packages/client/src/components/global/header.vue
View file

@ -13,7 +13,7 @@
</div>
<div v-if="narrow && hasTabs" class="subtitle activeTab">
{{ info.tabs.find(tab => tab.active)?.title }}
<i class="chevron fas fa-chevron-down"></i>
<i class="chevron ph-caret-down"></i>
</div>
</div>
</div>
@ -31,7 +31,7 @@
<button v-else v-tooltip="action.text" class="_button button" :class="{ highlighted: action.highlighted }" @click.stop="action.handler" @touchstart="preventDrag"><i :class="action.icon"></i></button>
</template>
</template>
<button v-if="shouldShowMenu" v-tooltip="$ts.menu" class="_button button" @click.stop="showMenu" @touchstart="preventDrag"><i class="fas fa-ellipsis-h"></i></button>
<button v-if="shouldShowMenu" v-tooltip="$ts.menu" class="_button button" @click.stop="showMenu" @touchstart="preventDrag"><i class="ph-dots-three-outline"></i></button>
</div>
</div>
</template>

4
packages/client/src/components/launch-pad.vue
View file

@ -6,12 +6,12 @@
<button v-if="item.action" v-click-anime class="_button" @click="$event => { item.action($event); close(); }">
<i class="icon" :class="item.icon"></i>
<div class="text">{{ item.text }}</div>
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="item.indicate" class="indicator"><i class="ph-circle"></i></span>
</button>
<MkA v-else v-click-anime :to="item.to" @click.passive="close()">
<i class="icon" :class="item.icon"></i>
<div class="text">{{ item.text }}</div>
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="item.indicate" class="indicator"><i class="ph-circle"></i></span>
</MkA>
</template>
</div>

4
packages/client/src/components/note-detailed.vue
View file

@ -23,7 +23,7 @@
</I18n>
<div class="info">
<button ref="renoteTime" class="_button time" @click="showRenoteMenu()">
<i v-if="isMyRenote" class="fas fa-ellipsis-h dropdownIcon"></i>
<i v-if="isMyRenote" class="ph-dots-three-outline dropdownIcon"></i>
<MkTime :time="note.createdAt"/>
</button>
<span v-if="note.visibility !== 'public'" class="visibility">
@ -103,7 +103,7 @@
<i class="fas fa-minus"></i>
</button>
<button ref="menuButton" class="button _button" @click="menu()">
<i class="fas fa-ellipsis-h"></i>
<i class="ph-dots-three-outline"></i>
</button>
</footer>
</div>

4
packages/client/src/components/note.vue
View file

@ -25,7 +25,7 @@
</I18n>
<div class="info">
<button ref="renoteTime" class="_button time" @click="showRenoteMenu()">
<i v-if="isMyRenote" class="fas fa-ellipsis-h dropdownIcon"></i>
<i v-if="isMyRenote" class="ph-dots-three-outline dropdownIcon"></i>
<MkTime :time="note.createdAt"/>
</button>
<span v-if="note.visibility !== 'public'" class="visibility">
@ -87,7 +87,7 @@
<i class="fas fa-minus"></i>
</button>
<button ref="menuButton" class="button _button" @click="menu()">
<i class="fas fa-ellipsis-h"></i>
<i class="ph-dots-three-outline"></i>
</button>
</footer>
</div>

2
packages/client/src/components/page-window.vue
View file

@ -19,7 +19,7 @@
<template #headerRight>
<button v-tooltip="$ts.showInPage" class="_button" @click="expand()"><i class="fas fa-expand-alt"></i></button>
<button v-tooltip="$ts.popout" class="_button" @click="popout()"><i class="fas fa-external-link-alt"></i></button>
<button class="_button" @click="menu"><i class="fas fa-ellipsis-h"></i></button>
<button class="_button" @click="menu"><i class="ph-dots-three-outline"></i></button>
</template>
<div class="yrolvcoq" :style="{ background: pageInfo?.bg }">

8
packages/client/src/components/ui/menu.vue
View file

@ -18,16 +18,16 @@
<i v-if="item.icon" class="ph-fw" :class="item.icon"></i>
<MkAvatar v-if="item.avatar" :user="item.avatar" class="avatar"/>
<span>{{ item.text }}</span>
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="item.indicate" class="indicator"><i class="ph-circle"></i></span>
</MkA>
<a v-else-if="item.type === 'a'" :href="item.href" :target="item.target" :download="item.download" :tabindex="i" class="_button item" @click="close()">
<i v-if="item.icon" class="ph-fw" :class="item.icon"></i>
<span>{{ item.text }}</span>
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="item.indicate" class="indicator"><i class="ph-circle"></i></span>
</a>
<button v-else-if="item.type === 'user'" :tabindex="i" class="_button item" :class="{ active: item.active }" :disabled="item.active" @click="clicked(item.action, $event)">
<MkAvatar :user="item.user" class="avatar"/><MkUserName :user="item.user"/>
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="item.indicate" class="indicator"><i class="ph-circle"></i></span>
</button>
<span v-else-if="item.type === 'switch'" :tabindex="i" class="item">
<FormSwitch v-model="item.ref" :disabled="item.disabled" class="form-switch">{{ item.text }}</FormSwitch>
@ -36,7 +36,7 @@
<i v-if="item.icon" class="ph-fw" :class="item.icon"></i>
<MkAvatar v-if="item.avatar" :user="item.avatar" class="avatar"/>
<span>{{ item.text }}</span>
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="item.indicate" class="indicator"><i class="ph-circle"></i></span>
</button>
</template>
<span v-if="items2.length === 0" class="none item">

4
packages/client/src/pages/admin/emojis.vue
View file

@ -183,7 +183,7 @@ const menu = (ev: MouseEvent) => {
});
}
}, {
icon: 'fas fa-upload',
icon: 'ph-upload-simple',
text: i18n.ts.import,
action: async () => {
const file = await selectFile(ev.currentTarget ?? ev.target);
@ -276,7 +276,7 @@ defineExpose({
text: i18n.ts.addEmoji,
handler: add,
}, {
icon: 'fas fa-ellipsis-h',
icon: 'ph-dots-three-outline',
handler: menu,
}],
tabs: [{

2
packages/client/src/pages/clip.vue
View file

@ -44,7 +44,7 @@ export default defineComponent({
icon: 'ph-paperclip',
bg: 'var(--bg)',
actions: [{
icon: 'fas fa-ellipsis-h',
icon: 'ph-dots-three-outline',
handler: this.menu
}],
} : null),

2
packages/client/src/pages/emojis.vue
View file

@ -41,7 +41,7 @@ defineExpose({
icon: 'ph-smiley',
bg: 'var(--bg)',
actions: [{
icon: 'fas fa-ellipsis-h',
icon: 'ph-dots-three-outline',
handler: menu,
}],
},

4
packages/client/src/pages/messaging/messaging-room.vue
View file

@ -74,14 +74,14 @@ const Component = defineComponent({
userName: this.user,
avatar: this.user,
action: {
icon: 'fas fa-ellipsis-h',
icon: 'ph-dots-three-outline',
handler: this.menu,
},
} : {
title: this.group.name,
icon: 'ph-users-three',
action: {
icon: 'fas fa-ellipsis-h',
icon: 'ph-dots-three-outline',
handler: this.menu,
},
} : null),

4
packages/client/src/pages/note.vue
View file

@ -8,7 +8,7 @@
</div>
<div class="main _gap">
<MkButton v-if="!showNext && hasNext" class="load next" @click="showNext = true"><i class="fas fa-chevron-up"></i></MkButton>
<MkButton v-if="!showNext && hasNext" class="load next" @click="showNext = true"><i class="ph-caret-up"></i></MkButton>
<div class="note _gap">
<MkRemoteCaution v-if="note.user.host != null" :href="note.url ?? note.uri" class="_isolated"/>
<XNoteDetailed :key="note.id" v-model:note="note" class="_isolated note"/>
@ -23,7 +23,7 @@
</div>
</MkA>
</div>
<MkButton v-if="!showPrev && hasPrev" class="load prev" @click="showPrev = true"><i class="fas fa-chevron-down"></i></MkButton>
<MkButton v-if="!showPrev && hasPrev" class="load prev" @click="showPrev = true"><i class="ph-caret-down"></i></MkButton>
</div>
<div v-if="showPrev" class="_gap">

8
packages/client/src/pages/settings/import-export.vue
View file

@ -16,23 +16,23 @@
<MkButton :class="$style.button" inline @click="exportFollowing()"><i class="ph-download-simple"></i> {{ $ts.export }}</MkButton>
</FormGroup>
<FormGroup>
<MkButton :class="$style.button" inline @click="importFollowing($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton>
<MkButton :class="$style.button" inline @click="importFollowing($event)"><i class="ph-upload-simple"></i> {{ $ts.import }}</MkButton>
</FormGroup>
</FormSection>
<FormSection>
<template #label>{{ $ts._exportOrImport.userLists }}</template>
<MkButton :class="$style.button" inline @click="exportUserLists()"><i class="ph-download-simple"></i> {{ $ts.export }}</MkButton>
<MkButton :class="$style.button" inline @click="importUserLists($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton>
<MkButton :class="$style.button" inline @click="importUserLists($event)"><i class="ph-upload-simple"></i> {{ $ts.import }}</MkButton>
</FormSection>
<FormSection>
<template #label>{{ $ts._exportOrImport.muteList }}</template>
<MkButton :class="$style.button" inline @click="exportMuting()"><i class="ph-download-simple"></i> {{ $ts.export }}</MkButton>
<MkButton :class="$style.button" inline @click="importMuting($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton>
<MkButton :class="$style.button" inline @click="importMuting($event)"><i class="ph-upload-simple"></i> {{ $ts.import }}</MkButton>
</FormSection>
<FormSection>
<template #label>{{ $ts._exportOrImport.blockingList }}</template>
<MkButton :class="$style.button" inline @click="exportBlocking()"><i class="ph-download-simple"></i> {{ $ts.export }}</MkButton>
<MkButton :class="$style.button" inline @click="importBlocking($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton>
<MkButton :class="$style.button" inline @click="importBlocking($event)"><i class="ph-upload-simple"></i> {{ $ts.import }}</MkButton>
</FormSection>
</div>
</template>

2
packages/client/src/pages/settings/index.vue
View file

@ -166,7 +166,7 @@ const menuDef = computed(() => [{
to: '/settings/webhook',
active: props.initialPage === 'webhook',
}, {
icon: 'fas fa-ellipsis-h',
icon: 'ph-dots-three-outline',
text: i18n.ts.other,
to: '/settings/other',
active: props.initialPage === 'other',

2
packages/client/src/pages/settings/other.vue
View file

@ -37,7 +37,7 @@ function onChangeInjectFeaturedNote(v) {
defineExpose({
[symbols.PAGE_INFO]: {
title: i18n.ts.other,
icon: 'fas fa-ellipsis-h',
icon: 'ph-dots-three-outline',
bg: 'var(--bg)',
}
});

2
packages/client/src/pages/settings/sounds.vue
View file

@ -9,7 +9,7 @@
<FormLink v-for="type in Object.keys(sounds)" :key="type" style="margin-bottom: 8px;" @click="edit(type)">
{{ $t('_sfx.' + type) }}
<template #suffix>{{ sounds[type].type || i18n.ts.none }}</template>
<template #suffixIcon><i class="fas fa-chevron-down"></i></template>
<template #suffixIcon><i class="ph-caret-down"></i></template>
</FormLink>
</FormSection>

2
packages/client/src/pages/settings/webhook.vue
View file

@ -11,7 +11,7 @@
<template v-slot="{items}">
<FormLink v-for="webhook in items" :key="webhook.id" :to="`/settings/webhook/edit?id=${webhook.id}`" class="_formBlock">
<template #icon>
<i v-if="webhook.active === false" class="fas fa-circle-pause"></i>
<i v-if="webhook.active === false" class="ph-circle-pause"></i>
<i v-else-if="webhook.latestStatus === null" class="far fa-circle"></i>
<i v-else-if="[200, 201, 204].includes(webhook.latestStatus)" class="ph-check" :style="{ color: 'var(--success)' }"></i>
<i v-else class="fas fa-triangle-exclamation" :style="{ color: 'var(--error)' }"></i>

2
packages/client/src/pages/user/index.activity.vue
View file

@ -3,7 +3,7 @@
<template #header><i class="fas fa-chart-bar" style="margin-right: 0.5em;"></i>{{ $ts.activity }}</template>
<template #func>
<button class="_button" @click="showMenu">
<i class="fas fa-ellipsis-h"></i>
<i class="ph-dots-three-outline"></i>
</button>
</template>

2
packages/client/src/pages/user/index.vue
View file

@ -27,7 +27,7 @@
</div>
<span v-if="$i && $i.id != user.id && user.isFollowed" class="followed">{{ $ts.followsYou }}</span>
<div v-if="$i" class="actions">
<button class="menu _button" @click="menu"><i class="fas fa-ellipsis-h"></i></button>
<button class="menu _button" @click="menu"><i class="ph-dots-three-outline"></i></button>
<MkFollowButton v-if="$i.id != user.id" :user="user" :inline="true" :transparent="false" :full="true" class="koudoku"/>
</div>
</div>

2
packages/client/src/pages/welcome.entrance.a.vue
View file

@ -43,7 +43,7 @@
<template #n><b>{{ onlineUsersCount }}</b></template>
</I18n>
</div>
<button class="_button _acrylic menu" @click="showMenu"><i class="fas fa-ellipsis-h"></i></button>
<button class="_button _acrylic menu" @click="showMenu"><i class="ph-dots-three-outline"></i></button>
</div>
</div>
</div>

2
packages/client/src/pages/welcome.entrance.c.vue
View file

@ -40,7 +40,7 @@
<template #n><b>{{ onlineUsersCount }}</b></template>
</I18n>
</div>
<button class="_button _acrylic menu" @click="showMenu"><i class="fas fa-ellipsis-h"></i></button>
<button class="_button _acrylic menu" @click="showMenu"><i class="ph-dots-three-outline"></i></button>
</div>
</div>
<nav class="nav">

2
packages/client/src/scripts/select-file.ts
View file

@ -83,7 +83,7 @@ function select(src: any, label: string | null, multiple: boolean): Promise<Driv
ref: keepOriginal
}, {
text: i18n.ts.upload,
icon: 'fas fa-upload',
icon: 'ph-upload-simple',
action: chooseFileFromPc
}, {
text: i18n.ts.fromDrive,

4
packages/client/src/ui/_common_/sidebar-for-mobile.vue
View file

@ -11,7 +11,7 @@
<div v-if="item === '-'" class="divider"></div>
<component :is="menuDef[item].to ? 'MkA' : 'button'" v-else-if="menuDef[item] && (menuDef[item].show !== false)" v-click-anime class="item _button" :class="[item, { active: menuDef[item].active }]" active-class="active" :to="menuDef[item].to" v-on="menuDef[item].action ? { click: menuDef[item].action } : {}">
<i class="ph-fw" :class="menuDef[item].icon"></i><span class="text">{{ $ts[menuDef[item].title] }}</span>
<span v-if="menuDef[item].indicated" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="menuDef[item].indicated" class="indicator"><i class="ph-circle"></i></span>
</component>
</template>
<div class="divider"></div>
@ -20,7 +20,7 @@
</MkA>
<button v-click-anime class="item _button" @click="more">
<i class="fa fa-ellipsis-h ph-fw"></i><span class="text">{{ $ts.more }}</span>
<span v-if="otherMenuItemIndicated" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="otherMenuItemIndicated" class="indicator"><i class="ph-circle"></i></span>
</button>
<MkA v-click-anime class="item" active-class="active" to="/settings">
<i class="ph-gear ph-fw"></i><span class="text">{{ $ts.settings }}</span>

4
packages/client/src/ui/_common_/sidebar.vue
View file

@ -11,7 +11,7 @@
<div v-if="item === '-'" class="divider"></div>
<component :is="menuDef[item].to ? 'MkA' : 'button'" v-else-if="menuDef[item] && (menuDef[item].show !== false)" v-click-anime class="item _button" :class="[item, { active: menuDef[item].active }]" active-class="active" :to="menuDef[item].to" v-on="menuDef[item].action ? { click: menuDef[item].action } : {}">
<i class="ph-fw" :class="menuDef[item].icon"></i><span class="text">{{ $ts[menuDef[item].title] }}</span>
<span v-if="menuDef[item].indicated" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="menuDef[item].indicated" class="indicator"><i class="ph-circle"></i></span>
</component>
</template>
<div class="divider"></div>
@ -20,7 +20,7 @@
</MkA>
<button v-click-anime class="item _button" @click="more">
<i class="fa fa-ellipsis-h ph-fw"></i><span class="text">{{ $ts.more }}</span>
<span v-if="otherMenuItemIndicated" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="otherMenuItemIndicated" class="indicator"><i class="ph-circle"></i></span>
</button>
<MkA v-click-anime class="item" active-class="active" to="/settings">
<i class="ph-gear ph-fw"></i><span class="text">{{ $ts.settings }}</span>

6
packages/client/src/ui/classic.header.vue
View file

@ -9,7 +9,7 @@
<div v-if="item === '-'" class="divider"></div>
<component :is="menuDef[item].to ? 'MkA' : 'button'" v-else-if="menuDef[item] && (menuDef[item].show !== false)" v-click-anime v-tooltip="$ts[menuDef[item].title]" class="item _button" :class="item" active-class="active" :to="menuDef[item].to" v-on="menuDef[item].action ? { click: menuDef[item].action } : {}">
<i class="ph-fw" :class="menuDef[item].icon"></i>
<span v-if="menuDef[item].indicated" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="menuDef[item].indicated" class="indicator"><i class="ph-circle"></i></span>
</component>
</template>
<div class="divider"></div>
@ -17,8 +17,8 @@
<i class="fas fa-door-open ph-fw"></i>
</MkA>
<button v-click-anime class="item _button" @click="more">
<i class="fas fa-ellipsis-h ph-fw"></i>
<span v-if="otherNavItemIndicated" class="indicator"><i class="fas fa-circle"></i></span>
<i class="ph-dots-three-outline ph-fw"></i>
<span v-if="otherNavItemIndicated" class="indicator"><i class="ph-circle"></i></span>
</button>
</div>
<div class="right">

6
packages/client/src/ui/classic.sidebar.vue
View file

@ -16,7 +16,7 @@
<div v-if="item === '-'" class="divider"></div>
<component :is="menuDef[item].to ? 'MkA' : 'button'" v-else-if="menuDef[item] && (menuDef[item].show !== false)" v-click-anime class="item _button" :class="item" active-class="active" :to="menuDef[item].to" v-on="menuDef[item].action ? { click: menuDef[item].action } : {}">
<i class="ph-fw" :class="menuDef[item].icon"></i><span class="text">{{ $ts[menuDef[item].title] }}</span>
<span v-if="menuDef[item].indicated" class="indicator"><i class="fas fa-circle"></i></span>
<span v-if="menuDef[item].indicated" class="indicator"><i class="ph-circle"></i></span>
</component>
</template>
<div class="divider"></div>
@ -24,8 +24,8 @@
<i class="fas fa-door-open ph-fw"></i><span class="text">{{ $ts.controlPanel }}</span>
</MkA>
<button v-click-anime class="item _button" @click="more">
<i class="fas fa-ellipsis-h ph-fw"></i><span class="text">{{ $ts.more }}</span>
<span v-if="otherNavItemIndicated" class="indicator"><i class="fas fa-circle"></i></span>
<i class="ph-dots-three-outline ph-fw"></i><span class="text">{{ $ts.more }}</span>
<span v-if="otherNavItemIndicated" class="indicator"><i class="ph-circle"></i></span>
</button>
<MkA v-click-anime class="item" active-class="active" to="/settings" :behavior="settingsWindowed ? 'modalWindow' : null">
<i class="ph-gear ph-fw"></i><span class="text">{{ $ts.settings }}</span>

4
packages/client/src/ui/deck.vue
View file

@ -24,9 +24,9 @@
</template>
<div v-if="isMobile" class="buttons">
<button class="button nav _button" @click="drawerMenuShowing = true"><i class="fas fa-bars"></i><span v-if="menuIndicated" class="indicator"><i class="fas fa-circle"></i></span></button>
<button class="button nav _button" @click="drawerMenuShowing = true"><i class="fas fa-bars"></i><span v-if="menuIndicated" class="indicator"><i class="ph-circle"></i></span></button>
<button class="button home _button" @click="$router.push('/')"><i class="fas fa-home"></i></button>
<button class="button notifications _button" @click="$router.push('/my/notifications')"><i class="ph-bell"></i><span v-if="$i?.hasUnreadNotification" class="indicator"><i class="fas fa-circle"></i></span></button>
<button class="button notifications _button" @click="$router.push('/my/notifications')"><i class="ph-bell"></i><span v-if="$i?.hasUnreadNotification" class="indicator"><i class="ph-circle"></i></span></button>
<button class="button post _button" @click="os.post()"><i class="ph-pencil"></i></button>
</div>

4
packages/client/src/ui/universal.vue
View file

@ -29,9 +29,9 @@
<button class="widgetButton _button" :class="{ show: true }" @click="widgetsShowing = true"><i class="fas fa-layer-group"></i></button>
<div v-if="isMobile" class="buttons">
<button class="button nav _button" @click="drawerMenuShowing = true"><i class="fas fa-bars"></i><span v-if="menuIndicated" class="indicator"><i class="fas fa-circle"></i></span></button>
<button class="button nav _button" @click="drawerMenuShowing = true"><i class="fas fa-bars"></i><span v-if="menuIndicated" class="indicator"><i class="ph-circle"></i></span></button>
<button class="button home _button" @click="$route.name === 'index' ? top() : $router.push('/')"><i class="fas fa-home"></i></button>
<button class="button notifications _button" @click="$router.push('/my/notifications')"><i class="ph-bell"></i><span v-if="$i?.hasUnreadNotification" class="indicator"><i class="fas fa-circle"></i></span></button>
<button class="button notifications _button" @click="$router.push('/my/notifications')"><i class="ph-bell"></i><span v-if="$i?.hasUnreadNotification" class="indicator"><i class="ph-circle"></i></span></button>
<button class="button widget _button" @click="widgetsShowing = true"><i class="fas fa-layer-group"></i></button>
<button class="button post _button" @click="os.post()"><i class="ph-pencil"></i></button>
</div>