File size: 3,274 Bytes
e841ba5
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
import gradio as gr
import modelscope_studio.components.antd as antd
import modelscope_studio.components.base as ms

header_style = {
    "textAlign": 'center',
    "color": '#fff',
    "height": 64,
    "paddingInline": 48,
    "lineHeight": '64px',
    "backgroundColor": '#4096ff',
}

content_style = {
    "textAlign": 'center',
    "minHeight": 120,
    "lineHeight": '120px',
    "color": '#fff',
    "backgroundColor": '#0958d9',
}

sider_style = {
    "textAlign": 'center',
    "lineHeight": '120px',
    "color": '#fff',
    "backgroundColor": '#1677ff',
}

footer_style = {
    "textAlign": 'center',
    "color": '#fff',
    "backgroundColor": '#4096ff',
}

layout_style = {
    "borderRadius": 8,
    "overflow": 'hidden',
    "width": 'calc(50% - 8px)',
    "maxWidth": 'calc(50% - 8px)',
}

with gr.Blocks() as demo:
    with ms.Application():
        with antd.ConfigProvider():
            with antd.Flex(gap="middle", wrap="wrap"):
                with antd.Layout(elem_style=layout_style):
                    with antd.Layout.Header(elem_style=header_style):
                        ms.Text("Header")
                    with antd.Layout.Content(elem_style=content_style):
                        ms.Text("Content")
                    with antd.Layout.Footer(elem_style=footer_style):
                        ms.Text("Footer")
                with antd.Layout(elem_style=layout_style):
                    with antd.Layout.Header(elem_style=header_style):
                        ms.Text("Header")
                    with antd.Layout():
                        with antd.Layout.Sider(width="25%",
                                               elem_style=sider_style):
                            ms.Text("Sider")
                        with antd.Layout.Content(elem_style=content_style):
                            ms.Text("Content")
                    with antd.Layout.Footer(elem_style=footer_style):
                        ms.Text("Footer")
                with antd.Layout(elem_style=layout_style):
                    with antd.Layout.Header(elem_style=header_style):
                        ms.Text("Header")
                    with antd.Layout():
                        with antd.Layout.Content(elem_style=content_style):
                            ms.Text("Content")
                        with antd.Layout.Sider(width="25%",
                                               elem_style=sider_style):
                            ms.Text("Sider")
                    with antd.Layout.Footer(elem_style=footer_style):
                        ms.Text("Footer")
                with antd.Layout(elem_style=layout_style):
                    with antd.Layout.Sider(width="25%",
                                           elem_style=sider_style):
                        ms.Text("Sider")
                    with antd.Layout():
                        with antd.Layout.Header(elem_style=header_style):
                            ms.Text("Header")
                        with antd.Layout.Content(elem_style=content_style):
                            ms.Text("Content")
                        with antd.Layout.Footer(elem_style=footer_style):
                            ms.Text("Footer")
if __name__ == "__main__":
    demo.queue().launch()