HoovesSocial/hippofish
2
0
Fork 0
Code Issues 3 Pull requests 1 Projects Releases Packages Wiki Activity Actions

replaced ti-player-* and ti-volume-*

Browse source
This commit is contained in:
dakkar 2024-06-22 11:26:18 +01:00
parent d21d428d64
commit 172f9e7443
16 changed files with 35 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
packages/frontend/src/components/MkMediaAudio.vue
View file

@ -44,8 +44,8 @@ SPDX-License-Identifier: AGPL-3.0-only
</audio>
<div :class="[$style.controlsChild, $style.controlsLeft]">
<button class="_button" :class="$style.controlButton" @click="togglePlayPause">
<i v-if="isPlaying" class="ph-pause ph-bold ph-lg"></i>
<i v-else class="ph-play ph-bold ph-lg"></i>
<i v-if="isPlaying" class="ti ti-player-pause-filled"></i>
<i v-else class="ti ti-player-play-filled"></i>
</button>
</div>
<div :class="[$style.controlsChild, $style.controlsRight]">
@ -59,8 +59,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<div :class="[$style.controlsChild, $style.controlsTime]">{{ hms(elapsedTimeMs) }}</div>
<div :class="[$style.controlsChild, $style.controlsVolume]">
<button class="_button" :class="$style.controlButton" @click="toggleMute">
<i v-if="volume === 0" class="ph-speaker-x ph-bold ph-lg"></i>
<i v-else class="ph-speaker-high ph-bold ph-lg"></i>
<i v-if="volume === 0" class="ti ti-volume-3"></i>
<i v-else class="ti ti-volume"></i>
</button>
<MkMediaRange
v-model="volume"

10
packages/frontend/src/components/MkMediaVideo.vue
View file

@ -60,7 +60,7 @@ SPDX-License-Identifier: AGPL-3.0-only
>
<source :src="video.url">
</video>
<button v-if="isReady && !isPlaying" class="_button" :class="$style.videoOverlayPlayButton" @click="togglePlayPause"><i class="ph-play ph-bold ph-lg"></i></button>
<button v-if="isReady && !isPlaying" class="_button" :class="$style.videoOverlayPlayButton" @click="togglePlayPause"><i class="ti ti-player-play-filled"></i></button>
<div v-else-if="!isActuallyPlaying" :class="$style.videoLoading">
<MkLoading/>
</div>
@ -72,8 +72,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<div :class="$style.videoControls" @click.self="togglePlayPause">
<div :class="[$style.controlsChild, $style.controlsLeft]">
<button class="_button" :class="$style.controlButton" @click="togglePlayPause">
<i v-if="isPlaying" class="ph-pause ph-bold ph-lg"></i>
<i v-else class="ph-play ph-bold ph-lg"></i>
<i v-if="isPlaying" class="ti ti-player-pause-filled"></i>
<i v-else class="ti ti-player-play-filled"></i>
</button>
</div>
<div :class="[$style.controlsChild, $style.controlsRight]">
@ -91,8 +91,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<div :class="[$style.controlsChild, $style.controlsTime]">{{ hms(elapsedTimeMs) }}</div>
<div :class="[$style.controlsChild, $style.controlsVolume]">
<button class="_button" :class="$style.controlButton" @click="toggleMute">
<i v-if="volume === 0" class="ph-speaker-x ph-bold ph-lg"></i>
<i v-else class="ph-speaker-high ph-bold ph-lg"></i>
<i v-if="volume === 0" class="ti ti-volume-3"></i>
<i v-else class="ti ti-volume"></i>
</button>
<MkMediaRange
v-model="volume"

4
packages/frontend/src/components/MkPageWindow.vue
View file

@ -81,7 +81,7 @@ const buttonsRight = computed(() => {
title: i18n.ts.reload,
onClick: reload,
}, {
icon: 'ph-eject ph-bold ph-lg',
icon: 'ti ti-player-eject',
title: i18n.ts.showInPage,
onClick: expand,
}];
@ -113,7 +113,7 @@ provide('forceSpacerMin', true);
provide('shouldBackButton', false);
const contextmenu = computed(() => ([{
icon: 'ph-eject ph-bold ph-lg',
icon: 'ti ti-player-eject',
text: i18n.ts.showInPage,
action: expand,
}, {

2
packages/frontend/src/components/MkUrlPreview.vue
View file

@ -72,7 +72,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div v-if="!playerEnabled && player.url" :class="$style.action">
<MkButton :small="true" inline @click="playerEnabled = true">
<i class="ph-play ph-bold ph-lg"></i> {{ i18n.ts.enablePlayer }}
<i class="ti ti-player-play"></i> {{ i18n.ts.enablePlayer }}
</MkButton>
<MkButton v-if="!isMobile" :small="true" inline @click="openPlayer()">
<i class="ph-picture-in-picture ph-bold ph-lg"></i> {{ i18n.ts.openInWindow }}

2
packages/frontend/src/components/global/MkA.vue
View file

@ -61,7 +61,7 @@ function onContextmenu(ev) {
os.pageWindow(props.to);
},
}, {
icon: 'ph-eject ph-bold ph-lg',
icon: 'ti ti-player-eject',
text: i18n.ts.showInPage,
action: () => {
router.push(props.to, 'forcePage');

2
packages/frontend/src/navbar.ts
View file

@ -93,7 +93,7 @@ export const navbarItemDef = reactive({
},
play: {
title: 'Play',
icon: 'ph-play ph-bold ph-lg',
icon: 'ti ti-player-play',
to: '/play',
},
gallery: {

8
packages/frontend/src/pages/drop-and-fusion.game.vue
View file

@ -105,7 +105,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</I18n>
</div>
</div>
<div v-if="replaying" :class="$style.replayIndicator"><span :class="$style.replayIndicatorText"><i class="ph-play ph-bold ph-lg"></i> {{ i18n.ts.replaying }}</span></div>
<div v-if="replaying" :class="$style.replayIndicator"><span :class="$style.replayIndicatorText"><i class="ti ti-player-play"></i> {{ i18n.ts.replaying }}</span></div>
</div>
<div v-if="replaying" class="_woodenFrame">
@ -116,9 +116,9 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div class="_woodenFrameInner">
<div class="_buttonsCenter">
<MkButton @click="endReplay"><i class="ph-stop ph-bold ph-lg"></i> {{ i18n.ts.endReplay }}</MkButton>
<MkButton :primary="replayPlaybackRate === 4" @click="replayPlaybackRate = replayPlaybackRate === 4 ? 1 : 4"><i class="ph-skip-forward ph-bold ph-lg"></i> x4</MkButton>
<MkButton :primary="replayPlaybackRate === 16" @click="replayPlaybackRate = replayPlaybackRate === 16 ? 1 : 16"><i class="ph-skip-forward ph-bold ph-lg"></i> x16</MkButton>
<MkButton @click="endReplay"><i class="ti ti-player-stop"></i> {{ i18n.ts.endReplay }}</MkButton>
<MkButton :primary="replayPlaybackRate === 4" @click="replayPlaybackRate = replayPlaybackRate === 4 ? 1 : 4"><i class="ti ti-player-track-next"></i> x4</MkButton>
<MkButton :primary="replayPlaybackRate === 16" @click="replayPlaybackRate = replayPlaybackRate === 16 ? 1 : 16"><i class="ti ti-player-track-next"></i> x16</MkButton>
</div>
</div>
</div>

2
packages/frontend/src/pages/flash/flash-index.vue
View file

@ -92,6 +92,6 @@ const headerTabs = computed(() => [{
definePageMetadata(() => ({
title: 'Play',
icon: 'ph-play ph-bold ph-lg',
icon: 'ti ti-player-play',
}));
</script>

2
packages/frontend/src/pages/reversi/game.board.vue
View file

@ -94,7 +94,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkButton :disabled="logPos === game.logs.length" @click="logPos++"><i class="ti ti-chevron-right"></i></MkButton>
<MkButton :disabled="logPos === game.logs.length" @click="logPos = game.logs.length"><i class="ti ti-chevrons-right"></i></MkButton>
</div>
<MkButton style="margin: auto;" :disabled="autoplaying" @click="autoplay()"><i class="ph-play ph-bold ph-lg"></i></MkButton>
<MkButton style="margin: auto;" :disabled="autoplaying" @click="autoplay()"><i class="ti ti-player-play"></i></MkButton>
</div>
<div class="_panel" style="padding: 16px;">

2
packages/frontend/src/pages/scratchpad.vue
View file

@ -13,7 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div :class="$style.editor" class="_panel">
<MkCodeEditor v-model="code" lang="aiscript"/>
</div>
<MkButton primary @click="run()"><i class="ph-play ph-bold ph-lg"></i></MkButton>
<MkButton primary @click="run()"><i class="ti ti-player-play"></i></MkButton>
</div>
<MkContainer v-if="root && components.length > 1" :key="uiKey" :foldable="true">

2
packages/frontend/src/pages/settings/sounds.sound.vue
View file

@ -18,7 +18,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</MkRange>
<div class="_buttons">
<MkButton inline @click="listen"><i class="ph-play ph-bold ph-lg"></i> {{ i18n.ts.listen }}</MkButton>
<MkButton inline @click="listen"><i class="ti ti-player-play"></i> {{ i18n.ts.listen }}</MkButton>
<MkButton inline primary @click="save"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton>
</div>
</div>

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

@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div class="_gaps">
<FormLink v-for="webhook in items" :key="webhook.id" :to="`/settings/webhook/edit/${webhook.id}`">
<template #icon>
<i v-if="webhook.active === false" class="ph-pause ph-bold ph-lg"></i>
<i v-if="webhook.active === false" class="ti ti-player-pause"></i>
<i v-else-if="webhook.latestStatus === null" class="ph-circle ph-bold ph-lg"></i>
<i v-else-if="[200, 201, 204].includes(webhook.latestStatus)" class="ti ti-check" :style="{ color: 'var(--success)' }"></i>
<i v-else class="ti ti-alert-triangle" :style="{ color: 'var(--error)' }"></i>

2
packages/frontend/src/pages/user/index.listenbrainz.vue
View file

@ -24,7 +24,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</a>
<a :href="listenbrainz.listenbrainzurl">
<div class="playicon">
<i class="ph-play ph-bold ph-lg-filled"></i>
<i class="ph-play ph-bold ph-lg"></i>
</div>
</a>
</div>

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

@ -115,7 +115,7 @@ const headerTabs = computed(() => user.value ? [{
}, {
key: 'flashs',
title: 'Play',
icon: 'ph-play ph-bold ph-lg',
icon: 'ti ti-player-play',
}, {
key: 'gallery',
title: i18n.ts.gallery,

2
packages/frontend/src/ui/visitor.vue
View file

@ -54,7 +54,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkA to="/channels" class="link" activeClass="active"><i class="ti ti-device-tv icon"></i>{{ i18n.ts.channel }}</MkA>
<div class="divider"></div>
<MkA to="/pages" class="link" activeClass="active"><i class="ph-newspaper ph-bold ph-lg icon"></i>{{ i18n.ts.pages }}</MkA>
<MkA to="/play" class="link" activeClass="active"><i class="ph-play ph-bold ph-lg icon"></i>Play</MkA>
<MkA to="/play" class="link" activeClass="active"><i class="ti ti-player-play icon"></i>Play</MkA>
<MkA to="/gallery" class="link" activeClass="active"><i class="ph-images-square ph-bold ph-lgs icon"></i>{{ i18n.ts.gallery }}</MkA>
<div class="action">
<button class="_buttonPrimary" @click="signup()">{{ i18n.ts.signup }}</button>

9
packages/frontend/vite.config.ts
View file

@ -214,6 +214,15 @@ export function getConfig(): UserConfig {
'ti ti-search': 'ph-magnifying-glass ph-bold ph-lg',
'ti ti-external-link': 'ph-arrow-square-out ph-bold ph-lg',
'ti ti-music': 'ph-music-notes ph-bold ph-lg',
'ti ti-player-pause': 'ph-pause ph-bold ph-lg',
'ti ti-player-pause-filled': 'ph-pause ph-bold ph-lg',
'ti ti-player-play': 'ph-play ph-bold ph-lg',
'ti ti-player-play-filled': 'ph-play ph-bold ph-lg',
'ti ti-volume-3': 'ph-speaker-x ph-bold ph-lg',
'ti ti-volume': 'ph-speaker-high ph-bold ph-lg',
'ti ti-player-eject': 'ph-eject ph-bold ph-lg',
'ti ti-player-stop': 'ph-stop ph-bold ph-lg',
'ti ti-player-track-next': 'ph-skip-forward ph-bold ph-lg',
},
}),
...process.env.NODE_ENV === 'production'