add code file titles and tooltip

Author: hughescoin

docs/base-chain/quickstart/builder-codes.mdx

@@ -23,14 +23,16 @@ Once your app is registered on [Base.dev](http://base.dev/), the Base App will a
 
 When you register on [base.dev](https://base.dev/), you will receive a **Builder Code**—a random string (e.g., `bc_b7k3p9da` ) that you'll use to generate your attribution suffix. 
 
-You can find your code anytime under **Settings** → **Builder Code**.
+<Tip>
+  You can find your code anytime under **Settings** → **Builder Code**.
+</Tip>
 
 <Steps>
   <Step title="Install the Standard Library for Ethereum">
 
 This will allow you to append the encoded version of your builder code.
 
-    ```bash
+    ```bash Terminal
     npm i ox
     ```
   </Step>
@@ -42,7 +44,7 @@ This will allow you to append the encoded version of your builder code.
   <Step title="Create the Encoded Data Suffix">
     Use the `Attribution.toDataSuffix` method from the `ox` library to encode your builder code:
 
-    ```ts
+    ```ts App.tsx
     import { Attribution } from "ox/erc8021";
 
     const DATA_SUFFIX = Attribution.toDataSuffix({
@@ -54,7 +56,7 @@ This will allow you to append the encoded version of your builder code.
   <Step title="Send transaction using the dataSuffix capability">
     Use Wagmi's `useSendCalls` hook with the `dataSuffix` capability to append attribution data to your transactions.
 
-    ```ts
+    ```ts App.tsx
     import { useSendCalls } from "wagmi";
     import { parseEther } from "viem";
     import { Attribution } from "ox/erc8021";