Update constants.py

constants.py

@@ -51,11 +51,33 @@ SEARCH_START = "<<<<<<< SEARCH"
 DIVIDER = "======="
 REPLACE_END = ">>>>>>> REPLACE"
 
-# System prompts
-HTML_SYSTEM_PROMPT = """ONLY USE HTML, CSS AND JAVASCRIPT. ... Always output only the HTML code inside a ```html ... ``` code block."""
-
-TRANSFORMERS_JS_SYSTEM_PROMPT = """You are an expert web developer creating a transformers.js application. ... Always output only the three code blocks as shown above, and do not include any explanations or extra text."""
+# Configuration
+HTML_SYSTEM_PROMPT = """ONLY USE HTML, CSS AND JAVASCRIPT. If you want to use ICON make sure to import the library first. Try to create the best UI possible by using only HTML, CSS and JAVASCRIPT. MAKE IT RESPONSIVE USING MODERN CSS. Use as much as you can modern CSS for the styling, if you can't do something with modern CSS, then use custom CSS. Also, try to elaborate as much as you can, to create something unique. ALWAYS GIVE THE RESPONSE INTO A SINGLE HTML FILE
+For website redesign tasks:
+- Use the provided original HTML code as the starting point for redesign
+- Preserve all original content, structure, and functionality
+- Keep the same semantic HTML structure but enhance the styling
+- Reuse all original images and their URLs from the HTML code
+- Create a modern, responsive design with improved typography and spacing
+- Use modern CSS frameworks and design patterns
+- Ensure accessibility and mobile responsiveness
+- Maintain the same navigation and user flow
+- Enhance the visual design while keeping the original layout structure
+If an image is provided, analyze it and use the visual information to better understand the user's requirements.
+Always respond with code that can be executed or rendered directly.
+Always output only the HTML code inside a ```html ... ``` code block, and do not include any explanations or extra text. Do NOT add the language name at the top of the code output."""
 
+TRANSFORMERS_JS_SYSTEM_PROMPT = """You are an expert web developer creating a transformers.js application. You will generate THREE separate files: index.html, index.js, and style.css.
+IMPORTANT: You MUST output ALL THREE files in the following format:
+```html
+<!-- index.html content here -->
+```
+```javascript
+// index.js content here
+```
+```css
+/* style.css content here */
+```
 # Available HF models for code generation
 AVAILABLE_MODELS = [
     {"name": "Moonshot Kimi-K2", "id": "moonshotai/Kimi-K2-Instruct", "description": "Moonshot AI Kimi-K2-Instruct model"},