nuxt-themes · Tahul · Jun 10, 2021 · Jun 9, 2021 · Jun 9, 2021
diff --git a/docs/components/icons/IconLighthouse.vue b/docs/components/icons/IconLighthouse.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg height="2500" viewBox="0 0 512 548.20728733" width="2500" xmlns="http://www.w3.org/2000/svg">
+  <svg height="64" viewBox="0 0 512 548.20728733" width="64" xmlns="http://www.w3.org/2000/svg">
     <g fill="none" fill-rule="evenodd">
       <circle cx="256" cy="256" fill="#0535c1" fill-rule="nonzero" r="256" />
       <path d="m311.273 116.364h151.272v151.272h-151.272z" />

diff --git a/docs/components/icons/IconMarkdown.vue b/docs/components/icons/IconMarkdown.vue
@@ -2,6 +2,7 @@
   <svg
     xmlns="http://www.w3.org/2000/svg"
     viewBox="0 0 26 26"
+    height="64"
     fill="currentColor"
     class="text-gray-900 dark:text-gray-100"
   >

diff --git a/docs/components/icons/IconPuzzle.vue b/docs/components/icons/IconPuzzle.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64" height="64">
     <path
       fill="#00DC82"
       d="M48,27v-5c0-2.761-2.239-5-5-5h-5c-1.105,0-2-0.895-2-2v-2c0-3.866-3.134-7-7-7h0 c-3.866,0-7,3.134-7,7v2c0,1.105-0.895,2-2,2h-5c-2.761,0-5,2.239-5,5v5c0,1.105,0.895,2,2,2h2c3.866,0,7,3.134,7,7v0 c0,3.866-3.134,7-7,7h-2c-1.105,0-2,0.895-2,2v5c0,2.761,2.239,5,5,5h28c2.761,0,5-2.239,5-5v-5c0-1.105,0.895-2,2-2h2 c3.866,0,7-3.134,7-7v0c0-3.866-3.134-7-7-7h-2C48.895,29,48,28.105,48,27z"

diff --git a/docs/components/icons/IconSSG.vue b/docs/components/icons/IconSSG.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px">
+  <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="64" height="64">
     <path
       d="M 10.5 6 C 10.3105 6 10.124082 6.0104805 9.9394531 6.0292969 C 9.571481 6.0667987 9.2141905 6.1413291 8.8710938 6.2480469 C 7.1472189 6.7842455 5.7842455 8.1472189 5.2480469 9.8710938 C 5.1413291 10.21419 5.0667987 10.571481 5.0292969 10.939453 C 5.0292305 10.940097 5.0293631 10.940762 5.0292969 10.941406 C 5.0106094 11.125412 5 11.311158 5 11.5 L 5 13.5 L 5 36.5 C 5 39.519774 7.4802259 42 10.5 42 L 37.5 42 C 40.519774 42 43 39.519774 43 36.5 L 43 13.5 L 43 11.5 C 43 11.310603 42.989737 11.124126 42.970703 10.939453 C 42.933201 10.571481 42.858671 10.21419 42.751953 9.8710938 C 42.215754 8.1472189 40.852781 6.7842455 39.128906 6.2480469 C 38.78581 6.1413291 38.428519 6.0667987 38.060547 6.0292969 C 38.059905 6.0292315 38.059235 6.029362 38.058594 6.0292969 C 37.874547 6.0103939 37.688736 6 37.5 6 L 10.5 6 z M 10.5 9 C 11.328 9 12 9.672 12 10.5 C 12 11.328 11.328 12 10.5 12 C 9.672 12 9 11.328 9 10.5 C 9 9.672 9.672 9 10.5 9 z M 15.5 9 C 16.328 9 17 9.672 17 10.5 C 17 11.328 16.328 12 15.5 12 C 14.672 12 14 11.328 14 10.5 C 14 9.672 14.672 9 15.5 9 z M 21.5 9 L 37.5 9 C 38.328 9 39 9.672 39 10.5 C 39 11.328 38.328 12 37.5 12 L 21.5 12 C 20.672 12 20 11.328 20 10.5 C 20 9.672 20.672 9 21.5 9 z M 8 15 L 40 15 L 40 32.945312 L 32.990234 26.140625 A 1.50015 1.50015 0 0 0 32.986328 26.136719 C 32.208181 25.38535 31.18685 25 30.173828 25 C 29.16122 25 28.13988 25.385387 27.361328 26.138672 L 25.3125 28.121094 L 19.132812 22.142578 C 18.35636 21.389748 17.336076 21 16.318359 21 C 15.299078 21 14.280986 21.392173 13.505859 22.140625 A 1.50015 1.50015 0 0 0 13.501953 22.144531 L 8 27.490234 L 8 15 z M 29 18 A 2 2 0 0 0 29 22 A 2 2 0 0 0 29 18 z M 16.318359 24 C 16.578643 24 16.835328 24.09366 17.044922 24.296875 A 1.50015 1.50015 0 0 0 17.046875 24.298828 L 23.154297 30.207031 L 14.064453 39 L 10.5 39 C 9.1017741 39 8 37.898226 8 36.5 L 8 31.671875 L 15.591797 24.294922 L 15.589844 24.298828 C 15.802758 24.093293 16.059641 24 16.318359 24 z M 30.173828 28 C 30.438806 28 30.692485 28.09229 30.902344 28.294922 L 39.933594 37.0625 C 39.683303 38.182061 38.703903 39 37.5 39 L 18.380859 39 L 29.447266 28.294922 C 29.654714 28.094207 29.910436 28 30.173828 28 z"
     />

diff --git a/docs/components/icons/IconVueTelescope.vue b/docs/components/icons/IconVueTelescope.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 96 96" fill="none">
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 96 96" fill="none" width="64" height="64">
     <path
       d="M35.2276 68.8623L43.5012 83.1926C45.5006 86.6558 50.4993 86.6558 52.4989 83.1926L83.3797 29.7053H57.8349L35.2276 68.8623Z"
       fill="currentColor"

diff --git a/docs/components/icons/IconZap.vue b/docs/components/icons/IconZap.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 48 48">
+  <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 48 48" width="64" height="64">
     <polygon
       fill="#ffae0b"
       points="16.828,5.828 29.966,5.828 25.172,19.414 33.966,19.414 18.621,43.138 21.034,26.379 12.828,26.379"

diff --git a/src/core/runtime/docus.ts b/src/core/runtime/docus.ts
@@ -21,15 +21,19 @@ export const createDocus = async (
   // Nuxt instance proxy
   let $nuxt: any
 
-  const { ssrContext } = context
+  const { ssrContext, nuxtState = {} } = context
+
+  // Prevent hydration mismatch: inject templateOptions from ssr payload before page load 
+  const templateOptions = nuxtState.data?.[0].templateOptions || {}
 
   // State
   const state = reactive({
     currentPage: null,
     settings: null,
     theme: null,
     layout: {
-      ...settings.layout
+      ...settings.layout,
+      ...templateOptions
     }
   }) as DocusState
 

diff --git a/src/defaultTheme/components/atoms/CodeGroup.vue b/src/defaultTheme/components/atoms/CodeGroup.vue
@@ -111,30 +111,39 @@ export default defineComponent({
 </script>
 
 <style scoped lang="postcss">
-button {
-  outline: none;
-}
-
 .code-group {
   @apply my-4;
 
-  & .docus-highlight:not(.active) {
-    display: none;
-  }
+  ::v-deep {
+    .docus-highlight:not(.active) {
+      display: none;
+    }
 
-  & .code-block:not(.active) {
-    display: none;
-  }
+    .code-block:not(.active) {
+      display: none;
+    }
+
+    .docus-highlight {
+      @apply mt-0;
+    }
 
-  >>> .docus-highlight {
-    @apply my-0;
+    // hide filename
+    pre[class*='language-'] {
+      @apply rounded-t-none mt-0;
+    }
   }
 }
 
+button {
+  outline: none;
+}
+
 .first-tab {
-  & > .code-block:nth-child(2),
-  & > .docus-highlight:nth-child(2) {
-    display: block;
+  ::v-deep {
+    .code-block:nth-child(2),
+    .docus-highlight:nth-child(2) {
+      display: block;
+    }
   }
 }
 
@@ -143,20 +152,4 @@ button {
   /* height: 2px; */
   transition: left 150ms, top 150ms, width 150ms, height 150ms;
 }
-
-.code-group ::v-deep {
-  & pre[class*='language-'] {
-    @apply rounded-t-none mt-0;
-  }
-  & > .prose > .docus-highlight .filename {
-    display: none;
-    & + pre[class*='language-'] {
-      @apply pt-3;
-    }
-  }
-}
-
-.docus-highlight {
-  margin: 0;
-}
 </style>