diff --git a/src/css/docsearch.css b/src/css/docsearch.css
index 79a2f4611c..a43f3e1832 100644
--- a/src/css/docsearch.css
+++ b/src/css/docsearch.css
@@ -14,6 +14,11 @@
   color: rgb(49, 130, 206) !important;
 }
 
+.DocSearch-Cancel {
+  --docsearch-highlight-color: var(--ifm-font-color-base);
+  margin: auto 0;
+}
+
 .DocSearch-HitsFooter > a {
   display: none;
 }
diff --git a/src/css/theming.css b/src/css/theming.css
index c5b693dcfd..f6b2f97d4b 100644
--- a/src/css/theming.css
+++ b/src/css/theming.css
@@ -193,7 +193,7 @@ html[data-theme="dark"] {
   --orm-card-bg: var(--gray-900);
   --grid-border-color: var(--gray-700);
   --community-bgd-color: var(--gray-900);
-  --shadow-card-bg: var(--gray-900);
+  --shadow-card-bg: var(--gray-1000);
   --badge-color: rgb(247, 250, 252);
   --badge-bg-color: rgb(45, 55, 72);
   --ifm-card-background-color: var(--gray-900);
@@ -206,7 +206,7 @@ html[data-theme="dark"] {
   --selection-bgd-color: #0c344b;
   --white-color: #ffffff;
   --link-color: #3182ce;
-  --code-bgd-color: #2d3748;
+  --code-bgd-color: #1A202C;
   --code-inline-bgd-color: #2d3748;
   --list-bullet-color: #a0aec0;
   --search-highlight-bg-color: #ebf8ff;
@@ -410,7 +410,7 @@ html[data-theme="dark"] {
     --orm-card-bg: var(--gray-900);
     --grid-border-color: var(--gray-700);
     --community-bgd-color: var(--gray-900);
-    --shadow-card-bg: var(--gray-900);
+    --shadow-card-bg: var(--gray-1000);
     --badge-color: rgb(247, 250, 252);
     --badge-bg-color: rgb(45, 55, 72);
     --code-bg: #1a202c;
@@ -423,7 +423,7 @@ html[data-theme="dark"] {
     --white-color: #ffffff;
     --link-color: #3182ce;
     --ifm-link-hover-color: #5196d7;
-    --code-bgd-color: #2d3748;
+    --code-bgd-color: #1A202C;
     --code-inline-bgd-color: #2d3748;
     --list-bullet-color: #a0aec0;
     --search-highlight-bg-color: #ebf8ff;
diff --git a/src/theme/MDXComponents.tsx b/src/theme/MDXComponents.tsx
index 65a5d8ce48..3bc540972e 100644
--- a/src/theme/MDXComponents.tsx
+++ b/src/theme/MDXComponents.tsx
@@ -44,9 +44,10 @@ const TopBlock: React.FC<React.PropsWithChildren> = ({
 const CodeWithResult: React.FC<{ children: React.ReactElement[] }> = ({
   children,
   outputResultText,
+  expanded = false,
   ...rest
 }: any) => {
-  const [show, setShow] = useState<boolean>(false);
+  const [show, setShow] = useState<boolean>(expanded);
   return (
     <div className={styles.codeWithResult} {...rest}>
       <div className={styles.cmd}>{children[0]}</div>