File size: 3,812 Bytes
0be3d56
 
 
 
 
 
 
 
 
 
 
 
 
 
7b0d64a
 
 
 
 
 
 
 
0be3d56
 
7b0d64a
0be3d56
 
7b0d64a
 
0be3d56
7b0d64a
0be3d56
7b0d64a
 
 
 
 
 
0be3d56
7b0d64a
 
0be3d56
7b0d64a
0be3d56
7b0d64a
 
 
 
 
 
 
 
 
 
 
 
 
 
0be3d56
9b29538
7b0d64a
 
 
 
 
 
 
 
 
 
 
 
 
 
0be3d56
7b0d64a
0be3d56
 
 
 
 
7b0d64a
 
 
 
 
 
 
 
 
 
0be3d56
 
 
 
7b0d64a
9b29538
7b0d64a
9b29538
7b0d64a
 
 
 
 
 
 
 
9b29538
7b0d64a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9b29538
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
import gradio as gr

def calculator(num1, operation, num2):
    if operation == "add":
        return num1 + num2
    elif operation == "subtract":
        return num1 - num2
    elif operation == "multiply":
        return num1 * num2
    elif operation == "divide":
        if num2 == 0:
            raise gr.Error("Cannot divide by zero!")
        return num1 / num2

with gr.Blocks(fill_height=True) as demo:
    gr.Markdown(
        """
        # ๐Ÿงฎ Calculator
        ### Simple & elegant calculator built with [anycoder](https://huggingface.co/spaces/akhaliq/anycoder)
        """,
        elem_classes="header"
    )
    
    with gr.Row():
        with gr.Column(scale=1, min_width=300):
            num1 = gr.Number(
                label="First Number",
                placeholder="0",
                value=0
            )
            
            operation = gr.Radio(
                choices=[
                    ("โž• Add", "add"),
                    ("โž– Subtract", "subtract"),
                    ("โœ–๏ธ Multiply", "multiply"),
                    ("โž— Divide", "divide")
                ],
                value="add",
                label="Operation",
                container=True
            )
            
            num2 = gr.Number(
                label="Second Number",
                placeholder="0",
                value=0
            )
            
            with gr.Row():
                clear_btn = gr.Button("Clear", variant="secondary", size="lg", scale=1)
                calc_btn = gr.Button("Calculate", variant="primary", size="lg", scale=2)
            
            result = gr.Number(
                label="Result",
                interactive=False,
                container=True,
                scale=1
            )
    
    gr.Examples(
        examples=[
            [45, "add", 3],
            [10, "subtract", 5],
            [12, "multiply", 8],
            [100, "divide", 4],
        ],
        inputs=[num1, operation, num2],
        label="Try these examples",
        examples_per_page=4
    )
    
    def clear_all():
        return 0, "add", 0, 0
    
    calc_btn.click(
        fn=calculator,
        inputs=[num1, operation, num2],
        outputs=[result],
        api_visibility="public"
    )
    
    clear_btn.click(
        fn=clear_all,
        inputs=None,
        outputs=[num1, operation, num2, result]
    )
    
    # Allow Enter key to calculate
    num1.submit(calculator, [num1, operation, num2], [result])
    num2.submit(calculator, [num1, operation, num2], [result])

if __name__ == "__main__":
    demo.launch(
        theme=gr.themes.Soft(
            primary_hue="blue",
            secondary_hue="slate",
            neutral_hue="zinc",
            font=gr.themes.GoogleFont("Inter"),
            text_size="lg",
            spacing_size="lg",
            radius_size="lg"
        ).set(
            button_primary_background_fill="*primary_600",
            button_primary_background_fill_hover="*primary_700",
            block_title_text_weight="600",
            block_label_text_weight="500",
        ),
        css="""
        .header {
            text-align: center;
            padding: 1rem 0 2rem 0;
        }
        .header h1 {
            font-size: 2.5rem;
            font-weight: 700;
            margin-bottom: 0.5rem;
        }
        .header h3 {
            font-size: 1rem;
            font-weight: 400;
            color: #64748b;
        }
        @media (max-width: 768px) {
            .header h1 {
                font-size: 2rem;
            }
            .header h3 {
                font-size: 0.9rem;
            }
        }
        """,
        footer_links=[
            {"label": "Built with anycoder", "url": "https://huggingface.co/spaces/akhaliq/anycoder"}
        ]
    )