fsadeek commited on
Commit
430f6e9
·
1 Parent(s): 8a0ab5b

Changed the HTML and CSS

Browse files
Files changed (2) hide show
  1. app.py +54 -13
  2. index.html +30 -0
app.py CHANGED
@@ -1,13 +1,11 @@
1
  import gradio as gr
2
  import numpy as np
3
  import random
4
-
5
- # import spaces #[uncomment to use ZeroGPU]
6
  from diffusers import DiffusionPipeline
7
  import torch
8
 
9
  device = "cuda" if torch.cuda.is_available() else "cpu"
10
- model_repo_id = "stabilityai/sdxl-turbo" # Replace to the model you would like to use
11
 
12
  if torch.cuda.is_available():
13
  torch_dtype = torch.float16
@@ -20,8 +18,6 @@ pipe = pipe.to(device)
20
  MAX_SEED = np.iinfo(np.int32).max
21
  MAX_IMAGE_SIZE = 1024
22
 
23
-
24
- # @spaces.GPU #[uncomment to use ZeroGPU]
25
  def infer(
26
  prompt,
27
  negative_prompt,
@@ -50,7 +46,6 @@ def infer(
50
 
51
  return image, seed
52
 
53
-
54
  examples = [
55
  "Astronaut in a jungle, cold color palette, muted colors, detailed, 8k",
56
  "An astronaut riding a green horse",
@@ -61,12 +56,59 @@ css = """
61
  #col-container {
62
  margin: 0 auto;
63
  max-width: 640px;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
64
  }
65
  """
66
 
67
  with gr.Blocks(css=css) as demo:
68
  with gr.Column(elem_id="col-container"):
69
- gr.Markdown(" # Text-to-Image Gradio Template")
70
 
71
  with gr.Row():
72
  prompt = gr.Text(
@@ -105,7 +147,7 @@ with gr.Blocks(css=css) as demo:
105
  minimum=256,
106
  maximum=MAX_IMAGE_SIZE,
107
  step=32,
108
- value=1024, # Replace with defaults that work for your model
109
  )
110
 
111
  height = gr.Slider(
@@ -113,7 +155,7 @@ with gr.Blocks(css=css) as demo:
113
  minimum=256,
114
  maximum=MAX_IMAGE_SIZE,
115
  step=32,
116
- value=1024, # Replace with defaults that work for your model
117
  )
118
 
119
  with gr.Row():
@@ -122,7 +164,7 @@ with gr.Blocks(css=css) as demo:
122
  minimum=0.0,
123
  maximum=10.0,
124
  step=0.1,
125
- value=0.0, # Replace with defaults that work for your model
126
  )
127
 
128
  num_inference_steps = gr.Slider(
@@ -130,7 +172,7 @@ with gr.Blocks(css=css) as demo:
130
  minimum=1,
131
  maximum=50,
132
  step=1,
133
- value=2, # Replace with defaults that work for your model
134
  )
135
 
136
  gr.Examples(examples=examples, inputs=[prompt])
@@ -151,5 +193,4 @@ with gr.Blocks(css=css) as demo:
151
  )
152
 
153
  if __name__ == "__main__":
154
- demo.launch()
155
- ## Added a comment
 
1
  import gradio as gr
2
  import numpy as np
3
  import random
 
 
4
  from diffusers import DiffusionPipeline
5
  import torch
6
 
7
  device = "cuda" if torch.cuda.is_available() else "cpu"
8
+ model_repo_id = "stabilityai/sdxl-turbo"
9
 
10
  if torch.cuda.is_available():
11
  torch_dtype = torch.float16
 
18
  MAX_SEED = np.iinfo(np.int32).max
19
  MAX_IMAGE_SIZE = 1024
20
 
 
 
21
  def infer(
22
  prompt,
23
  negative_prompt,
 
46
 
47
  return image, seed
48
 
 
49
  examples = [
50
  "Astronaut in a jungle, cold color palette, muted colors, detailed, 8k",
51
  "An astronaut riding a green horse",
 
56
  #col-container {
57
  margin: 0 auto;
58
  max-width: 640px;
59
+ background-color: #f9f9f9;
60
+ border-radius: 10px;
61
+ padding: 20px;
62
+ box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
63
+ }
64
+
65
+ h1 {
66
+ color: #333;
67
+ font-family: 'Arial', sans-serif;
68
+ }
69
+
70
+ input, .gr-button {
71
+ border-radius: 5px;
72
+ border: 1px solid #ccc;
73
+ padding: 10px;
74
+ font-size: 14px;
75
+ }
76
+
77
+ input:focus, .gr-button:focus {
78
+ border-color: #007bff;
79
+ outline: none;
80
+ }
81
+
82
+ .gr-button {
83
+ background-color: #007bff;
84
+ color: white;
85
+ transition: background-color 0.3s;
86
+ }
87
+
88
+ .gr-button:hover {
89
+ background-color: #0056b3;
90
+ }
91
+
92
+ .accordion-header {
93
+ background-color: #e9ecef;
94
+ border-radius: 5px;
95
+ padding: 10px;
96
+ }
97
+
98
+ .accordion-content {
99
+ background-color: #fff;
100
+ border: 1px solid #ccc;
101
+ border-radius: 5px;
102
+ }
103
+
104
+ .gr-slider {
105
+ margin-top: 10px;
106
  }
107
  """
108
 
109
  with gr.Blocks(css=css) as demo:
110
  with gr.Column(elem_id="col-container"):
111
+ gr.Markdown("<h1>Text-to-Image Gradio Template</h1>")
112
 
113
  with gr.Row():
114
  prompt = gr.Text(
 
147
  minimum=256,
148
  maximum=MAX_IMAGE_SIZE,
149
  step=32,
150
+ value=1024,
151
  )
152
 
153
  height = gr.Slider(
 
155
  minimum=256,
156
  maximum=MAX_IMAGE_SIZE,
157
  step=32,
158
+ value=1024,
159
  )
160
 
161
  with gr.Row():
 
164
  minimum=0.0,
165
  maximum=10.0,
166
  step=0.1,
167
+ value=0.0,
168
  )
169
 
170
  num_inference_steps = gr.Slider(
 
172
  minimum=1,
173
  maximum=50,
174
  step=1,
175
+ value=2,
176
  )
177
 
178
  gr.Examples(examples=examples, inputs=[prompt])
 
193
  )
194
 
195
  if __name__ == "__main__":
196
+ demo.launch()
 
index.html ADDED
@@ -0,0 +1,30 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <meta name="description" content="Embedded content from Pixel Phraser">
8
+ <title>Embedded Pixel Phraser</title>
9
+ <style>
10
+ body {
11
+ margin: 0;
12
+ padding: 0;
13
+ height: 100vh;
14
+ /* Full height */
15
+ }
16
+
17
+ iframe {
18
+ width: 100%;
19
+ height: 100%;
20
+ /* Full height */
21
+ border: none;
22
+ }
23
+ </style>
24
+ </head>
25
+
26
+ <body>
27
+ <iframe src="https://fsadeek-pixelphraser.hf.space" title="Pixel Phraser"></iframe>
28
+ </body>
29
+
30
+ </html>