Merge pull request #14 from huankong233/main

packages/theme/src/client/components/AutoLink.vue

@@ -30,15 +30,9 @@ const linkTo = (e: Event) => {
 </script>
 
 <template>
-  <Component
-    :is="tag"
-    class="auto-link"
-    :class="{ link: href }"
-    :href="href ? normalizeLink(href) : undefined"
-    :target="target || (isExternal ? '_blank' : undefined)"
-    :rel="rel || (isExternal ? 'noreferrer' : undefined)"
-    @click="linkTo($event)"
-  >
+  <Component :is="tag" class="auto-link" :class="{ link: href }" :href="href ? normalizeLink(href) : undefined"
+    :target="target || (isExternal ? '_blank' : undefined)" :rel="rel || (isExternal ? 'noreferrer' : undefined)"
+    @click="linkTo($event)">
     <slot />
     <IconExternalLink v-if="isExternal && !noIcon" class="icon" />
   </Component>
@@ -58,5 +52,6 @@ const linkTo = (e: Event) => {
 .auto-link :deep(i) {
   font-style: normal;
   font-weight: inherit;
+  line-height: normal;
 }
 </style>

packages/theme/src/client/components/Flyout/index.vue

@@ -31,20 +31,9 @@ export default {
 </script>
 
 <template>
-  <div
-    ref="el"
-    class="flyout-wrapper"
-    @mouseenter="open = true"
-    @mouseleave="open = false"
-  >
-    <button
-      type="button"
-      class="button"
-      aria-haspopup="true"
-      :aria-expanded="open"
-      :aria-label="label"
-      @click="open = !open"
-    >
+  <div ref="el" class="flyout-wrapper" @mouseenter="open = true" @mouseleave="open = false">
+    <button type="button" class="button" aria-haspopup="true" :aria-expanded="open" :aria-label="label"
+      @click="open = !open">
       <span v-if="button || icon" class="text">
         <Icon v-if="prefixIcon" :name="prefixIcon" />
         <Component :is="icon" v-if="icon" class="option-icon" />
@@ -90,7 +79,7 @@ export default {
 }
 
 .flyout-wrapper:hover .menu,
-.button[aria-expanded='true'] + .menu {
+.button[aria-expanded='true']+.menu {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
@@ -108,7 +97,8 @@ export default {
 .text {
   display: flex;
   align-items: center;
-  line-height: var(--vp-nav-height);
+  /* line-height: var(--vp-nav-height); */
+  line-height: normal;
   font-size: 14px;
   font-weight: 500;
   color: var(--vp-c-text-1);

packages/theme/src/client/components/Home.vue

@@ -52,13 +52,7 @@ const actions = computed(() => {
         <p v-if="text" class="hero-text">{{ text }}</p>
         <div v-if="actions" class="actions">
           <div v-for="action in actions" :key="action.link" class="action">
-            <VButton
-              tag="a"
-              size="medium"
-              :theme="action.theme"
-              :text="action.text"
-              :href="action.link"
-            />
+            <VButton tag="a" size="medium" :theme="action.theme" :text="action.text" :href="action.link" />
           </div>
         </div>
       </div>
@@ -88,6 +82,7 @@ const actions = computed(() => {
 
 .plume-home .content {
   padding: 0 2rem;
+  width: 100%;
 }
 
 .plume-home .content .hero-name {
@@ -96,6 +91,7 @@ const actions = computed(() => {
   line-height: 1;
   color: var(--vp-c-text-hero-name);
 }
+
 .plume-home .content .hero-tagline {
   display: flex;
   align-items: center;
@@ -131,6 +127,7 @@ const actions = computed(() => {
     max-width: 768px;
     padding-top: 8rem;
   }
+
   .plume-home .content .hero-name {
     font-size: 100px;
   }