fix(playground): fix github button style (#7722)

* fix(playground): fix github button style * style: merge selector * Update Header.vue --------- Co-authored-by: GU Yiling <justice360@gmail.com>
vuejs · Jul 9, 2023 · 5ee992c · 5ee992c
1 parent 516fabb
commit 5ee992c
Showing 1 changed file with 11 additions and 10 deletions.
diff --git a/packages/sfc-playground/src/Header.vue b/packages/sfc-playground/src/Header.vue
@@ -161,14 +161,14 @@ async function fetchVersions(): Promise<string[]> {
  >
  <Download />
  </button>
- <button title="View on GitHub" class="github">
- <a
-  href="https://github.com/vuejs/core/tree/main/packages/sfc-playground"
-  target="_blank"
- >
-  <GitHub />
- </a>
- </button>
+ <a
+ href="https://github.com/vuejs/core/tree/main/packages/sfc-playground"
+ target="_blank"
+ title="View on GitHub"
+ class="github"
+ >
+ <GitHub />
+ </a>
  </div>
  </nav>
 </template>
@@ -302,12 +302,13 @@ h1 img {
 }
 
 .links button,
-.links button a {
+.links .github {
+ padding: 1px 6px;
  color: var(--btn);
 }
 
 .links button:hover,
-.links button:hover a {
+.links .github:hover {
  color: var(--highlight);
 }