Refactor notes to use Tip components in MCP docs (#1800)

Author: gary149

docs/hub/spaces-mcp-servers.md

@@ -4,11 +4,14 @@ You can **expose any public Space that has a visible `MCP` badge into a callable
 
 ## Setup your MCP Client
 
-From your [Hub MCP settings](https://huggingface.co/settings/mcp), select your MCP client (VSCode, Cursor, Claude Code, ...) then follow the setup instructions. 
+From your [Hub MCP settings](https://huggingface.co/settings/mcp), select your MCP client (VSCode, Cursor, Claude Code, etc.) then follow the setup instructions. 
 
 ![image/png](https://cdn-uploads.huggingface.co/production/uploads/5f17f0a0925b9863e28ad517/wWm_GeuWF17OrMyJT4tMx.png)
 
-> **Important:** You need a valid Hugging Face token with **READ** permissions to use MCP tools. If you don't have one, [create a new "Read" access token here](https://huggingface.co/settings/tokens/new?tokenType=read).
+
+<Tip warning={true}>
+You need a valid Hugging Face token with <strong>READ</strong> permissions to use MCP tools. If you don't have one, <a href="https://huggingface.co/settings/tokens/new?tokenType=read" target="_blank">create a new "Read" access token here</a>.
+</Tip>
 
 ## Add an existing Space to your MCP tools
 
@@ -25,7 +28,9 @@ From your [Hub MCP settings](https://huggingface.co/settings/mcp), select your M
 
 If your MCP client is configured correctly, the Spaces you added will be available instantly without changing anything (if it doesn't restart your client and it should appear). Most MCP clients will list what tools are currently loaded so you can make sure the Space is available.
 
-> **Note:** For ZeroGPU Spaces, your quota will be used when the tool is called, if you run out of quota you can [subscribe to PRO](https://huggingface.co/subscribe/pro?from=ZeroGPU) to get 25 minutes of daily quota (x8 more quota than free users). For example your PRO account lets you generate up to 600 images per day using FLUX.1-schnell.
+<Tip>
+For ZeroGPU Spaces, your quota will be used when the tool is called, if you run out of quota you can <a href="https://huggingface.co/subscribe/pro?from=ZeroGPU" target="_blank">subscribe to PRO</a> to get 25 minutes of daily quota (x8 more quota than free users). For example your PRO account lets you generate up to 600 images per day using FLUX.1-schnell.
+</Tip>
 
 ## Build your own MCP-compatible Gradio Space
 
@@ -62,7 +67,9 @@ demo.launch(mcp_server=True)   # exposes an MCP schema automatically
 
 Push the app to a **Gradio Space** and it will automatically receive the **MCP** badge. Anyone can then add it as a tool with a single click.
 
-> **Note:** It's also quite easy to convert an existing Gradio Space to MCP server. Duplicate it from the context menu then just add the `mcp_server=True` parameter to your `launch()` method, and ensure your functions have clear type hints and docstrings - you can use AI tools to automate this quite easily ([example](https://huggingface.co/spaces/Lightricks/ltx-video-distilled/discussions/22/files) of AI generated docstrings).
+<Tip>
+It's also quite easy to convert an existing Gradio Space to MCP server. Duplicate it from the context menu then just add the <code>mcp_server=True</code> parameter to your <code>launch()</code> method, and ensure your functions have clear type hints and docstrings - you can use AI tools to automate this quite easily (<a href="https://huggingface.co/spaces/Lightricks/ltx-video-distilled/discussions/22/files" target="_blank">example</a> of AI generated docstrings).
+</Tip>
 
 ## Be creative by mixing Spaces!