add footer config

This commit is contained in:
Bnyro 2022-09-09 20:13:56 +02:00 committed by Kavin
parent 8273b6f999
commit 88e0c60be0
No known key found for this signature in database
GPG key ID: 49451E4482CC5BCD
5 changed files with 76 additions and 11 deletions

4
public/config.json Normal file
View file

@ -0,0 +1,4 @@
{
"donation_href": " ",
"status_page_href": " "
}

View file

@ -1,29 +1,24 @@
<template>
<div class="w-full min-h-screen px-1vw reset" :class="[theme]">
<NavBar />
<router-view v-slot="{ Component }">
<keep-alive :max="5">
<component :is="Component" :key="$route.fullPath" />
</keep-alive>
</router-view>
<footer class="text-center my-2">
<a aria-label="GitHub" href="https://github.com/TeamPiped/Piped">
<font-awesome-icon :icon="['fab', 'github']" />
</a>
<a class="ml-2" href="https://github.com/TeamPiped/Piped#donations">
<font-awesome-icon :icon="['fab', 'bitcoin']" />
<span class="ml-1" v-t="'actions.donations'" />
</a>
</footer>
<FooterComponent />
</div>
</template>
<script>
import NavBar from "./components/NavBar.vue";
import FooterComponent from "./components/FooterComponent.vue";
export default {
components: {
NavBar,
FooterComponent,
},
mounted() {
if (this.getPreferenceBoolean("watchHistory", false))

View file

@ -0,0 +1,56 @@
<template>
<footer class="text-center py-4 rounded-xl children:(mx-3) w-full mt-10 mb-5">
<a aria-label="GitHub" href="https://github.com/TeamPiped/Piped" target="_blank">
<font-awesome-icon :icon="['fab', 'github']" />
<span class="ml-2" v-t="'actions.source_code'" />
</a>
<a href="https://piped-docs.kavin.rocks/" target="_blank">
<font-awesome-icon :icon="['fa', 'book']" />
<span class="ml-2" v-t="'actions.documentation'" />
</a>
<a href="https://github.com/TeamPiped/Piped#donations" target="_blank">
<font-awesome-icon :icon="['fab', 'bitcoin']" />
<span class="ml-2" v-t="'actions.donations'" />
</a>
<a v-if="statusPageHref" :href="statusPageHref">
<font-awesome-icon :icon="['fa', 'server']" />
<span class="ml-2" v-t="'actions.status_page'" />
</a>
<a v-if="donationHref" :href="donationHref">
<font-awesome-icon :icon="['fa', 'donate']" />
<span class="ml-2" v-t="'actions.instance_donations'" />
</a>
</footer>
</template>
<script>
export default {
data() {
return {
donationHref: null,
statusPageHref: null,
};
},
mounted() {
this.fetchConfig();
},
methods: {
async fetchConfig() {
fetch("config.json").then(async response => {
const config = await response.json();
this.donationHref = config.donation_href;
this.statusPageHref = config.status_page_href;
});
},
},
};
</script>
<style scoped>
footer {
@apply bg-light-900;
}
.dark footer {
@apply bg-dark-800;
}
</style>

View file

@ -61,7 +61,7 @@
"import_from_json": "Import from JSON/CSV",
"loop_this_video": "Loop this Video",
"auto_play_next_video": "Auto Play next Video",
"donations": "Donations",
"donations": "Development donations",
"minimize_description": "Minimize Description",
"show_description": "Show Description",
"minimize_recommendations": "Minimize Recommendations",
@ -108,7 +108,11 @@
"time_code": "Time code (in seconds)",
"show_chapters": "Chapters",
"store_search_history": "Store Search history",
"hide_watched": "Hide watched videos in the feed"
"hide_watched": "Hide watched videos in the feed",
"documentation": "Documentation",
"status_page": "Status",
"source_code": "Source code",
"instance_donations": "Instance donations"
},
"comment": {
"pinned_by": "Pinned by",

View file

@ -17,6 +17,9 @@ import {
faXmark,
faClone,
faShare,
faBook,
faServer,
faDonate,
} from "@fortawesome/free-solid-svg-icons";
import { faGithub, faBitcoin } from "@fortawesome/free-brands-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
@ -39,6 +42,9 @@ library.add(
faXmark,
faClone,
faShare,
faBook,
faServer,
faDonate,
);
import router from "@/router/router.js";