Add OpenSponsorship

package.json

@@ -13,6 +13,7 @@
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.5.1",
     "@fortawesome/free-brands-svg-icons": "^6.5.1",
+    "@fortawesome/free-solid-svg-icons": "^6.5.1",
     "@fortawesome/vue-fontawesome": "^3.0.6",
     "@vitejs/plugin-vue": "^5.0.4",
     "vite": "^5.1.1",

src/App.vue

@@ -6,21 +6,24 @@ import {
   faWikipediaW,
   faDiscord
 } from '@fortawesome/free-brands-svg-icons'
+import {faHandHoldingHeart} from '@fortawesome/free-solid-svg-icons'
 
 import ProjectInfo from './components/ProjectInfo.vue'
 
 import OpenDiscord from './components/Open/OpenDiscord.vue'
 import OpenGitHub from './components/Open/OpenGitHub.vue'
 import OpenWiki from './components/Open/OpenWiki.vue'
+import OpenSponsorship from './components/Open/OpenSponsorship.vue'
 
 import HelloWorld from './components/HelloWorld.vue'
 import TheWelcome from './components/TheWelcome.vue'
 import SocialMediaLinks from './components/SocialMediaLinks.vue'
 
 library.add(
+  faDiscord,
   faGithub,
   faWikipediaW,
-  faDiscord
+  faHandHoldingHeart
 )
 </script>
 
@@ -67,6 +70,7 @@ library.add(
       <OpenDiscord />
       <OpenGitHub />
       <OpenWiki />
+      <OpenSponsorship />
     </div>
     <!-- <SocialMediaLinks title='@hrwebdevelopers' description='We build blazing-fast, beautiful websites for startups, small businesses and enterprises.' /> -->
   </main>

src/components/Open/OpenSponsorship.vue

@@ -0,0 +1,8 @@
+<script setup>
+import OpenURL from './OpenURL2.vue'
+import ProjectInfo from './../ProjectInfo.vue'
+</script>
+
+<template>
+  <OpenURL :url='`https://donate.qiwi.com/payin/${ProjectInfo.sponsorship}/`' icon='hand-holding-heart' />
+</template>

src/components/Open/OpenURL2.vue

@@ -0,0 +1,12 @@
+<script setup>
+defineProps({
+  url:  {type: String, required: true},
+  icon: {type: String, required: true}
+})
+</script>
+
+<template>
+  <a :href='`${url}`' target="_blank" rel="noreferrer">
+    <font-awesome-icon :icon="['fas', `${icon}`]" />
+  </a>
+</template>

src/components/ProjectInfo.vue

@@ -2,7 +2,8 @@
 export default {
   name: 'Proxima',
   discord: '4EDMR24r9m',
-  wiki: 'wiki.proxima.fun',
   github: 'Proxima-Project',
+  wiki: 'wiki.proxima.fun',
+  sponsorship: 'Phoenix404'
 };
 </script>