docs: add buy me a coffee

Author: phphe

packages/docs-site/docs/config.ts

@@ -8,6 +8,7 @@ export default {
  ANALYTICS_ID: 'G-L74NT4DL5X',
  ORIGIN_PROD: 'https://hetree.phphe.com', // production host name
  GIT_NAME: 'phphe/he-tree',
+ DONATE_URL: 'https://www.paypal.com/paypalme/phphe',
  VERSION: '2.x',
  MENU: [
  {

packages/docs-site/src/assets/img/coffee.jpg

@@ -34,6 +34,9 @@
  .shadow.rounded.text-sm
  Anchor.block.py-2.px-3(v-for="item in versions" class="hover:bg-gray-100" :to="item.homePath") {{$t(item.version)}}
  Anchor.main-menu-item(:to="githubURL" v-if="githubURL") Github
+ Anchor.main-menu-item.buy-me-coffee(v-if="DONATE_URL" :to="DONATE_URL")
+ img(alt="Buy me a coffee" :src="coffeeImg")
+ span Buy me a coffee
  //- Anchor.main-menu-item(v-if="config.IS_DEVLOPMENT" @click="reloadRouteView()") Reload Route
  //- .flex-shrink-0.py-2.text-center
  .main-right.flex-grow.overflow-auto.relative()
@@ -69,6 +72,7 @@ import SearchModal from '../parts/SearchModal.vue'
 import { mdiMenu, mdiSearch } from 'mdi-js/filled'
 import { useRouter } from 'vue-router'
 import GithubButton from 'vue-github-button'
+import coffeeImg from "../assets/img/coffee.jpg";
 
 export default defineComponent({
  components: { DocsMenuItem, SearchModal, GithubButton },
@@ -90,6 +94,8 @@ export default defineComponent({
  version,
  homeUrl,
  githubURL,
+ DONATE_URL: config.DONATE_URL,
+ coffeeImg,
  }
  },
  data() {
@@ -143,4 +149,15 @@ export default defineComponent({
 .main-search-icon {
  align-self: flex-end;
 }
+
+.buy-me-coffee {
+ color: #2a2a2a;
+ background-color: #e4d7c5;
+ @apply flex items-center;
+
+ img {
+ width: 50px;
+ margin-right: 10px;
+ }
+}
 </style>