Auth secrets tools (#487)

* initial stab at rejiggering first authoring page.

* adds note component to MDX

* style terminal to look like terminal

* Enhancing codeblocks

* fix syntax highlighting

* remove duplicate copy button from code blocks

* breaking down the transport commands

* breaking down the transport commands

* update the first page of Build Tools

* adds overview

* ok, final tweak

* updating types

* fixing linting warnings

* update Tool Context page

* updating the tool pages

* fix borked copy button by returning to Nextra's default

* use Callout not Note

* Update app/en/home/build-tools/create-a-mcp-server/page.mdx

Co-authored-by: Mateo Torres <[email protected]>

* Update app/en/home/build-tools/create-a-mcp-server/page.mdx

Co-authored-by: vfanelle <[email protected]>

* updating the tool-context

* removing uv recommended

* Using Arcade Engine

* fixing escaped underscore

* fixing up the codeblocks a bit

* completing the tool-with-auth page

* correcting merge

* adds the Create a Tool with Secrets page

* Update app/en/home/build-tools/create-a-tool-with-auth/page.mdx

Co-authored-by: Mateo Torres <[email protected]>

* Update app/en/home/build-tools/create-a-tool-with-secrets/page.mdx

Co-authored-by: Mateo Torres <[email protected]>

* Update app/en/home/build-tools/create-a-tool-with-secrets/page.mdx

Co-authored-by: Mateo Torres <[email protected]>

* updating the instructions to include exporting local variables

* removing broken deep links

* fix dem links

---------

Co-authored-by: Rachel Lee Nabors <[email protected]>
Co-authored-by: Mateo Torres <[email protected]>
Co-authored-by: vfanelle <[email protected]>

Author: 3 people

app/_components/custom-pre.tsx

@@ -87,7 +87,7 @@ const CustomPre: React.FC<CustomPreProps> = ({
           {/* Code content with syntax highlighting preserved */}
           <div className="overflow-x-auto">
             <Pre
-              className={`p-4 text-gray-100 text-sm ${className || ""}`}
+              className={`text-gray-100 text-sm ${className || ""}`}
               style={{ margin: 0, borderRadius: 0, background: "transparent" }}
               {...props}
             >
@@ -113,7 +113,7 @@ const CustomPre: React.FC<CustomPreProps> = ({
         {/* Code content with syntax highlighting preserved */}
         <div className="overflow-x-auto">
           <Pre
-            className={`bg-white p-4 text-sm dark:bg-gray-950 ${className || ""}`}
+            className={`bg-white text-sm dark:bg-gray-950 ${className || ""}`}
             style={{ margin: 0, borderRadius: 0 }}
             {...props}
           >

app/_components/enhanced-code-block.tsx

@@ -90,7 +90,7 @@ const EnhancedCodeBlock: React.FC<EnhancedCodeBlockProps> = ({
 
       {/* Code Content */}
       <div className="overflow-x-auto">
-        <pre className={`bg-white p-4 text-sm dark:bg-gray-950 ${className}`}>
+        <pre className={`bg-white text-sm dark:bg-gray-950 ${className}`}>
           <code>{children}</code>
         </pre>
       </div>

app/_components/terminal-code-block.tsx

@@ -55,7 +55,7 @@ const TerminalCodeBlock: React.FC<TerminalCodeBlockProps> = ({
 
       {/* Code Content */}
       <div className="overflow-x-auto">
-        <pre className={`p-4 text-gray-100 text-sm ${className}`}>
+        <pre className={`text-gray-100 text-sm ${className}`}>
           <code>{children}</code>
         </pre>
       </div>