Merge pull request #553 from sboldyreva/claude/fix-code-block-display

Enable Prism highlighting and fix code-block display

Author: sboldyreva

docs/.vuepress/components/ELSSteps.vue

@@ -86,7 +86,7 @@
   margin: 0.5rem 0;
 }
 
-.els-steps-body :deep(code) {
+.els-steps-body :deep(:not(pre) > code) {
   font-size: 0.85rem;
 }
 </style>

docs/.vuepress/config-user/plugins.ts

@@ -1,9 +1,11 @@
 import {containerPlugin} from "@vuepress/plugin-container";
 import {ContainerPluginOptions} from "@vuepress/plugin-container/lib/node/containerPlugin";
 import { registerComponentsPlugin } from '@vuepress/plugin-register-components'
+import { prismjsPlugin } from '@vuepress/plugin-prismjs'
 import { path } from '@vuepress/utils'
 
 export default [
+    prismjsPlugin(),
     containerPlugin({
         type: 'warning',
         before: info => `<div class="warning custom-block"><p class="custom-block-title">${info}</p>`,

docs/.vuepress/styles/theme.styl

@@ -194,18 +194,99 @@ th, td
     .custom-layout
       padding-top 0
 
-.language-text
-  border-radius 6px
-  font-size 12px
-
-:not(.language-text) > code
+// Inline code only — explicitly exclude <pre><code> so Prism-highlighted
+// blocks keep their own color/background instead of inheriting dark-blue.
+:not(pre):not(.language-text) > code
   color: #1f3f5b
   padding: 0.25rem 0.5rem
   margin: 0
   font-size: .85em
   background-color: rgba(27,31,35,.05)
   border-radius: 3px
 
+// Dark code-block surface — shared by every language-* wrapper and the
+// fade mask below so the right-edge gradient blends in. Font-size matches
+// what .language-text used to set so bash/json/etc render at the same
+// size as the existing text blocks.
+:root
+  --code-bg-color: #2d2d2d
+
+div[class*="language-"]
+  background-color var(--code-bg-color)
+  border-radius 6px
+  font-size 12px
+
+div[class*="language-"] > pre
+  background-color transparent
+  color #ccc
+  padding 1rem
+
+div[class*="language-"] > pre > code
+  background-color transparent
+  color inherit
+  font-size inherit
+
+// One Dark token palette. Applied only inside code blocks so inline
+// <code> and inline highlighted text are unaffected.
+div[class*="language-"]
+  .token.comment,
+  .token.prolog,
+  .token.doctype,
+  .token.cdata
+    color #5c6370
+    font-style italic
+
+  .token.punctuation
+    color #ccc
+
+  .token.namespace
+    opacity .7
+
+  .token.property,
+  .token.tag,
+  .token.boolean,
+  .token.number,
+  .token.constant,
+  .token.symbol,
+  .token.deleted
+    color #d19a66
+
+  .token.selector,
+  .token.attr-name,
+  .token.string,
+  .token.char,
+  .token.builtin,
+  .token.inserted
+    color #98c379
+
+  .token.operator,
+  .token.entity,
+  .token.url,
+  .language-css .token.string,
+  .style .token.string
+    color #56b6c2
+
+  .token.atrule,
+  .token.attr-value,
+  .token.keyword
+    color #c678dd
+
+  .token.function,
+  .token.class-name
+    color #61afef
+
+  .token.regex,
+  .token.important,
+  .token.variable
+    color #e06c75
+
+  .token.important,
+  .token.bold
+    font-weight bold
+
+  .token.italic
+    font-style italic
+
 badge[type="warning"]
   display: inline-block
   padding: 0.2em 0.5em;

docs/enterprise-support-for-almalinux/README.md

@@ -635,15 +635,15 @@ TuxCare Technical Support is designed for enterprise clients with trained IT sta
 
 1. Technical Support ticketing system: [https://tuxcare.com/support-portal/](https://tuxcare.com/support-portal/)
 
-* Acceptance of requests 24 hours a day, 365 days a year
-* Unlimited number of tickets may be submitted
-* Customers will be supplied with instructions describing the use of the ticketing system during onboarding
-* User accounts will be created for each nominated user within each client organization
-* User accounts will have access to log, view and respond to tickets
+   * Acceptance of requests 24 hours a day, 365 days a year
+   * Unlimited number of tickets may be submitted
+   * Customers will be supplied with instructions describing the use of the ticketing system during onboarding
+   * User accounts will be created for each nominated user within each client organization
+   * User accounts will have access to log, view and respond to tickets
 
 2. Email: acceptance of requests 24 hours a day, 365 days a year:
 
-* New tickets may be created by simply emailing the support desk: [support@tuxcare.com](support@tuxcare.com)
+   * New tickets may be created by simply emailing the support desk: [support@tuxcare.com](support@tuxcare.com)
 
 :::warning
 If you are a user of our server product AMI's on AWS Marketplace, before you contact support, you should have your AWS accountId to hand, there are various ways to find it.