tabler icons
This commit is contained in:
parent
66f3de6262
commit
7037f2d566
22 changed files with 27 additions and 44 deletions
|
@ -69,9 +69,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="tabs">
|
<div class="tabs">
|
||||||
<button class="_button tab" :class="{ active: tab === 'index' }" @click="tab = 'index'"><i class="fas fa-asterisk ti-fw"></i></button>
|
<button class="_button tab" :class="{ active: tab === 'index' }" @click="tab = 'index'"><i class="ti ti-asterisk ti-fw"></i></button>
|
||||||
<button class="_button tab" :class="{ active: tab === 'custom' }" @click="tab = 'custom'"><i class="ti ti-mood-happy ti-fw"></i></button>
|
<button class="_button tab" :class="{ active: tab === 'custom' }" @click="tab = 'custom'"><i class="ti ti-mood-happy ti-fw"></i></button>
|
||||||
<button class="_button tab" :class="{ active: tab === 'unicode' }" @click="tab = 'unicode'"><i class="fas fa-leaf ti-fw"></i></button>
|
<button class="_button tab" :class="{ active: tab === 'unicode' }" @click="tab = 'unicode'"><i class="ti ti-leaf ti-fw"></i></button>
|
||||||
<button class="_button tab" :class="{ active: tab === 'tags' }" @click="tab = 'tags'"><i class="ti ti-hash ti-fw"></i></button>
|
<button class="_button tab" :class="{ active: tab === 'tags' }" @click="tab = 'tags'"><i class="ti ti-hash ti-fw"></i></button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,15 +0,0 @@
|
||||||
<template>
|
|
||||||
<span class="mk-file-type-icon">
|
|
||||||
<template v-if="kind == 'image'"><i class="fas fa-file-image"></i></template>
|
|
||||||
</span>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts" setup>
|
|
||||||
import { computed } from 'vue';
|
|
||||||
|
|
||||||
const props = defineProps<{
|
|
||||||
type: string;
|
|
||||||
}>();
|
|
||||||
|
|
||||||
const kind = computed(() => props.type.split('/')[0]);
|
|
||||||
</script>
|
|
|
@ -73,8 +73,7 @@
|
||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<XReactionsViewer ref="reactionsViewer" :note="appearNote"/>
|
<XReactionsViewer ref="reactionsViewer" :note="appearNote"/>
|
||||||
<button class="button _button" @click="reply()">
|
<button class="button _button" @click="reply()">
|
||||||
<template v-if="appearNote.reply"><i class="ti ti-arrow-back-up-all"></i></template>
|
<i class="ti ti-arrow-back-up"></i>
|
||||||
<template v-else><i class="ti ti-arrow-back-up"></i></template>
|
|
||||||
<p v-if="appearNote.repliesCount > 0" class="count">{{ appearNote.repliesCount }}</p>
|
<p v-if="appearNote.repliesCount > 0" class="count">{{ appearNote.repliesCount }}</p>
|
||||||
</button>
|
</button>
|
||||||
<XRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/>
|
<XRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/>
|
||||||
|
|
|
@ -83,8 +83,7 @@
|
||||||
</div>
|
</div>
|
||||||
<XReactionsViewer ref="reactionsViewer" :note="appearNote"/>
|
<XReactionsViewer ref="reactionsViewer" :note="appearNote"/>
|
||||||
<button class="button _button" @click="reply()">
|
<button class="button _button" @click="reply()">
|
||||||
<template v-if="appearNote.reply"><i class="ti ti-arrow-back-up-all"></i></template>
|
<i class="ti ti-arrow-back-up"></i>
|
||||||
<template v-else><i class="ti ti-arrow-back-up"></i></template>
|
|
||||||
<p v-if="appearNote.repliesCount > 0" class="count">{{ appearNote.repliesCount }}</p>
|
<p v-if="appearNote.repliesCount > 0" class="count">{{ appearNote.repliesCount }}</p>
|
||||||
</button>
|
</button>
|
||||||
<XRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/>
|
<XRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/>
|
||||||
|
|
|
@ -21,7 +21,7 @@
|
||||||
<span v-if="visibility === 'followers'"><i class="ti ti-lock-open"></i></span>
|
<span v-if="visibility === 'followers'"><i class="ti ti-lock-open"></i></span>
|
||||||
<span v-if="visibility === 'specified'"><i class="ti ti-mail"></i></span>
|
<span v-if="visibility === 'specified'"><i class="ti ti-mail"></i></span>
|
||||||
</button>
|
</button>
|
||||||
<button v-tooltip="i18n.ts.previewNoteText" class="_button preview" :class="{ active: showPreview }" @click="showPreview = !showPreview"><i class="fas fa-file-code"></i></button>
|
<button v-tooltip="i18n.ts.previewNoteText" class="_button preview" :class="{ active: showPreview }" @click="showPreview = !showPreview"><i class="ti ti-eye"></i></button>
|
||||||
<button class="submit _buttonGradate" :disabled="!canPost" data-cy-open-post-form-submit @click="post">{{ submitText }}<i :class="reply ? 'ti ti-arrow-back-up' : renote ? 'ti ti-quote' : 'ti ti-send'"></i></button>
|
<button class="submit _buttonGradate" :disabled="!canPost" data-cy-open-post-form-submit @click="post">{{ submitText }}<i :class="reply ? 'ti ti-arrow-back-up' : renote ? 'ti ti-quote' : 'ti ti-send'"></i></button>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
|
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
|
||||||
<component :is="self ? 'MkA' : 'a'" v-if="!fetching" class="link" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url">
|
<component :is="self ? 'MkA' : 'a'" v-if="!fetching" class="link" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url">
|
||||||
<div v-if="thumbnail" class="thumbnail" :style="`background-image: url('${thumbnail}')`">
|
<div v-if="thumbnail" class="thumbnail" :style="`background-image: url('${thumbnail}')`">
|
||||||
<button v-if="!playerEnabled && player.url" class="_button" :title="i18n.ts.enablePlayer" @click.prevent="isMobile? playerEnabled = true : openPlayer()"><i class="fas fa-play-circle"></i></button>
|
<button v-if="!playerEnabled && player.url" class="_button" :title="i18n.ts.enablePlayer" @click.prevent="isMobile? playerEnabled = true : openPlayer()"><i class="ti ti-player-play"></i></button>
|
||||||
</div>
|
</div>
|
||||||
<article>
|
<article>
|
||||||
<header>
|
<header>
|
||||||
|
|
|
@ -11,8 +11,8 @@
|
||||||
</span>
|
</span>
|
||||||
<span class="right">
|
<span class="right">
|
||||||
<button v-for="button in buttonsRight" v-tooltip="button.title" class="button _button" :class="{ highlighted: button.highlighted }" @click="button.onClick"><i :class="button.icon"></i></button>
|
<button v-for="button in buttonsRight" v-tooltip="button.title" class="button _button" :class="{ highlighted: button.highlighted }" @click="button.onClick"><i :class="button.icon"></i></button>
|
||||||
<button v-if="canResize && maximized" class="button _button" @click="unMaximize()"><i class="fas fa-window-restore"></i></button>
|
<button v-if="canResize && maximized" class="button _button" @click="unMaximize()"><i class="ti ti-app-window"></i></button>
|
||||||
<button v-else-if="canResize && !maximized" class="button _button" @click="maximize()"><i class="fas fa-window-maximize"></i></button>
|
<button v-else-if="canResize && !maximized" class="button _button" @click="maximize()"><i class="ti ti-arrows-maximize"></i></button>
|
||||||
<button v-if="closeButton" class="button _button" @click="close()"><i class="ti ti-x"></i></button>
|
<button v-if="closeButton" class="button _button" @click="close()"><i class="ti ti-x"></i></button>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -9,7 +9,7 @@
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div class="wszdbhzo">
|
<div class="wszdbhzo">
|
||||||
<div><i class="ti ti-alert-triangle"></i> {{ $ts.somethingHappened }}</div>
|
<div><i class="ti ti-alert-triangle"></i> {{ $ts.somethingHappened }}</div>
|
||||||
<MkButton inline class="retry" @click="retry"><i class="fas fa-redo-alt"></i> {{ $ts.retry }}</MkButton>
|
<MkButton inline class="retry" @click="retry"><i class="ti ti-reload"></i> {{ $ts.retry }}</MkButton>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</transition>
|
</transition>
|
||||||
|
@ -21,14 +21,14 @@ import MkButton from '@/components/MkButton.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
MkButton
|
MkButton,
|
||||||
},
|
},
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
p: {
|
p: {
|
||||||
type: Function as PropType<() => Promise<any>>,
|
type: Function as PropType<() => Promise<any>>,
|
||||||
required: true,
|
required: true,
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
setup(props, context) {
|
setup(props, context) {
|
||||||
|
@ -59,7 +59,7 @@ export default defineComponent({
|
||||||
watch(() => props.p, () => {
|
watch(() => props.p, () => {
|
||||||
process();
|
process();
|
||||||
}, {
|
}, {
|
||||||
immediate: true
|
immediate: true,
|
||||||
});
|
});
|
||||||
|
|
||||||
const retry = () => {
|
const retry = () => {
|
||||||
|
@ -73,7 +73,7 @@ export default defineComponent({
|
||||||
result,
|
result,
|
||||||
retry,
|
retry,
|
||||||
};
|
};
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -78,7 +78,7 @@ export const navbarItemDef = reactive({
|
||||||
},
|
},
|
||||||
pages: {
|
pages: {
|
||||||
title: 'pages',
|
title: 'pages',
|
||||||
icon: 'fas fa-file-alt',
|
icon: 'ti ti-news',
|
||||||
to: '/pages',
|
to: '/pages',
|
||||||
},
|
},
|
||||||
gallery: {
|
gallery: {
|
||||||
|
|
|
@ -136,7 +136,7 @@ const headerTabs = $computed(() => [{
|
||||||
|
|
||||||
definePageMetadata(computed(() => ({
|
definePageMetadata(computed(() => ({
|
||||||
title: file ? i18n.ts.file + ': ' + file.name : i18n.ts.file,
|
title: file ? i18n.ts.file + ': ' + file.name : i18n.ts.file,
|
||||||
icon: 'fas fa-file',
|
icon: 'ti ti-file',
|
||||||
})));
|
})));
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -170,7 +170,7 @@ const menuDef = $computed(() => [{
|
||||||
to: '/admin/instance-block',
|
to: '/admin/instance-block',
|
||||||
active: currentPage?.route.name === 'instance-block',
|
active: currentPage?.route.name === 'instance-block',
|
||||||
}, {
|
}, {
|
||||||
icon: 'fas fa-ghost',
|
icon: 'ti ti-ghost',
|
||||||
text: i18n.ts.proxyAccount,
|
text: i18n.ts.proxyAccount,
|
||||||
to: '/admin/proxy-account',
|
to: '/admin/proxy-account',
|
||||||
active: currentPage?.route.name === 'proxy-account',
|
active: currentPage?.route.name === 'proxy-account',
|
||||||
|
|
|
@ -57,6 +57,6 @@ const headerTabs = $computed(() => []);
|
||||||
|
|
||||||
definePageMetadata({
|
definePageMetadata({
|
||||||
title: i18n.ts.proxyAccount,
|
title: i18n.ts.proxyAccount,
|
||||||
icon: 'fas fa-ghost',
|
icon: 'ti ti-ghost',
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -61,7 +61,7 @@ const headerActions = $computed(() => [{
|
||||||
const headerTabs = $computed(() => [{
|
const headerTabs = $computed(() => [{
|
||||||
key: 'featured',
|
key: 'featured',
|
||||||
title: i18n.ts._channel.featured,
|
title: i18n.ts._channel.featured,
|
||||||
icon: 'fas fa-fire-alt',
|
icon: 'ti ti-comet',
|
||||||
}, {
|
}, {
|
||||||
key: 'following',
|
key: 'following',
|
||||||
title: i18n.ts._channel.following,
|
title: i18n.ts._channel.following,
|
||||||
|
|
|
@ -13,7 +13,7 @@
|
||||||
</MkPagination>
|
</MkPagination>
|
||||||
</MkFolder>
|
</MkFolder>
|
||||||
<MkFolder class="_gap">
|
<MkFolder class="_gap">
|
||||||
<template #header><i class="fas fa-fire-alt"></i>{{ i18n.ts.popularPosts }}</template>
|
<template #header><i class="ti ti-comet"></i>{{ i18n.ts.popularPosts }}</template>
|
||||||
<MkPagination v-slot="{items}" :pagination="popularPostsPagination" :disable-auto-load="true">
|
<MkPagination v-slot="{items}" :pagination="popularPostsPagination" :disable-auto-load="true">
|
||||||
<div class="vfpdbgtk">
|
<div class="vfpdbgtk">
|
||||||
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
|
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
|
||||||
|
|
|
@ -50,7 +50,7 @@ const init = async () => {
|
||||||
function menu(account, ev) {
|
function menu(account, ev) {
|
||||||
os.popupMenu([{
|
os.popupMenu([{
|
||||||
text: i18n.ts.switch,
|
text: i18n.ts.switch,
|
||||||
icon: 'fas fa-exchange-alt',
|
icon: 'ti ti-switch-horizontal',
|
||||||
action: () => switchAccount(account),
|
action: () => switchAccount(account),
|
||||||
}, {
|
}, {
|
||||||
text: i18n.ts.remove,
|
text: i18n.ts.remove,
|
||||||
|
|
|
@ -154,7 +154,7 @@ const headerTabs = $computed(() => []);
|
||||||
|
|
||||||
definePageMetadata({
|
definePageMetadata({
|
||||||
title: i18n.ts.importAndExport,
|
title: i18n.ts.importAndExport,
|
||||||
icon: 'fas fa-boxes',
|
icon: 'ti ti-package',
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -47,7 +47,7 @@
|
||||||
<FormSection>
|
<FormSection>
|
||||||
<div style="display: flex; gap: var(--margin); flex-wrap: wrap;">
|
<div style="display: flex; gap: var(--margin); flex-wrap: wrap;">
|
||||||
<FormButton inline @click="preview"><i class="ti ti-eye"></i> {{ i18n.ts.preview }}</FormButton>
|
<FormButton inline @click="preview"><i class="ti ti-eye"></i> {{ i18n.ts.preview }}</FormButton>
|
||||||
<FormButton inline danger @click="setDefault"><i class="fas fa-undo"></i> {{ i18n.ts.default }}</FormButton>
|
<FormButton inline danger @click="setDefault"><i class="ti ti-reload"></i> {{ i18n.ts.default }}</FormButton>
|
||||||
</div>
|
</div>
|
||||||
</FormSection>
|
</FormSection>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -30,7 +30,7 @@
|
||||||
|
|
||||||
<FormSection>
|
<FormSection>
|
||||||
<FormSlot>
|
<FormSlot>
|
||||||
<FormButton danger @click="regenerateToken"><i class="fas fa-sync-alt"></i> {{ i18n.ts.regenerateLoginToken }}</FormButton>
|
<FormButton danger @click="regenerateToken"><i class="ti ti-refresh"></i> {{ i18n.ts.regenerateLoginToken }}</FormButton>
|
||||||
<template #caption>{{ i18n.ts.regenerateLoginTokenDescription }}</template>
|
<template #caption>{{ i18n.ts.regenerateLoginTokenDescription }}</template>
|
||||||
</FormSlot>
|
</FormSlot>
|
||||||
</FormSection>
|
</FormSection>
|
||||||
|
|
|
@ -13,7 +13,7 @@
|
||||||
</FormLink>
|
</FormLink>
|
||||||
</FormSection>
|
</FormSection>
|
||||||
|
|
||||||
<FormButton danger class="_formBlock" @click="reset()"><i class="fas fa-redo"></i> {{ i18n.ts.default }}</FormButton>
|
<FormButton danger class="_formBlock" @click="reset()"><i class="ti ti-reload"></i> {{ i18n.ts.default }}</FormButton>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
@ -81,7 +81,7 @@ const headerTabs = $computed(() => user ? [{
|
||||||
}, {
|
}, {
|
||||||
key: 'pages',
|
key: 'pages',
|
||||||
title: i18n.ts.pages,
|
title: i18n.ts.pages,
|
||||||
icon: 'fas fa-file-alt',
|
icon: 'ti ti-news',
|
||||||
}, {
|
}, {
|
||||||
key: 'gallery',
|
key: 'gallery',
|
||||||
title: i18n.ts.gallery,
|
title: i18n.ts.gallery,
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<XColumn :menu="menu" :naked="true" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
|
<XColumn :menu="menu" :naked="true" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
|
||||||
<template #header><i class="fas fa-window-maximize" style="margin-right: 8px;"></i>{{ column.name }}</template>
|
<template #header><i class="ti ti-layout-list" style="margin-right: 8px;"></i>{{ column.name }}</template>
|
||||||
|
|
||||||
<div class="wtdtxvec">
|
<div class="wtdtxvec">
|
||||||
<div v-if="!(column.widgets && column.widgets.length > 0) && !edit" class="intro">{{ i18n.ts._deck.widgetsIntroduction }}</div>
|
<div v-if="!(column.widgets && column.widgets.length > 0) && !edit" class="intro">{{ i18n.ts._deck.widgetsIntroduction }}</div>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<MkContainer :show-header="widgetProps.showHeader" :naked="widgetProps.transparent" :class="$style.root" :data-transparent="widgetProps.transparent ? true : null" class="mkw-photos">
|
<MkContainer :show-header="widgetProps.showHeader" :naked="widgetProps.transparent" :class="$style.root" :data-transparent="widgetProps.transparent ? true : null" class="mkw-photos">
|
||||||
<template #header><i class="fas fa-camera"></i>{{ i18n.ts._widgets.photos }}</template>
|
<template #header><i class="ti ti-camera"></i>{{ i18n.ts._widgets.photos }}</template>
|
||||||
|
|
||||||
<div class="">
|
<div class="">
|
||||||
<MkLoading v-if="fetching"/>
|
<MkLoading v-if="fetching"/>
|
||||||
|
|
Loading…
Reference in a new issue