Feat/sakana-widget

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2022 云游君
+Copyright (c) 2023 Flynn Cao
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,109 +1,31 @@
 <p align="center">
-Valaxy-Theme-Starter<sup><em>(vue)</em></sup>
+valaxy-theme-ginro<sup><em>(vue)</em></sup>
 </p>
 
-[![npm](https://img.shields.io/npm/v/valaxy-theme-starter)](https://www.npmjs.com/package/valaxy-theme-starter)
-[![npm dev dependency version](https://img.shields.io/npm/dependency-version/valaxy-theme-starter/dev/valaxy)](https://github.com/YunYouJun/valaxy)
-
-> This is a template for creating a [valaxy](https://github.com/YunYouJun/valaxy) theme.
+<!-- [![npm](https://img.shields.io/npm/v/valaxy-theme-ginro)](https://www.npmjs.com/package/valaxy-theme-ginro)
+[![npm dev dependency version](https://img.shields.io/npm/dependency-version/valaxy-theme-ginro/dev/valaxy)](https://github.com/YunYouJun/valaxy) -->
+
+This is my theme for [Valaxy](https://github.com/YunYouJun/Valaxy/)!
+## Design (To-do)
+- [ ] Color Theme 
+- [ ] Basic Layout
+- [ ] Navigator
+- [ ] Sidebar
+- [ ] Posts
+- [ ] Article
+- [ ] Additional rendering for page content
+- [ ] My Showcases!
+- [ ] Widgets.. and more
+## Features (To-do)
+- [x] [Sakana! Widget](https://github.com/dsrkafuu/sakana-widget) Support
 
 ## Usage
 
-### Clone to local
-
-> Use [pnpm](https://pnpm.io/), because we need its workspace.
-
-```bash
-npx degit YunYouJun/valaxy-theme-starter valaxy-theme-name
-
-cd valaxy-theme-name
-
-# If you don't have pnpm installed
-npm install -g pnpm
-
-pnpm i
-```
-
-### Development
-
-
-```bash
-# dev node
-pnpm dev
-# dev client
-pnpm demo
-```
-
-### Build
-
-```bash
-pnpm build
-```
-
-### Release
-
-> Publish to [npm](https://www.npmjs.com/).
-
-#### Manual
-
-```bash
-pnpm ci:publish
-```
-
-#### Auto by GitHub Actions
-
-> You can release it by github actions.
-
-Click `Settings` -> `Secrets` -> `Actions` in your GitHub repo.
-
-Add `New repository secret`:
-
-- `NPM_TOKEN`: `your npm token` (Generate from your npm `Access Tokens` - `Automation`)
-
-```bash
-npm run release
-# choose your version to automatic release
-```
-
-## Checklist
-
-- [ ] Change the author name in `LICENSE` & `package.json` & `.github`
-- [ ] Write `ThemeConfig` & Other init content
-- [ ] Rename `valaxy-theme-starter` to `valaxy-theme-<name>` (custom it)
-- [ ] Change `theme: 'starter'` to `theme: <name>` in `valaxy.config.ts`
-- [ ] Each of your Vue components should have a namespace
-  - For example: `YunTest.vue` for `valaxy-theme-yun`
-
-
-### About Checklist Rename
-
-Rename `valaxy-theme-starter` with `valaxy-theme-name` in the  `package.json` and `valaxy.config.ts` files.
-
-PS: there are a total of four files that need to be rename
-
-```bash
-valaxy-theme-name 
-  - package.json
-  - demo
-    - package.json
-    - valaxy.config.ts
-  - theme
-    - package.json
-```
-
-Let's write the theme & docs!
+This package is yet to publish~ 
 
 ## Thanks
 
-Starter theme ref theme:
+- [valaxy-starter-theme](https://github.com/valaxyjs/valaxy-theme-starter)
+### Sponsors
 
-- [vuejs/blog](https://github.com/vuejs/blog)
-- [tailwind-nextjs-starter-blog](https://github.com/timlrx/tailwind-nextjs-starter-blog)
-
-### [Sponsors](https://sponsors.yunyoujun.cn)
-
-<p align="center">
-  <a href="https://sponsors.yunyoujun.cn">
-    <img src='https://fastly.jsdelivr.net/gh/YunYouJun/sponsors/public/sponsors.svg'/>
-  </a>
-</p>
+To be continued.

demo/package.json

@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "valaxy": "^0.14.28",
-    "valaxy-theme-starter": "workspace:*"
+    "valaxy-theme-ginro": "workspace:*"
   },
   "devDependencies": {
     "nodemon": "^2.0.22",

demo/pages/posts/hello-valaxy.md

@@ -11,7 +11,7 @@ tags:
 ## Hello, Valaxy!
 
 ```ts
-import type { ThemeConfig } from 'valaxy-theme-starter'
+import type { ThemeConfig } from 'valaxy-theme-ginro'
 import { defineConfig } from 'valaxy'
 
 export default defineConfig<ThemeConfig>({

demo/valaxy.config.ts

@@ -1,12 +1,12 @@
 import { defineConfig } from 'valaxy'
-import type { ThemeConfig } from 'valaxy-theme-starter'
+import type { ThemeConfig } from 'valaxy-theme-ginro'
 
 /**
  * User Config
  * do not use export const config to avoid defu conflict
  */
 export default defineConfig<ThemeConfig>({
-  theme: 'starter',
+  theme: 'ginro',
 
   themeConfig: {
     // colors: {
@@ -35,5 +35,7 @@ export default defineConfig<ThemeConfig>({
     footer: {
       since: 2016,
     },
+
+    showSakanaWidget: true,
   },
 })

package.json

@@ -1,7 +1,7 @@
 {
   "private": true,
   "packageManager": "pnpm@8.4.0",
-  "homepage": "https://valaxy.site",
+  "homepage": "https://github.com/flynncao/valaxy-theme-ginro#README",
   "scripts": {
     "build": "npm run build:demo",
     "build:demo": "npm -C demo run build",
@@ -18,7 +18,7 @@
     "eslint": "^8.39.0",
     "typescript": "^4.9.5",
     "valaxy": "^0.14.28",
-    "valaxy-theme-starter": "workspace:*",
+    "valaxy-theme-ginro": "workspace:*",
     "vue-tsc": "^1.4.4"
   }
 }

theme/components/GinroSakana.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import SakanaWidget from 'sakana-widget'
+import { onMounted } from 'vue'
+
+const sakana = new SakanaWidget()
+onMounted(() => {
+  sakana.mount('#sakana-widget')
+})
+</script>
+
+<template>
+  <div id="sakana-widget" class="fixed right-12 bottom-8" />
+</template>
+
+<style lang="scss">
+@import 'sakana-widget/lib/index.css';
+</style>

theme/layouts/default.vue

@@ -1,4 +1,5 @@
 <template>
+  <ginro-sakana />
   <Layout>
     <router-view />
   </Layout>

theme/layouts/home.vue

@@ -2,7 +2,6 @@
   <Layout>
     <div class="divide-y divide-gray-200 dark:divide-gray-700">
       <StarterHeader />
-
       <slot>
         <router-view />
       </slot>

theme/layouts/layout.vue

@@ -1,3 +1,9 @@
+<script setup lang="ts">
+import { useThemeConfig } from '../composables/config';
+
+const { showSakanaWidget } = useThemeConfig().value
+</script>
+
 <template>
   <div class="antialiased">
     <div class="max-w-3xl mx-auto px-4 sm:px-6 xl:max-w-5xl xl:px-0">
@@ -42,6 +48,7 @@
     </main>
 
     <StarterHelper />
+    <ginro-sakana v-if="showSakanaWidget" />
 
     <StarterFooter>
       <slot name="footer" />

theme/node/index.ts

@@ -1,5 +1,5 @@
-import type { Plugin } from 'vite'
 import type { ResolvedValaxyOptions } from 'valaxy'
+import type { Plugin } from 'vite'
 import type { ThemeConfig } from '../types'
 
 /**
@@ -37,7 +37,7 @@ export function themePlugin(options: ResolvedValaxyOptions<ThemeConfig>): Plugin
   const themeConfig = options.config.themeConfig || {}
 
   return {
-    name: 'valaxy-theme-starter',
+    name: 'valaxy-theme-ginro',
 
     config() {
       return {

theme/package.json

@@ -1,30 +1,31 @@
 {
-  "name": "valaxy-theme-starter",
-  "version": "0.2.0",
-  "packageManager": "pnpm@7.5.0",
   "author": {
-    "email": "me@yunyoujun.cn",
-    "name": "YunYouJun",
-    "url": "https://www.yunyoujun.cn"
+    "email": "flynncao@yahoo.com",
+    "name": "Flynn Cao",
+    "url": "https://github.com/flynncao"
   },
-  "homepage": "https://starter.valaxy.site",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/YunYouJun/valaxy-theme-starter"
+  "dependencies": {
+    "@iconify-json/ant-design": "^1.1.5",
+    "@iconify-json/simple-icons": "^1.1.51",
+    "sakana-widget": "^2.6.0"
   },
+  "devDependencies": {
+    "valaxy": "^0.14.28"
+  },
+  "homepage": "https://starter.valaxy.site",
   "keywords": [
     "valaxy",
     "theme",
-    "starter",
+    "ginro",
     "vue"
   ],
   "main": "client/index.ts",
-  "types": "types/index.d.ts",
-  "dependencies": {
-    "@iconify-json/ant-design": "^1.1.5",
-    "@iconify-json/simple-icons": "^1.1.51"
+  "name": "valaxy-theme-ginro",
+  "packageManager": "pnpm@7.5.0",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/flynncao/valaxy-theme-ginro#README"
   },
-  "devDependencies": {
-    "valaxy": "^0.14.28"
-  }
+  "types": "types/index.d.ts",
+  "version": "0.0.2"
 }

theme/types/index.d.ts

@@ -62,6 +62,11 @@ export interface ThemeConfig {
    * navbar
    */
   nav: NavItem[]
+
+  /**
+   * widget 
+   */
+	showSakanaWidget: boolean
 }
 
 export interface NavItem {