Update blog post with local images and Markdown support

requirements.txt

@@ -22,6 +22,7 @@ transformers==4.43.3
 webrtcvad==2.0.10
 Pillow==10.4.0
 urllib3==2.0.7
+itsdangerous
 protobuf==3.19.6
 fastapi-users[sqlalchemy]>=13.0.0
 sqlalchemy>=2.0.0

templates/about.html

@@ -9,18 +9,18 @@
   <meta name="robots" content="index, follow">
   <title>About MGZon AI – Our Story</title>
   <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
-  <link rel="apple-touch-icon" href="static/images/mg.svg">
+  <link rel="apple-touch-icon" href="/static/images/mg.svg">
   <!-- Open Graph -->
   <meta property="og:title" content="About MGZon AI – Our Story">
   <meta property="og:description" content="Learn about MGZon AI, its founder Mark Al-Asfar, and our mission to innovate in AI and e-commerce.">
-  <meta property="og:image" content="static/images/mg.svg">
+  <meta property="og:image" content="/static/images/mg.svg">
   <meta property="og:url" content="https://mgzon-mgzon-app.hf.space/about">
   <meta property="og:type" content="website">
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="About MGZon AI – Our Story">
   <meta name="twitter:description" content="Learn about MGZon AI, its founder Mark Al-Asfar, and our mission to innovate in AI and e-commerce.">
-  <meta name="twitter:image" content="static/images/mg.svg">
+  <meta name="twitter:image" content="/static/images/mg.svg">
   <!-- JSON-LD -->
 <script type="application/ld+json">
 {
@@ -28,7 +28,7 @@
   "@type": "Organization",
   "name": "MGZon AI",
   "url": "https://mgzon-mgzon-app.hf.space",
-  "logo": "static/images/mg.svg",
+  "logo": "/static/images/mg.svg",
   "founder": {
     "@type": "Person",
     "name": "Mark Al-Asfar",
@@ -99,7 +99,7 @@
   <!-- Sidebar -->
   <aside id="sidebar" class="sidebar fixed inset-y-0 left-0 w-64 bg-gradient-to-b from-teal-800 to-emerald-900 p-6 flex flex-col overflow-y-auto z-40">
     <button id="closeSidebar" class="md:hidden text-white text-2xl absolute top-4 right-4" aria-label="Close sidebar">✕</button>
-    <img src="static/images/mg.svg" alt="MGZon Logo" class="logo w-20 h-20 mx-auto mb-8 animate-pulse">
+    <img src="/static/images/mg.svg" alt="MGZon Logo" class="logo w-20 h-20 mx-auto mb-8 animate-pulse">
     <nav class="flex flex-col gap-3">
       <a href="/" class="px-4 py-2 rounded-lg hover:bg-emerald-600 transition">Home</a>
       <a href="/docs" class="px-4 py-2 rounded-lg hover:bg-emerald-600 transition">API Documentation</a>
@@ -114,7 +114,7 @@
   <main class="flex-1 md:ml-64 p-6 main-content">
     <section class="container max-w-6xl mx-auto">
       <div class="text-center py-12">
-        <img src="static/images/mg.svg" alt="MGZon Logo" class="w-32 h-32 mx-auto mb-6 animate-bounce">
+        <img src="/static/images/mg.svg" alt="MGZon Logo" class="w-32 h-32 mx-auto mb-6 animate-bounce">
         <h1 class="text-5xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-teal-300 to-emerald-400">About MGZon AI</h1>
         <p class="text-lg max-w-2xl mx-auto mb-8">Founded by Mark Al-Asfar in Alexandria, Egypt, MGZon AI is revolutionizing e-commerce and coding with AI-driven solutions.</p>
       </div>
@@ -130,7 +130,7 @@
       <section class="my-12">
         <h2 class="text-3xl font-bold text-center mb-8">Meet Our Founder</h2>
         <div class="glass p-6 text-center">
-          <img src="static/images/mg.svg" alt="Mark Al-Asfar" class="w-24 h-24 mx-auto mb-4 rounded-full">
+          <img src="/static/images/mg.svg" alt="Mark Al-Asfar" class="w-24 h-24 mx-auto mb-4 rounded-full">
           <h3 class="text-xl font-semibold mb-2">Mark Al-Asfar</h3>
           <p class="mb-4">A visionary developer from Alexandria, Mark Al-Asfar founded MGZon AI to bridge the gap between AI innovation and practical applications in coding and e-commerce.</p>
           <a href="https://mark-elasfar.web.app/" target="_blank" class="text-emerald-300 hover:underline">Learn More About Mark</a>
@@ -178,7 +178,7 @@
   <!-- Footer -->
   <footer class="bg-gradient-to-r from-teal-900 to-emerald-900 py-12 mt-8">
     <div class="container max-w-6xl mx-auto text-center">
-      <img src="static/images/mg.svg" alt="MGZon Logo" class="w-24 h-24 mx-auto mb-6 animate-pulse">
+      <img src="/static/images/mg.svg" alt="MGZon Logo" class="w-24 h-24 mx-auto mb-6 animate-pulse">
       <p class="mb-4">
         Developed by <a href="https://mark-elasfar.web.app/" target="_blank" class="text-emerald-300 hover:underline">Mark Al-Asfar</a>
         | Powered by <a href="https://hager-zon.vercel.app/" target="_blank" class="text-emerald-300 hover:underline">MGZon AI</a>

templates/chat.html

@@ -9,18 +9,18 @@
   <meta name="robots" content="index, follow" />
   <title>MGZon Chatbot – AI Assistant</title>
   <link rel="icon" type="image/x-icon" href="/static/favicon.ico" />
-  <link rel="apple-touch-icon" href="static/images/mg.svg" />
+  <link rel="apple-touch-icon" href="/static/images/mg.svg" />
   <!-- Open Graph -->
   <meta property="og:title" content="MGZon Chatbot – AI Assistant" />
   <meta property="og:description" content="Chat with MGZon Chatbot for coding, analysis, and e-commerce queries with text, image, and audio support." />
-  <meta property="og:image" content="static/images/mg.svg" />
+  <meta property="og:image" content="/static/images/mg.svg" />
   <meta property="og:url" content="https://mgzon-mgzon-app.hf.space/chat" />
   <meta property="og:type" content="website" />
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image" />
   <meta name="twitter:title" content="MGZon Chatbot – AI Assistant" />
   <meta name="twitter:description" content="Chat with MGZon Chatbot for coding, analysis, and e-commerce queries with text, image, and audio support." />
-  <meta name="twitter:image" content="static/images/mg.svg
+  <meta name="twitter:image" content="/static/images/mg.svg
 
 " />
   <!-- JSON-LD -->
@@ -39,7 +39,7 @@
 </head>
 <body>
   <div id="mainHeader" style="display: flex; align-items: center; justify-content: center; padding: 20px;">
-    <img src="static/images/mg.svg" alt="MGZon Logo" style="width: 100px; margin-bottom: 10px;">
+    <img src="/static/images/mg.svg" alt="MGZon Logo" style="width: 100px; margin-bottom: 10px;">
     <h1>MGZon Chatbot</h1>
   </div>
   <div id="chatHeader" style="display: none;" aria-hidden="true">

templates/docs.html

@@ -9,18 +9,18 @@
   <meta name="robots" content="index, follow">
   <title>API Documentation - MGZon Chatbot</title>
   <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
-  <link rel="apple-touch-icon" href="static/images/mg.svg">
+  <link rel="apple-touch-icon" href="/static/images/mg.svg">
   <!-- Open Graph -->
   <meta property="og:title" content="API Documentation - MGZon Chatbot">
   <meta property="og:description" content="Explore MGZon Chatbot API documentation for integrating AI-powered code generation and e-commerce tools.">
-  <meta property="og:image" content="static/images/mg.svg">
+  <meta property="og:image" content="/static/images/mg.svg">
   <meta property="og:url" content="https://mgzon-mgzon-app.hf.space/docs">
   <meta property="og:type" content="website">
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="API Documentation - MGZon Chatbot">
   <meta name="twitter:description" content="Explore MGZon Chatbot API documentation for integrating AI-powered code generation and e-commerce tools.">
-  <meta name="twitter:image" content="https://raw.githubusercontent.com/Mark-Lasfar/MGZon/main/public/icons/mg.svg">
+  <meta name="twitter:image" content="/static/images/mg.svg">
   <!-- JSON-LD -->
 <script type="application/ld+json">
 {
@@ -96,7 +96,7 @@
   <!-- Sidebar -->
   <aside id="sidebar" class="sidebar fixed inset-y-0 left-0 w-64 bg-gradient-to-b from-teal-800 to-emerald-900 p-6 flex flex-col overflow-y-auto z-40">
     <button id="closeSidebar" class="md:hidden text-white text-2xl absolute top-4 right-4" aria-label="Close sidebar">✕</button>
-    <img src="static/images/mg.svg" alt="MGZon Logo" class="logo w-20 h-20 mx-auto mb-8 animate-pulse">
+    <img src="/static/images/mg.svg" alt="MGZon Logo" class="logo w-20 h-20 mx-auto mb-8 animate-pulse">
     <nav class="flex flex-col gap-3">
       <a href="/" class="px-4 py-2 rounded-lg hover:bg-emerald-600 transition">Home</a>
       <a href="/docs" class="px-4 py-2 rounded-lg bg-emerald-600">API Documentation</a>
@@ -111,7 +111,7 @@
   <main class="flex-1 md:ml-64 p-6 main-content">
     <section class="container max-w-6xl mx-auto">
       <div class="text-center py-12">
-        <img src="static/images/mg.svg" alt="MGZon Logo" class="w-32 h-32 mx-auto mb-6 animate-bounce">
+        <img src="/static/images/mg.svg" alt="MGZon Logo" class="w-32 h-32 mx-auto mb-6 animate-bounce">
 <h1 class="text-5xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-teal-300 to-emerald-400">About MGZon AI by Mark Al-Asfar</h1>
           MGZon Chatbot API Documentation
         </h1>
@@ -183,7 +183,7 @@ curl -X POST "https://mgzon-mgzon-app.hf.space/web_search" \
   <!-- Footer -->
   <footer class="bg-gradient-to-r from-teal-900 to-emerald-900 py-12 mt-8">
     <div class="container max-w-6xl mx-auto text-center">
-<img src="static/images/mg.svg" alt="MGZon Chatbot Logo by Mark Al-Asfar" class="w-32 h-32 mx-auto mb-6 animate-bounce">
+<img src="/static/images/mg.svg" alt="MGZon Chatbot Logo by Mark Al-Asfar" class="w-32 h-32 mx-auto mb-6 animate-bounce">
       <p class="mb-4">
         Developed by <a href="https://mark-elasfar.web.app/" target="_blank" class="text-emerald-300 hover:underline">Mark Al-Asfar</a>
         | Powered by <a href="https://hager-zon.vercel.app/" target="_blank" class="text-emerald-300 hover:underline">MGZon AI</a>

templates/index.html

@@ -10,18 +10,18 @@ United States, FastAPI, Gradio">
   <meta name="robots" content="index, follow">
   <title>MGZon Chatbot – Powered by AI</title>
   <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
-  <link rel="apple-touch-icon" href="static/images/mg.svg">
+  <link rel="apple-touch-icon" href="/static/images/mg.svg">
   <!-- Open Graph -->
   <meta property="og:title" content="MGZon Chatbot – AI-Powered Solutions">
   <meta property="og:description" content="Explore MGZon Chatbot for code generation, web search, and e-commerce solutions by Mark Al-Asfar.">
-  <meta property="og:image" content="static/images/mg.svg">
+  <meta property="og:image" content="/static/images/mg.svg">
   <meta property="og:url" content="https://mgzon-mgzon-app.hf.space/">
   <meta property="og:type" content="website">
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="MGZon Chatbot – AI-Powered Solutions">
   <meta name="twitter:description" content="Explore MGZon Chatbot for code generation, web search, and e-commerce solutions by Mark Al-Asfar.">
-  <meta name="twitter:image" content="static/images/mg.svg">
+  <meta name="twitter:image" content="/static/images/mg.svg">
   <!-- JSON-LD -->
 <script type="application/ld+json">
 {
@@ -41,7 +41,7 @@ United States, FastAPI, Gradio">
     "name": "MGZon AI",
     "logo": {
       "@type": "ImageObject",
-      "url": "static/images/mg.svg"
+      "url": "/static/images/mg.svg"
     }
   }
 }
@@ -118,7 +118,7 @@ United States, FastAPI, Gradio">
   <!-- Sidebar -->
   <aside id="sidebar" class="sidebar fixed inset-y-0 left-0 w-64 bg-gradient-to-b from-teal-800 to-emerald-900 p-6 flex flex-col overflow-y-auto z-40">
     <button id="closeSidebar" class="md:hidden text-white text-2xl absolute top-4 right-4" aria-label="Close sidebar">✕</button>
-    <img src="static/images/mg.svg" alt="MGZon Logo" class="logo w-20 h-20 mx-auto mb-8 animate-pulse">
+    <img src="/static/images/mg.svg" alt="MGZon Logo" class="logo w-20 h-20 mx-auto mb-8 animate-pulse">
     <nav class="flex flex-col gap-3">
       <a href="/" class="px-4 py-2 rounded-lg bg-emerald-600">Home</a>
       <a href="/docs" class="px-4 py-2 rounded-lg hover:bg-emerald-600 transition">API Documentation</a>
@@ -134,7 +134,7 @@ United States, FastAPI, Gradio">
     <section class="container max-w-6xl mx-auto">
       <!-- Hero -->
       <div class="text-center py-12">
-        <img src="static/images/mg.svg" alt="MGZon Logo" class="w-32 h-32 mx-auto mb-6 animate-bounce">
+        <img src="/static/images/mg.svg" alt="MGZon Logo" class="w-32 h-32 mx-auto mb-6 animate-bounce">
         <h1 class="text-5xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-teal-300 to-emerald-400">
           Welcome to MGZon Chatbot 🚀
         </h1>
@@ -235,7 +235,7 @@ United States. Ready to code smarter and shop better?
   <!-- Footer -->
   <footer class="bg-gradient-to-r from-teal-900 to-emerald-900 py-12 mt-8">
     <div class="container max-w-6xl mx-auto text-center">
-     <img src="static/images/mg.svg" alt="MGZon Chatbot Logo by Mark Al-Asfar" class="w-32 h-32 mx-auto mb-6 animate-bounce">
+     <img src="/static/images/mg.svg" alt="MGZon Chatbot Logo by Mark Al-Asfar" class="w-32 h-32 mx-auto mb-6 animate-bounce">
       <p class="mb-4">
         Developed by <a href="https://mark-elasfar.web.app/" target="_blank" class="text-emerald-300 hover:underline">Mark Al-Asfar</a>
         | Powered by <a href="https://hager-zon.vercel.app/" target="_blank" class="text-emerald-300 hover:underline">MGZon AI</a>

templates/login.html

@@ -9,18 +9,18 @@
   <meta name="robots" content="index, follow">
   <title>Login - MGZon Chatbot</title>
   <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
-  <link rel="apple-touch-icon" href="static/images/mg.svg">
+  <link rel="apple-touch-icon" href="/static/images/mg.svg">
   <!-- Open Graph -->
   <meta property="og:title" content="Login - MGZon Chatbot">
   <meta property="og:description" content="Login to MGZon Chatbot to access AI-powered code generation and e-commerce tools.">
-  <meta property="og:image" content="static/images/mg.svg">
+  <meta property="og:image" content="/static/images/mg.svg">
   <meta property="og:url" content="https://mgzon-mgzon-app.hf.space/login">
   <meta property="og:type" content="website">
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="Login - MGZon Chatbot">
   <meta name="twitter:description" content="Login to MGZon Chatbot to access AI-powered code generation and e-commerce tools.">
-  <meta name="twitter:image" content="static/images/mg.svg">
+  <meta name="twitter:image" content="/static/images/mg.svg">
   <!-- JSON-LD -->
 <script type="application/ld+json">
 {
@@ -82,7 +82,7 @@
 </head>
 <body class="text-white min-h-screen flex flex-col justify-center items-center">
   <div class="container max-w-md mx-auto text-center py-12">
-    <img src="static/images/mg.svg" alt="MGZon Logo" class="w-32 h-32 mx-auto mb-6 animate-bounce">
+    <img src="/static/images/mg.svg" alt="MGZon Logo" class="w-32 h-32 mx-auto mb-6 animate-bounce">
     <h1 class="text-4xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-teal-300 to-emerald-400">
       Login to MGZon Chatbot
     </h1>
@@ -109,7 +109,7 @@
   </div>
   <footer class="bg-gradient-to-r from-teal-900 to-emerald-900 py-12 mt-8 w-full">
     <div class="container max-w-6xl mx-auto text-center">
-      <img src="static/images/mg.svg" alt="MGZon Logo" class="w-24 h-24 mx-auto mb-6 animate-pulse">
+      <img src="/static/images/mg.svg" alt="MGZon Logo" class="w-24 h-24 mx-auto mb-6 animate-pulse">
       <p class="mb-4">
         Developed by <a href="https://mark-elasfar.web.app/" target="_blank" class="text-emerald-300 hover:underline">Mark Al-Asfar</a>
         | Powered by <a href="https://hager-zon.vercel.app/" target="_blank" class="text-emerald-300 hover:underline">MGZon AI</a>

templates/register.html

@@ -9,18 +9,18 @@
   <meta name="robots" content="index, follow">
   <title>Register - MGZon Chatbot</title>
   <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
-  <link rel="apple-touch-icon" href="static/images/mg.svg">
+  <link rel="apple-touch-icon" href="/static/images/mg.svg">
   <!-- Open Graph -->
   <meta property="og:title" content="Register - MGZon Chatbot">
   <meta property="og:description" content="Register for MGZon Chatbot to access AI-powered code generation and e-commerce tools.">
-  <meta property="og:image" content="static/images/mg.svg">
+  <meta property="og:image" content="/static/images/mg.svg">
   <meta property="og:url" content="https://mgzon-mgzon-app.hf.space/register">
   <meta property="og:type" content="website">
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="Register - MGZon Chatbot">
   <meta name="twitter:description" content="Register for MGZon Chatbot to access AI-powered code generation and e-commerce tools.">
-  <meta name="twitter:image" content="static/images/mg.svg">
+  <meta name="twitter:image" content="/static/images/mg.svg">
   <!-- JSON-LD -->
 <script type="application/ld+json">
 {
@@ -77,7 +77,7 @@
 </head>
 <body class="text-white min-h-screen flex flex-col justify-center items-center">
   <div class="container max-w-md mx-auto text-center py-12">
-    <img src="static/images/mg.svg" alt="MGZon Chatbot Logo by Mark Al-Asfar" class="w-32 h-32 mx-auto mb-6 animate-bounce">
+    <img src="/static/images/mg.svg" alt="MGZon Chatbot Logo by Mark Al-Asfar" class="w-32 h-32 mx-auto mb-6 animate-bounce">
     <h1 class="text-4xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-teal-300 to-emerald-400">
       Register for MGZon Chatbot
     </h1>
@@ -105,7 +105,7 @@
   </div>
   <footer class="bg-gradient-to-r from-teal-900 to-emerald-900 py-12 mt-8 w-full">
     <div class="container max-w-6xl mx-auto text-center">
-      <img src="static/images/mg.svg" alt="MGZon Logo" class="w-24 h-24 mx-auto mb-6 animate-pulse">
+      <img src="/static/images/mg.svg" alt="MGZon Logo" class="w-24 h-24 mx-auto mb-6 animate-pulse">
       <p class="mb-4">
         Developed by <a href="https://mark-elasfar.web.app/" target="_blank" class="text-emerald-300 hover:underline">Mark Al-Asfar</a>
         | Powered by <a href="https://hager-zon.vercel.app/" target="_blank" class="text-emerald-300 hover:underline">MGZon AI</a>