feat: enhance code syntaxe

Author: LeadcodeDev

.astro/content-modules.mjs

@@ -1,14 +1,14 @@
 
 export default new Map([
 ["src/content/blog/welcome.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fblog%2Fwelcome.mdx&astroContentModuleFlag=true")],
-["src/content/docs/syntax/alert.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fsyntax%2Falert.mdx&astroContentModuleFlag=true")],
-["src/content/docs/syntax/code-block.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fsyntax%2Fcode-block.mdx&astroContentModuleFlag=true")],
-["src/content/docs/syntax/markdown.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fsyntax%2Fmarkdown.mdx&astroContentModuleFlag=true")],
-["src/content/docs/syntax/text.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fsyntax%2Ftext.mdx&astroContentModuleFlag=true")],
+["src/content/docs/framework/getting-started.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fframework%2Fgetting-started.mdx&astroContentModuleFlag=true")],
 ["src/content/docs/framework/blog.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fframework%2Fblog.mdx&astroContentModuleFlag=true")],
 ["src/content/docs/framework/configuration.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fframework%2Fconfiguration.mdx&astroContentModuleFlag=true")],
 ["src/content/docs/framework/docs.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fframework%2Fdocs.mdx&astroContentModuleFlag=true")],
-["src/content/docs/framework/getting-started.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fframework%2Fgetting-started.mdx&astroContentModuleFlag=true")],
+["src/content/docs/framework/project-structure.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fframework%2Fproject-structure.mdx&astroContentModuleFlag=true")],
 ["src/content/docs/framework/installation.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fframework%2Finstallation.mdx&astroContentModuleFlag=true")],
-["src/content/docs/framework/project-structure.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fframework%2Fproject-structure.mdx&astroContentModuleFlag=true")]]);
+["src/content/docs/syntax/alert.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fsyntax%2Falert.mdx&astroContentModuleFlag=true")],
+["src/content/docs/syntax/text.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fsyntax%2Ftext.mdx&astroContentModuleFlag=true")],
+["src/content/docs/syntax/code-block.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fsyntax%2Fcode-block.mdx&astroContentModuleFlag=true")],
+["src/content/docs/syntax/markdown.mdx", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Fsyntax%2Fmarkdown.mdx&astroContentModuleFlag=true")]]);
 

explainer.config.ts

@@ -50,11 +50,6 @@ export default defineExplainerConfig({
           description: 'Learn markdown syntax and markdown components.',
           href: '/docs/syntax/texts',
         },
-        {
-          label: 'Example',
-          description: 'Example documentation',
-          href: '/docs/example/welcome',
-        },
       ],
     },
     {

src/assets/css/markdown.css

@@ -245,14 +245,18 @@ h6 {
   padding-left: 1.5em;
 }
 
-html .prose .astro-code,
-html .prose .astro-code span:not(.highlighted, .highlighted-word, .diff) * {
+html:not(.dark) .prose .astro-code,
+html:not(.dark) .prose .astro-code span:not(.highlighted, .highlighted-word, .diff) * {
   background-color: var(--muted) !important;
 }
 
 html.dark .prose .astro-code,
-html.dark .prose .astro-code span:not(.highlighted, .highlighted-word, .diff) * {
+html.dark .prose .astro-code * {
   color: var(--shiki-dark) !important;
+}
+
+html.dark .prose .astro-code,
+html.dark .prose>.astro-code {
   background-color: var(--shiki-dark-bg) !important;
 }
 
@@ -313,7 +317,6 @@ html.dark .prose .astro-code span:not(.highlighted, .highlighted-word, .diff) *
   position: relative;
 
   &.highlighted {
-    background-color: var(--bg-highlight);
 
     &.error {
       background-color: rgba(244, 63, 94, .20);
@@ -340,18 +343,18 @@ html.dark .prose .astro-code span:not(.highlighted, .highlighted-word, .diff) *
 
   .highlighted-word {
     position: relative;
-    color: white;
+    z-index: 0;
     margin: 0 5px;
 
     &::before {
       content: "";
       position: absolute;
+      z-index: 0;
       left: -5px;
       top: -3px;
       bottom: -3px;
       right: -5px;
       border: 1px solid var(--color-border-tab);
-      background-color: var(--bg-highlight);
       border-radius: 0.25rem;
     }
   }