File size: 3,710 Bytes
071a231
daece9c
 
 
 
 
0fe2df3
837f7f4
0fe2df3
 
 
 
3b59b23
 
0fe2df3
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
5ad721c
 
1801641
 
0f6bdf0
1801641
 
 
0fe2df3
837f7f4
1801641
 
0fe2df3
 
 
635b596
 
 
 
 
 
 
 
0f6bdf0
3b59b23
0f6bdf0
635b596
 
 
 
 
0f6bdf0
635b596
 
389e334
 
 
 
635b596
 
3b59b23
389e334
 
0fe2df3
635b596
837f7f4
aa37d2e
 
0f6bdf0
aa37d2e
 
 
 
 
 
 
ac8140f
aa37d2e
 
 
fc3fde7
aa37d2e
0e2c0cc
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
import os
from typing import Iterable
import gradio as gr
from gradio.themes.base import Base
from gradio.themes.utils import colors, fonts, sizes
import time

class Frosted(Base):
    def __init__(
        self,
        *,
        primary_hue: colors.Color | str = colors.emerald,
        secondary_hue: colors.Color | str = colors.blue,
        neutral_hue: colors.Color | str = colors.blue,
        spacing_size: sizes.Size | str = sizes.spacing_md,
        radius_size: sizes.Size | str = sizes.radius_md,
        text_size: sizes.Size | str = sizes.text_lg,
        font: fonts.Font
        | str
        | Iterable[fonts.Font | str] = (
            fonts.GoogleFont("Quicksand"),
            "ui-sans-serif",
            "sans-serif",
        ),
        font_mono: fonts.Font
        | str
        | Iterable[fonts.Font | str] = (
            fonts.GoogleFont("IBM Plex Mono"),
            "ui-monospace",
            "monospace",
        ),
    ):
        super().__init__(
            primary_hue=primary_hue,
            secondary_hue=secondary_hue,
            neutral_hue=neutral_hue,
            spacing_size=spacing_size,
            radius_size=radius_size,
            text_size=text_size,
            font=font,
            font_mono=font_mono,
        )
        super().set(
            body_background_fill="rgba(255, 255, 255, 0.8)",
            body_background_fill_dark="rgba(0, 0, 0, 0.8)",
            button_primary_background_fill="rgba(255, 255, 255, 0.6)",
            button_primary_background_fill_hover="rgba(255, 255, 255, 0.8)",
            button_primary_text_color="black",
            button_primary_background_fill_dark="rgba(0, 0, 0, 0.6)",
            slider_color="rgba(0, 0, 0, 0.3)",
            slider_color_dark="rgba(255, 255, 255, 0.3)",
            block_title_text_weight="600",
            block_border_width="1px",
            block_shadow="0 4px 30px rgba(0, 0, 0, 0.1)",
            button_shadow="0 4px 30px rgba(0, 0, 0, 0.1)",
            button_large_padding="32px",
        )

    def apply_custom_css(self):
        custom_css = """
            .gradio-container {
                backdrop-filter: blur(10px);
                -webkit-backdrop-filter: blur(10px);
                border-radius: 10px;
                border: 1px solid rgba(255, 255, 255, 0.3);
                background: rgba(255, 255, 255, 0.3);
                background-image: url('static/back.png');
                background-size: cover;
                color: black;
            }
            .gr-button {
                backdrop-filter: blur(5px);
                -webkit-backdrop-filter: blur(5px);
                background: rgba(255, 255, 255, 0.4);
                color: black;
            }
        """
        # Create the directory if it doesn't exist
        os.makedirs("static", exist_ok=True)
        
        # Write the CSS to the file
        with open("static/custom.css", "w") as f:
            f.write(custom_css)

        # Ensure the CSS file is included in your Gradio app
        # This might involve serving the file and referencing it in your Gradio interface

# Create an instance of the Frosted theme and apply the custom CSS
frosted = Frosted()
frosted.apply_custom_css()

with gr.Blocks(theme=frosted, css_file="static/custom.css") as demo:
    textbox = gr.Textbox(label="Name")
    slider = gr.Slider(label="Count", minimum=0, maximum=100, step=1)
    with gr.Row():
        button = gr.Button("Submit", variant="primary")
        clear = gr.Button("Clear")
    output = gr.Textbox(label="Output")

    def repeat(name, count):
        time.sleep(3)
        return name * count

    button.click(repeat, [textbox, slider], output)

demo.launch()