update CodeBlock highlighting v1

Author: nolannbiron

packages/gitbook/src/components/DocumentView/CodeBlock/CodeBlockRenderer.tsx

@@ -34,7 +34,7 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
         <div ref={ref} className={tcls('group/codeblock grid grid-flow-col', style)}>
             <div className="flex items-center justify-start [grid-area:1/1] text-sm gap-2">
                 {title ? (
-                    <div className="text-xs tracking-wide text-tint leading-none inline-flex items-center justify-center bg-tint rounded-t straight-corners:rounded-t-s px-3 py-2">
+                    <div className="text-xs tracking-wide text-tint leading-none inline-flex items-center justify-center bg-tint-2 rounded-t straight-corners:rounded-t-s px-3 py-2">
                         {title}
                     </div>
                 ) : null}
@@ -45,7 +45,7 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
             />
             <pre
                 className={tcls(
-                    '[grid-area:2/1] relative overflow-auto bg-tint theme-gradient:bg-tint-12/1 ring-tint-subtle hide-scroll',
+                    '[grid-area:2/1] relative overflow-auto bg-tint-2 theme-gradient:bg-tint-12/1 ring-tint-subtle hide-scroll',
                     'rounded-md straight-corners:rounded-sm',
                     title && 'rounded-ss-none',
                 )}

packages/gitbook/src/components/DocumentView/CodeBlock/theme.css

@@ -1,13 +1,13 @@
 :root {
     --shiki-color-text: theme('colors.tint.11');
-    --shiki-token-constant: #0a6355;
-    --shiki-token-string: #8b6d32;
+    --shiki-token-constant: #22863a;
+    --shiki-token-string: theme('colors.primary.12');
     --shiki-token-comment: theme('colors.teal.700/.64');
-    --shiki-token-keyword: theme('colors.pomegranate.600');
+    --shiki-token-keyword: theme('colors.contrast-primary.1');
     --shiki-token-parameter: #0a3069;
     --shiki-token-function: #8250df;
-    --shiki-token-string-expression: #6a4906;
-    --shiki-token-punctuation: theme('colors.pomegranate.700/.92');
+    --shiki-token-string-expression: theme('colors.primary.9');
+    --shiki-token-punctuation: theme('colors.contrast-primary.1');
     --shiki-token-link: theme('colors.tint.12');
     --shiki-token-inserted: #22863a;
     --shiki-token-deleted: #b31d28;

packages/gitbook/src/components/DocumentView/OpenAPI/style.css

@@ -381,7 +381,7 @@
 
 /* Code Sample */
 .openapi-codesample {
-    @apply border rounded bg-tint border-tint-subtle;
+    @apply border rounded bg-tint-2 border-tint-subtle;
 }
 
 .openapi-codesample-header {
@@ -424,7 +424,7 @@
 } */
 
 .openapi-path-title em {
-    @apply not-italic text-primary font-medium;
+    @apply not-italic text-primary-subtle font-medium;
 }
 
 .openapi-path-separator {
@@ -437,7 +437,7 @@
 
 /* Response Example */
 .openapi-response-example {
-    @apply border rounded bg-tint border-tint-subtle;
+    @apply border rounded bg-tint-2 border-tint-subtle;
 }
 
 .openapi-response-example-empty {
@@ -506,11 +506,11 @@
 }
 
 .openapi-tabs-tab {
-    @apply hover:bg-primary-hover whitespace-nowrap font-mono font-normal tabular-nums hover:text-primary cursor-pointer transition-all relative text-[0.813rem] text-tint px-1 border border-transparent rounded;
+    @apply hover:bg-primary-hover whitespace-nowrap font-mono font-normal tabular-nums hover:text-primary-subtle cursor-pointer transition-all relative text-[0.813rem] text-tint px-1 border border-transparent rounded;
 }
 
 .openapi-tabs-tab[aria-selected='true'] {
-    @apply text-primary after:absolute after:-bottom-2 after:left-0 after:w-full after:h-px after:bg-primary-solid after:transition-all;
+    @apply text-primary-subtle after:absolute after:-bottom-2 after:left-0 after:w-full after:h-px after:bg-primary-solid after:transition-all;
 }
 
 .openapi-tabs-panel {