Upload folder using huggingface_hub

app.py

@@ -0,0 +1,212 @@
+import gradio as gr
+
+def calculate(num1, operation, num2):
+    """Perform calculation based on selected operation."""
+    operations = {
+        "➕ Add": lambda a, b: a + b,
+        "➖ Subtract": lambda a, b: a - b,
+        "✖️ Multiply": lambda a, b: a * b,
+        "➗ Divide": lambda a, b: a / b if b != 0 else None
+    }
+    
+    if operation == "➗ Divide" and num2 == 0:
+        raise gr.Error("Cannot divide by zero!")
+    
+    result = operations[operation](num1, num2)
+    return result
+
+# Custom CSS for mobile-first, modern design
+custom_css = """
+/* Mobile-first responsive design */
+.calculator-container {
+    max-width: 480px;
+    margin: 0 auto;
+    padding: 1rem;
+}
+
+.header-section {
+    text-align: center;
+    margin-bottom: 2rem;
+}
+
+.header-section h1 {
+    font-size: clamp(2rem, 5vw, 2.5rem);
+    font-weight: 700;
+    margin-bottom: 0.5rem;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+}
+
+.calculator-card {
+    background: rgba(255, 255, 255, 0.05);
+    border-radius: 1.5rem;
+    padding: 2rem 1.5rem;
+    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+    backdrop-filter: blur(10px);
+}
+
+/* Input styling */
+.input-group {
+    margin-bottom: 1.5rem;
+}
+
+/* Button styling */
+button.primary {
+    width: 100%;
+    padding: 1rem;
+    font-size: 1.125rem;
+    font-weight: 600;
+    border-radius: 0.75rem;
+    transition: all 0.3s ease;
+}
+
+button.primary:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 8px 16px rgba(102, 126, 234, 0.4);
+}
+
+/* Result display */
+.result-display {
+    font-size: 2rem;
+    font-weight: 700;
+    text-align: center;
+    padding: 1.5rem;
+    background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
+    border-radius: 1rem;
+    margin: 1.5rem 0;
+}
+
+/* Examples section */
+.examples-section {
+    margin-top: 2rem;
+    padding-top: 2rem;
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+/* Mobile optimization */
+@media (max-width: 640px) {
+    .calculator-card {
+        padding: 1.5rem 1rem;
+    }
+    
+    .header-section h1 {
+        font-size: 1.75rem;
+    }
+}
+
+/* Smooth transitions */
+* {
+    transition: all 0.2s ease;
+}
+"""
+
+with gr.Blocks(fill_height=True) as demo:
+    gr.HTML("""
+        <div class="header-section">
+            <h1>🧮 Calculator</h1>
+            <p style="color: #888; font-size: 0.95rem;">
+                Simple & elegant calculator built with 
+                <a href="https://huggingface.co/spaces/akhaliq/anycoder" 
+                   target="_blank" 
+                   style="color: #667eea; text-decoration: none; font-weight: 600;">
+                    anycoder
+                </a>
+            </p>
+        </div>
+    """)
+    
+    with gr.Column(elem_classes="calculator-container"):
+        # Input Section
+        num1 = gr.Number(
+            label="First Number",
+            value=0,
+            container=True,
+            scale=1
+        )
+        
+        operation = gr.Radio(
+            choices=["➕ Add", "➖ Subtract", "✖️ Multiply", "➗ Divide"],
+            value="➕ Add",
+            label="Operation",
+            container=True
+        )
+        
+        num2 = gr.Number(
+            label="Second Number",
+            value=0,
+            container=True,
+            scale=1
+        )
+        
+        # Calculate Button
+        calc_btn = gr.Button(
+            "Calculate",
+            variant="primary",
+            size="lg",
+            scale=1
+        )
+        
+        # Result Display
+        result = gr.Number(
+            label="Result",
+            interactive=False,
+            container=True,
+            scale=1,
+            show_label=True
+        )
+        
+        # Examples Section
+        gr.Markdown("### Quick Examples", elem_classes="examples-header")
+        gr.Examples(
+            examples=[
+                [100, "➕ Add", 50],
+                [75, "➖ Subtract", 25],
+                [12, "✖️ Multiply", 8],
+                [144, "➗ Divide", 12],
+            ],
+            inputs=[num1, operation, num2],
+            outputs=result,
+            fn=calculate,
+            cache_examples=False,
+            label=None
+        )
+    
+    # Event Handlers
+    calc_btn.click(
+        fn=calculate,
+        inputs=[num1, operation, num2],
+        outputs=result,
+        api_visibility="public",
+        api_name="calculate"
+    )
+    
+    # Also trigger on Enter key
+    num2.submit(
+        fn=calculate,
+        inputs=[num1, operation, num2],
+        outputs=result
+    )
+
+if __name__ == "__main__":
+    demo.launch(
+        theme=gr.themes.Soft(
+            primary_hue="indigo",
+            secondary_hue="purple",
+            neutral_hue="slate",
+            font=gr.themes.GoogleFont("Inter"),
+            text_size="lg",
+            spacing_size="lg",
+            radius_size="lg"
+        ).set(
+            button_primary_background_fill="linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
+            button_primary_background_fill_hover="linear-gradient(135deg, #5568d3 0%, #6a3f8f 100%)",
+            block_title_text_weight="600",
+            block_label_text_weight="500",
+        ),
+        css=custom_css,
+        footer_links=[
+            {"label": "Built with anycoder", "url": "https://huggingface.co/spaces/akhaliq/anycoder"}
+        ]
+    )

requirements.txt

@@ -0,0 +1,3 @@
+gradio>=6.0
+requests
+Pillow