diff options
Diffstat (limited to 'packages/frontend/src/widgets')
| -rw-r--r-- | packages/frontend/src/widgets/WidgetActivity.vue | 5 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetAiscript.vue | 3 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetClicker.vue | 3 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetFederation.vue | 3 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetMemo.vue | 3 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetNotifications.vue | 5 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetPhotos.vue | 3 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetRss.vue | 19 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetRssTicker.vue | 21 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetTimeline.vue | 16 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetTrends.vue | 3 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/WidgetUserList.vue | 5 | ||||
| -rw-r--r-- | packages/frontend/src/widgets/server-metric/index.vue | 5 |
13 files changed, 54 insertions, 40 deletions
diff --git a/packages/frontend/src/widgets/WidgetActivity.vue b/packages/frontend/src/widgets/WidgetActivity.vue index 116da15b40..1834036789 100644 --- a/packages/frontend/src/widgets/WidgetActivity.vue +++ b/packages/frontend/src/widgets/WidgetActivity.vue @@ -1,7 +1,8 @@ <template> <MkContainer :show-header="widgetProps.showHeader" :naked="widgetProps.transparent" class="mkw-activity"> - <template #header><i class="ti ti-chart-line"></i>{{ i18n.ts._widgets.activity }}</template> - <template #func><button class="_button" @click="toggleView()"><i class="ti ti-selector"></i></button></template> + <template #icon><i class="ti ti-chart-line"></i></template> + <template #header>{{ i18n.ts._widgets.activity }}</template> + <template #func="{ buttonStyleClass }"><button class="_button" :class="buttonStyleClass" @click="toggleView()"><i class="ti ti-selector"></i></button></template> <div> <MkLoading v-if="fetching"/> diff --git a/packages/frontend/src/widgets/WidgetAiscript.vue b/packages/frontend/src/widgets/WidgetAiscript.vue index dcc73db201..2e49a354ef 100644 --- a/packages/frontend/src/widgets/WidgetAiscript.vue +++ b/packages/frontend/src/widgets/WidgetAiscript.vue @@ -1,6 +1,7 @@ <template> <MkContainer :show-header="widgetProps.showHeader" class="mkw-aiscript"> - <template #header><i class="ti ti-terminal-2"></i>{{ i18n.ts._widgets.aiscript }}</template> + <template #icon><i class="ti ti-terminal-2"></i></template> + <template #header>{{ i18n.ts._widgets.aiscript }}</template> <div class="uylguesu _monospace"> <textarea v-model="widgetProps.script" placeholder="(1 + 1)"></textarea> diff --git a/packages/frontend/src/widgets/WidgetClicker.vue b/packages/frontend/src/widgets/WidgetClicker.vue index 168f05bccd..66c3fbd9d2 100644 --- a/packages/frontend/src/widgets/WidgetClicker.vue +++ b/packages/frontend/src/widgets/WidgetClicker.vue @@ -1,6 +1,7 @@ <template> <MkContainer :show-header="widgetProps.showHeader" class="mkw-clicker"> - <template #header><i class="ti ti-cookie"></i>Clicker</template> + <template #icon><i class="ti ti-cookie"></i></template> + <template #header>Clicker</template> <MkClickerGame/> </MkContainer> </template> diff --git a/packages/frontend/src/widgets/WidgetFederation.vue b/packages/frontend/src/widgets/WidgetFederation.vue index 23f7cd4411..ea82b0c12d 100644 --- a/packages/frontend/src/widgets/WidgetFederation.vue +++ b/packages/frontend/src/widgets/WidgetFederation.vue @@ -1,6 +1,7 @@ <template> <MkContainer :show-header="widgetProps.showHeader" :foldable="foldable" :scrollable="scrollable" class="mkw-federation"> - <template #header><i class="ti ti-whirl"></i>{{ i18n.ts._widgets.federation }}</template> + <template #icon><i class="ti ti-whirl"></i></template> + <template #header>{{ i18n.ts._widgets.federation }}</template> <div class="wbrkwalb"> <MkLoading v-if="fetching"/> diff --git a/packages/frontend/src/widgets/WidgetMemo.vue b/packages/frontend/src/widgets/WidgetMemo.vue index 1cc0e10bba..d5d96165c7 100644 --- a/packages/frontend/src/widgets/WidgetMemo.vue +++ b/packages/frontend/src/widgets/WidgetMemo.vue @@ -1,6 +1,7 @@ <template> <MkContainer :show-header="widgetProps.showHeader" class="mkw-memo"> - <template #header><i class="ti ti-note"></i>{{ i18n.ts._widgets.memo }}</template> + <template #icon><i class="ti ti-note"></i></template> + <template #header>{{ i18n.ts._widgets.memo }}</template> <div class="otgbylcu"> <textarea v-model="text" :placeholder="i18n.ts.placeholder" @input="onChange"></textarea> diff --git a/packages/frontend/src/widgets/WidgetNotifications.vue b/packages/frontend/src/widgets/WidgetNotifications.vue index e697209444..89f3114b85 100644 --- a/packages/frontend/src/widgets/WidgetNotifications.vue +++ b/packages/frontend/src/widgets/WidgetNotifications.vue @@ -1,7 +1,8 @@ <template> <MkContainer :style="`height: ${widgetProps.height}px;`" :show-header="widgetProps.showHeader" :scrollable="true" class="mkw-notifications"> - <template #header><i class="ti ti-bell"></i>{{ i18n.ts.notifications }}</template> - <template #func><button class="_button" @click="configureNotification()"><i class="ti ti-settings"></i></button></template> + <template #icon><i class="ti ti-bell"></i></template> + <template #header>{{ i18n.ts.notifications }}</template> + <template #func="{ buttonStyleClass }"><button class="_button" :class="buttonStyleClass" @click="configureNotification()"><i class="ti ti-settings"></i></button></template> <div> <XNotifications :include-types="widgetProps.includingTypes"/> diff --git a/packages/frontend/src/widgets/WidgetPhotos.vue b/packages/frontend/src/widgets/WidgetPhotos.vue index 65d1de1385..4e55bb9927 100644 --- a/packages/frontend/src/widgets/WidgetPhotos.vue +++ b/packages/frontend/src/widgets/WidgetPhotos.vue @@ -1,6 +1,7 @@ <template> <MkContainer :show-header="widgetProps.showHeader" :naked="widgetProps.transparent" :class="$style.root" :data-transparent="widgetProps.transparent ? true : null" class="mkw-photos"> - <template #header><i class="ti ti-camera"></i>{{ i18n.ts._widgets.photos }}</template> + <template #icon><i class="ti ti-camera"></i></template> + <template #header>{{ i18n.ts._widgets.photos }}</template> <div class=""> <MkLoading v-if="fetching"/> diff --git a/packages/frontend/src/widgets/WidgetRss.vue b/packages/frontend/src/widgets/WidgetRss.vue index 554413cd1e..a25bd67aae 100644 --- a/packages/frontend/src/widgets/WidgetRss.vue +++ b/packages/frontend/src/widgets/WidgetRss.vue @@ -1,16 +1,17 @@ <template> <MkContainer :show-header="widgetProps.showHeader" class="mkw-rss"> - <template #header><i class="ti ti-rss"></i>RSS</template> - <template #func><button class="_button" @click="configure"><i class="ti ti-settings"></i></button></template> + <template #icon><i class="ti ti-rss"></i></template> + <template #header>RSS</template> + <template #func="{ buttonStyleClass }"><button class="_button" :class="buttonStyleClass" @click="configure"><i class="ti ti-settings"></i></button></template> <div class="ekmkgxbj"> <MkLoading v-if="fetching"/> - <div class="_fullinfo" v-else-if="(!items || items.length === 0) && widgetProps.showHeader"> + <div v-else-if="(!items || items.length === 0) && widgetProps.showHeader" class="_fullinfo"> <img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/> <div>{{ i18n.ts.nothing }}</div> </div> <div v-else :class="$style.feed"> - <a v-for="item in items" :class="$style.item" :href="item.link" :key="item.link" rel="nofollow noopener" target="_blank" :title="item.title">{{ item.title }}</a> + <a v-for="item in items" :key="item.link" :class="$style.item" :href="item.link" rel="nofollow noopener" target="_blank" :title="item.title">{{ item.title }}</a> </div> </div> </MkContainer> @@ -74,11 +75,11 @@ const tick = () => { if (document.visibilityState === 'hidden' && rawItems.value.length !== 0) return; window.fetch(fetchEndpoint.value, {}) - .then(res => res.json()) - .then(feed => { - rawItems.value = feed.items ?? []; - fetching.value = false; - }); + .then(res => res.json()) + .then(feed => { + rawItems.value = feed.items ?? []; + fetching.value = false; + }); }; watch(() => fetchEndpoint, tick); diff --git a/packages/frontend/src/widgets/WidgetRssTicker.vue b/packages/frontend/src/widgets/WidgetRssTicker.vue index 2620ff4eb0..a7488f4ca2 100644 --- a/packages/frontend/src/widgets/WidgetRssTicker.vue +++ b/packages/frontend/src/widgets/WidgetRssTicker.vue @@ -1,7 +1,8 @@ <template> <MkContainer :naked="widgetProps.transparent" :show-header="widgetProps.showHeader" class="mkw-rss-ticker"> - <template #header><i class="ti ti-rss"></i>RSS</template> - <template #func><button class="_button" @click="configure"><i class="ti ti-settings"></i></button></template> + <template #icon><i class="ti ti-rss"></i></template> + <template #header>RSS</template> + <template #func="{ buttonStyleClass }"><button class="_button" :class="buttonStyleClass" @click="configure"><i class="ti ti-settings"></i></button></template> <div :class="$style.feed"> <div v-if="fetching" :class="$style.loading"> @@ -10,7 +11,7 @@ <div v-else> <Transition :name="$style.change" mode="default" appear> <MarqueeText :key="key" :duration="widgetProps.duration" :reverse="widgetProps.reverse"> - <span v-for="item in items" :class="$style.item" :key="item.link"> + <span v-for="item in items" :key="item.link" :class="$style.item"> <a :class="$style.link" :href="item.link" rel="nofollow noopener" target="_blank" :title="item.title">{{ item.title }}</a><span :class="$style.divider"></span> </span> </MarqueeText> @@ -86,7 +87,7 @@ const { widgetProps, configure } = useWidgetPropsManager(name, const rawItems = ref([]); const items = computed(() => { - const newItems = rawItems.value.slice(0, widgetProps.maxEntries) + const newItems = rawItems.value.slice(0, widgetProps.maxEntries); if (widgetProps.shuffle) { shuffle(newItems); } @@ -106,12 +107,12 @@ const tick = () => { if (document.visibilityState === 'hidden' && rawItems.value.length !== 0) return; window.fetch(fetchEndpoint.value, {}) - .then(res => res.json()) - .then(feed => { - rawItems.value = feed.items ?? []; - fetching.value = false; - key++; - }); + .then(res => res.json()) + .then(feed => { + rawItems.value = feed.items ?? []; + fetching.value = false; + key++; + }); }; watch(() => fetchEndpoint, tick); diff --git a/packages/frontend/src/widgets/WidgetTimeline.vue b/packages/frontend/src/widgets/WidgetTimeline.vue index 5bd626cd0e..8618dbc2ea 100644 --- a/packages/frontend/src/widgets/WidgetTimeline.vue +++ b/packages/frontend/src/widgets/WidgetTimeline.vue @@ -1,14 +1,16 @@ <template> <MkContainer :show-header="widgetProps.showHeader" :style="`height: ${widgetProps.height}px;`" :scrollable="true" class="mkw-timeline"> + <template #icon> + <i v-if="widgetProps.src === 'home'" class="ti ti-home"></i> + <i v-else-if="widgetProps.src === 'local'" class="ti ti-planet"></i> + <i v-else-if="widgetProps.src === 'social'" class="ti ti-rocket"></i> + <i v-else-if="widgetProps.src === 'global'" class="ti ti-whirl"></i> + <i v-else-if="widgetProps.src === 'list'" class="ti ti-list"></i> + <i v-else-if="widgetProps.src === 'antenna'" class="ti ti-antenna"></i> + </template> <template #header> <button class="_button" @click="choose"> - <i v-if="widgetProps.src === 'home'" class="ti ti-home"></i> - <i v-else-if="widgetProps.src === 'local'" class="ti ti-planet"></i> - <i v-else-if="widgetProps.src === 'social'" class="ti ti-rocket"></i> - <i v-else-if="widgetProps.src === 'global'" class="ti ti-whirl"></i> - <i v-else-if="widgetProps.src === 'list'" class="ti ti-list"></i> - <i v-else-if="widgetProps.src === 'antenna'" class="ti ti-antenna"></i> - <span style="margin-left: 8px;">{{ widgetProps.src === 'list' ? widgetProps.list.name : widgetProps.src === 'antenna' ? widgetProps.antenna.name : $t('_timelines.' + widgetProps.src) }}</span> + <span>{{ widgetProps.src === 'list' ? widgetProps.list.name : widgetProps.src === 'antenna' ? widgetProps.antenna.name : $t('_timelines.' + widgetProps.src) }}</span> <i :class="menuOpened ? 'ti ti-chevron-up' : 'ti ti-chevron-down'" style="margin-left: 8px;"></i> </button> </template> diff --git a/packages/frontend/src/widgets/WidgetTrends.vue b/packages/frontend/src/widgets/WidgetTrends.vue index e500448167..94849fdba4 100644 --- a/packages/frontend/src/widgets/WidgetTrends.vue +++ b/packages/frontend/src/widgets/WidgetTrends.vue @@ -1,6 +1,7 @@ <template> <MkContainer :show-header="widgetProps.showHeader" class="mkw-trends"> - <template #header><i class="ti ti-hash"></i>{{ i18n.ts._widgets.trends }}</template> + <template #icon><i class="ti ti-hash"></i></template> + <template #header>{{ i18n.ts._widgets.trends }}</template> <div class="wbrkwala"> <MkLoading v-if="fetching"/> diff --git a/packages/frontend/src/widgets/WidgetUserList.vue b/packages/frontend/src/widgets/WidgetUserList.vue index 9ffbf0d8e3..1d9f8751f0 100644 --- a/packages/frontend/src/widgets/WidgetUserList.vue +++ b/packages/frontend/src/widgets/WidgetUserList.vue @@ -1,7 +1,8 @@ <template> <MkContainer :show-header="widgetProps.showHeader" class="mkw-userList"> - <template #header><i class="ti ti-users"></i>{{ list ? list.name : i18n.ts._widgets.userList }}</template> - <template #func><button class="_button" @click="configure()"><i class="ti ti-settings"></i></button></template> + <template #icon><i class="ti ti-users"></i></template> + <template #header>{{ list ? list.name : i18n.ts._widgets.userList }}</template> + <template #func="{ buttonStyleClass }"><button class="_button" :class="buttonStyleClass" @click="configure()"><i class="ti ti-settings"></i></button></template> <div :class="$style.root"> <div v-if="widgetProps.listId == null" class="init"> diff --git a/packages/frontend/src/widgets/server-metric/index.vue b/packages/frontend/src/widgets/server-metric/index.vue index bc3fca6fc1..b7537e1957 100644 --- a/packages/frontend/src/widgets/server-metric/index.vue +++ b/packages/frontend/src/widgets/server-metric/index.vue @@ -1,7 +1,8 @@ <template> <MkContainer :show-header="widgetProps.showHeader" :naked="widgetProps.transparent"> - <template #header><i class="ti ti-server"></i>{{ i18n.ts._widgets.serverMetric }}</template> - <template #func><button class="_button" @click="toggleView()"><i class="ti ti-selector"></i></button></template> + <template #icon><i class="ti ti-server"></i></template> + <template #header>{{ i18n.ts._widgets.serverMetric }}</template> + <template #func="{ buttonStyleClass }"><button class="_button" :class="buttonStyleClass" @click="toggleView()"><i class="ti ti-selector"></i></button></template> <div v-if="meta" class="mkw-serverMetric"> <XCpuMemory v-if="widgetProps.view === 0" :connection="connection" :meta="meta"/> |