fix(git-changelog): mobile styles and locale types

packages/vitepress-plugin-git-changelog/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nolebase/vitepress-plugin-git-changelog",
   "type": "module",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "A VitePress plugin that adds a changelog fetched from git to your documentation.",
   "author": {
     "name": "Nólëbase",

packages/vitepress-plugin-git-changelog/src/client/components/Changelog.vue

@@ -51,7 +51,11 @@ const isFreshChange = computed(() => {
     rounded-lg p-4
   >
     <label cursor-pointer>
-      <div class="flex select-none items-center justify-between hover:text-$vp-c-brand-1" transition="color ease-in-out" duration-200>
+      <div
+        class="flex select-none items-center justify-between hover:text-$vp-c-brand-1"
+        transition="color ease-in-out"
+        text="<sm:xs" duration-200
+      >
         <span class="inline-flex items-center gap-3 text-$vp-custom-block-details-text">
           <span class="i-octicon:history-16" />
           <span v-if="commits[0]">
@@ -60,9 +64,6 @@ const isFreshChange = computed(() => {
         </span>
         <input v-model="toggleViewMore" type="checkbox" invisible appearance-none>
         <span class="inline-flex items-center gap-3 !font-400">
-          <span>
-            {{ t('viewMore') }}
-          </span>
           <svg
             class="i-octicon:chevron-down-16"
             :class="[
@@ -79,36 +80,41 @@ const isFreshChange = computed(() => {
         v-show="toggleViewMore"
         class="grid grid-cols-[30px_auto] mt-2 gap-1.5 children:my-auto -ml-1.5"
         transition="height ease-in-out" duration-200
+        text="<sm:xs"
       >
         <template v-for="(commit) of commits" :key="commit.hash">
           <template v-if="commit.tag">
             <div m="t-1" />
-            <div class="m-auto h-7 w-7 inline-flex rounded-full bg-gray-400/10 text-sm opacity-90">
+            <div class="m-auto h-7 w-7 inline-flex rounded-full bg-gray-400/10 text-sm opacity-90 <sm:text-xs">
               <div class="i-octicon:rocket-16" m="auto" />
             </div>
-            <div flex items-center>
+            <div flex items-center gap-1>
               <a :href="commit.release_tag_url" target="_blank">
-                <code class="!text-primary font-bold">{{ commit.tag }}</code>
+                <code class="font-bold">{{ commit.tag }}</code>
               </a>
-              &nbsp;
               <span class="text-xs opacity-50">
                 {{ t('committedOn', { props: { date: new Date(commit.date).toLocaleDateString() } }) }}
               </span>
             </div>
           </template>
           <template v-else>
             <div class="i-octicon:git-commit-16 m-auto rotate-90 transform opacity-30" />
-            <div flex items-center>
+            <div flex items-center gap-1>
               <a :href="`${commit.repo_url}/commit/${commit.hash}`" target="_blank">
-                <code class="!text-xs !text-$vp-c-brand-1 !hover:text-$vp-c-brand-1" transition="color ease-in-out" duration-200>{{ commit.hash.slice(0, 5) }}</code>
+                <code
+                  class="text-xs text-$vp-c-brand-1 hover:text-$vp-c-brand-1"
+                  transition="color ease-in-out"
+                  duration-200
+                >
+                  {{ commit.hash.slice(0, 5) }}
+                </code>
               </a>
-              <span text="sm">
-                -
+              <span>-</span>
+              <span>
                 <span v-html="renderCommitMessage(commit.repo_url || 'https://github.com/example/example', commit.message)" />
-              </span>
-              &nbsp;
-              <span class="text-xs opacity-50">
-                {{ t('committedOn', { props: { date: new Date(commit.date).toLocaleDateString() } }) }}
+                <span class="text-xs opacity-50">
+                  {{ t('committedOn', { props: { date: new Date(commit.date).toLocaleDateString() } }) }}
+                </span>
               </span>
             </div>
           </template>

packages/vitepress-plugin-git-changelog/src/client/locales.ts

@@ -2,14 +2,12 @@ import type { Locale } from './types'
 
 export const defaultEnLocale: Locale = {
   noLogs: 'No recent changes',
-  viewMore: 'View more',
-  lastEdited: 'This page was last edited {{daysAgo}}',
+  lastEdited: 'Last edited {{daysAgo}}',
   committedOn: ' on {{date}}',
 }
 
 export const defaultZhCNLocale: Locale = {
   noLogs: '暂无最近变更历史',
-  viewMore: '查看更多',
-  lastEdited: '此文档最后编辑于 {{daysAgo}}',
+  lastEdited: '最后编辑于 {{daysAgo}}',
   committedOn: ' 于 {{date}}',
 }

packages/vitepress-plugin-git-changelog/src/client/types.ts

@@ -1,5 +1,7 @@
 export interface Locale {
-
+  noLogs?: string
+  lastEdited?: string
+  committedOn?: string
 }
 
 export interface Options {
@@ -18,13 +20,11 @@ export interface Options {
    *  locales: {
    *    'en': {
    *      noLogs: 'No recent changes',
-   *      viewMore: 'View more',
    *      lastEdited: 'This page was last edited {{daysAgo}}',
    *      committedOn: ' on {{date}}',
    *    },
    *    'zh-CN': {
    *      noLogs: '暂无最近变更历史',
-   *      viewMore: '查看更多',
    *      lastEdited: '本页面最后编辑于 {{daysAgo}}',
    *      committedOn: '于 {{date}} 提交',
    *     },