Merge pull request #5 from vuesence/feature/issue-2/gh-pages

feat: add GitHub pages standalone webapp version

.github/workflows/gp-deploy.yaml

@@ -0,0 +1,33 @@
+name: Build and Deploy
+on:
+  push:
+    # branches: [main]
+  workflow_dispatch:
+  # branches: [ "main", "development" ]
+permissions:
+  contents: write
+  # pages: write
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout 🛎️
+        uses: actions/checkout@v3
+
+      - uses: pnpm/action-setup@v2
+        name: Install pnpm
+        id: pnpm-install
+        with:
+          version: 8.5.0
+          run_install: false
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - run: pnpm build
+
+      - name: Deploy 🚀
+        uses: JamesIves/github-pages-deploy-action@v4
+        with:
+          folder: dist
+          branch: gh-pages

src/TimelineItemIssues.vue

@@ -50,7 +50,7 @@ function toggle(_tab: string) {
     </button>
   </div>
   <div class="issues" :class="[{ open: curTab !== '' }, curTab]">
-    <div v-if="curTab === 'desc'">
+    <div v-if="curTab === 'desc' && release.desc">
       <div class="issue" v-html="release.desc"></div>
     </div>
     <div v-if="curTab === 'pulls'">
@@ -137,19 +137,21 @@ a {
       border-color: var(--rt-c-border);
       margin-top: 5px;;
 
-      >>> a {
+      :deep(a) {
         color: var(--rt-c-brand-1);
         font-weight: 500;
         text-decoration: none;
       }
 
-      >>> p {
+      :deep(p) {
         margin: 1px 0 0 0;
-
         .left & {
           text-align: right;
         }
       }
+      .desc & :deep(p) {
+        margin-top: 8px;
+      }
     /* } */
   }
 }

src/UserBadge.vue

@@ -20,7 +20,7 @@ defineProps<{
   display: inline-flex;
   align-items: center;
   width: fit-content;
-  padding: 2px 4px 2px 3px;
+  padding: 2px 4px 2px 0px;
   font-weight: 500;
   font-size: .75rem;
   line-height: 1rem;

vite.config-lib.ts

@@ -0,0 +1,41 @@
+import path from "node:path";
+import { defineConfig } from "vite";
+import vue from "@vitejs/plugin-vue";
+import dts from "vite-plugin-dts";
+import postcssNesting from "postcss-nesting";
+
+const name = "index";
+
+export default defineConfig({
+  // base: "/release-timeline/",
+  plugins: [
+    vue(),
+    // dts({
+    //   include: "src",
+    // }),
+  ],
+  publicDir: false,
+  build: {
+    lib: {
+      entry: path.resolve(__dirname, "src/index.ts"),
+      name,
+      fileName: format => `${name}.${format}.${format === "es" ? "m" : ""}js`,
+    },
+    rollupOptions: {
+      external: ["vue"],
+      output: {
+        globals: {
+          vue: "Vue",
+        },
+      },
+    },
+  },
+  css: {
+    postcss: {
+      plugins: [postcssNesting],
+    },
+  },
+  // define: {
+  //   __DEV__: JSON.stringify(!process.env.prod),
+  // },
+});

vite.config.ts

@@ -1,40 +1,21 @@
-import path from "node:path";
 import { defineConfig } from "vite";
 import vue from "@vitejs/plugin-vue";
-import dts from "vite-plugin-dts";
 import postcssNesting from "postcss-nesting";
 
-const name = "index";
+// const name = "index";
 
 export default defineConfig({
+  base: "/release-timeline/",
   plugins: [
     vue(),
-    dts({
-      include: "src",
-    }),
   ],
   // publicDir: false,
   build: {
-    lib: {
-      entry: path.resolve(__dirname, "src/index.ts"),
-      name,
-      fileName: (format) => `${name}.${format}.${format === "es" ? "m" : ""}js`,
-    },
-    rollupOptions: {
-      external: ["vue"],
-      output: {
-        globals: {
-          vue: "Vue",
-        },
-      },
-    },
+    target: "esnext",
   },
   css: {
     postcss: {
       plugins: [postcssNesting],
     },
   },
-  define: {
-    __DEV__: JSON.stringify(!process.env.prod),
-  },
 });