| import gradio as gr | |
| def generate_landing_page(title, header_font, body_font, primary_color, secondary_color, paragraphs, image_descriptions): | |
| html_content = f""" | |
| <!DOCTYPE html> | |
| <html lang='en'> | |
| <head> | |
| <meta charset='UTF-8'> | |
| <meta name='viewport' content='width=device-width, initial-scale=1.0'> | |
| <title>{title}</title> | |
| <link href='https://fonts.googleapis.com/css2?family={header_font.replace(" ", "+")}&display=swap' rel='stylesheet'> | |
| <link href='https://fonts.googleapis.com/css2?family={body_font.replace(" ", "+")}&display=swap' rel='stylesheet'> | |
| <style> | |
| body {{ font-family: '{body_font}', sans-serif; color: {secondary_color}; background-color: {primary_color}; margin: 0; padding: 20px; }} | |
| h1 {{ font-family: '{header_font}', sans-serif; text-align: center; }} | |
| .content {{ max-width: 800px; margin: auto; }} | |
| .image-box {{ margin-top: 20px; padding: 10px; background: {secondary_color}; color: {primary_color}; border-radius: 10px; }} | |
| </style> | |
| </head> | |
| <body> | |
| <h1>{title}</h1> | |
| <div class='content'> | |
| """ | |
| for para in paragraphs.split(","): | |
| html_content += f"<p>{para.strip()}</p>\n" | |
| for desc in image_descriptions.split(","): | |
| html_content += f"<div class='image-box'><strong>Image:</strong> {desc.strip()}</div>\n" | |
| html_content += """ | |
| </div> | |
| </body> | |
| </html> | |
| """ | |
| return html_content | |
| with gr.Blocks() as demo: | |
| gr.Markdown("## Landing Page Generator") | |
| with gr.Row(): | |
| title = gr.Textbox(label="Landing Page Title") | |
| header_font = gr.Textbox(label="Header Font (Google Font)", value="Roboto Slab") | |
| body_font = gr.Textbox(label="Body Font (Google Font)", value="Open Sans") | |
| with gr.Row(): | |
| primary_color = gr.ColorPicker(label="Primary Color", value="#ffffff") | |
| secondary_color = gr.ColorPicker(label="Secondary Color", value="#333333") | |
| paragraphs = gr.Textbox(label="Enter 10 paragraphs (comma-separated)") | |
| image_descriptions = gr.Textbox(label="Enter 10 image descriptions (comma-separated)") | |
| generate_button = gr.Button("Generate Landing Page") | |
| output_html = gr.Code(label="Generated HTML Code") | |
| generate_button.click( | |
| generate_landing_page, | |
| inputs=[title, header_font, body_font, primary_color, secondary_color, paragraphs, image_descriptions], | |
| outputs=output_html | |
| ) | |
| demo.launch() |