Update app.py

app.py

@@ -6,7 +6,6 @@ import random
 import numpy as np
 import os
 
-# GPU 사용 가능 여부 확인
 if torch.cuda.is_available():
     device = "cuda"
     print("GPU를 사용합니다")
@@ -14,20 +13,15 @@ else:
     device = "cpu"
     print("CPU를 사용합니다")
 
-# HuggingFace 토큰 로그인
 HF_TOKEN = os.getenv("HF_TOKEN")
-
 MAX_SEED = np.iinfo(np.int32).max
 CACHE_EXAMPLES = torch.cuda.is_available() and os.getenv("CACHE_EXAMPLES", "0") == "1"
 
-# 파이프라인 초기화 및 모델 다운로드
 pipe = FluxPipeline.from_pretrained("black-forest-labs/FLUX.1-dev", torch_dtype=torch.bfloat16)
 pipe.to(device)
 
-# 이미지 생성 함수 정의
 @spaces.GPU(duration=160)
 def generate_image(prompt, num_inference_steps, height, width, guidance_scale, seed, num_images_per_prompt, progress=gr.Progress(track_tqdm=True)):
-    # 시드가 0이거나 None이면 랜덤 시드 사용
     if seed is None or seed == 0:
         seed = random.randint(1, MAX_SEED)
     
@@ -46,31 +40,27 @@ def generate_image(prompt, num_inference_steps, height, width, guidance_scale, s
     
     return output
 
-# 랜덤 시드 생성 함수
 def random_seed():
     return random.randint(1, MAX_SEED)
 
 def create_random_seed():
     new_seed = random_seed()
-    return [gr.Number.update(value=new_seed), f'현재 시드: {new_seed}']
+    return [gr.Number.update(value=new_seed), f"현재 시드: {new_seed}"]
 
-# 예제 프롬프트
 examples = [
     ["A cat holding a sign that says hello world"],
     ["a tiny astronaut hatching from an egg on the moon"],
     ["An astronaut on mars in a futuristic cyborg suit"],
 ]
 
-css = '''
+css = """
 .gradio-container {
     max-width: 1400px !important;
     margin: auto;
 }
-/* 이미지 크기 조정 */
 .image-container img {
     max-height: 600px !important;
 }
-/* 이미지 슬라이더 크기 조정 */
 .image-slider {
     height: 600px !important;
     max-height: 600px !important;
@@ -148,20 +138,31 @@ h1 {
     overflow: hidden;
     border: 2px solid #F3F4F6;
 }
-/* 랜덤 시드 버튼 스타일 */
-button.gr-button.gr-button-lg {
-    border-radius: 8px;
-    font-weight: 500;
-    transition: all 0.2s;
+.seed-button {
+    background-color: #F3F4F6 !important;
+    color: #374151 !important;
+    border: 1px solid #E5E7EB !important;
+    border-radius: 8px !important;
+    padding: 8px 16px !important;
+    font-size: 0.9rem !important;
+    font-weight: 500 !important;
+    transition: all 0.2s ease-in-out !important;
 }
-button.gr-button.gr-button-lg:hover {
+.seed-button:hover {
+    background-color: #E5E7EB !important;
     transform: translateY(-1px);
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+.seed-text {
+    font-family: 'Pretendard', sans-serif;
+    color: #4B5563;
+    font-size: 0.9rem;
+    margin: 0;
+    line-height: 2.5;
+    font-weight: 500;
 }
-"""
 """
 
-# Gradio 인터페이스 생성
 with gr.Blocks(
     theme=gr.themes.Soft(
         primary_hue=gr.themes.Color(
@@ -202,10 +203,11 @@ with gr.Blocks(
                 placeholder="고양이..."
             )
             run_button = gr.Button("생성하기", variant="primary")
-        result = gr.Gallery(
-            label="생성된 AI 이미지",
-            elem_id="gallery"
-        )
+            result = gr.Gallery(
+                label="생성된 AI 이미지",
+                elem_id="gallery",
+                elem_classes="image-container"
+            )
     
     with gr.Accordion("고급 설정", open=False):
         with gr.Row():
@@ -266,10 +268,10 @@ with gr.Blocks(
                 minimum=0,
                 maximum=MAX_SEED,
                 step=1,
-                visible=False  # 숨김 처리
+                visible=False
             )
-            seed_button = gr.Button('🔄 새로운 시드 생성', size='sm', elem_classes='seed-button')
-            seed_text = gr.Markdown('', elem_classes='seed-text')
+            seed_button = gr.Button("🔄 새로운 시드 생성", size="sm", elem_classes="seed-button")
+            seed_text = gr.Markdown("", elem_classes="seed-text")
             
             num_images_per_prompt = gr.Slider(
                 label="프롬프트당 이미지 수",
@@ -303,15 +305,14 @@ with gr.Blocks(
         outputs=[result],
     )
 
-    # Footer at the bottom
     gr.HTML(
         """
-        <div class='footer-content'>
-            <p style='font-size: 1.1rem; font-weight: 500; color: #1F2937;'>끝장AI가 제공하는 고급 AI 도구를 더 경험하고 싶으신가요?</p>
-            <a href='https://finalendai.com' target='_blank' class='visit-button' style='color: white !important;'>
+        <div class="footer-content">
+            <p style="font-size: 1.1rem; font-weight: 500; color: #1F2937;">끝장AI가 제공하는 고급 AI 도구를 더 경험하고 싶으신가요?</p>
+            <a href="https://finalendai.com" target="_blank" class="visit-button">
                 끝장AI 방문하기
             </a>
-            <p style='margin-top: 1.5rem; color: #6B7280; font-size: 0.9rem;'>
+            <p style="margin-top: 1.5rem; color: #6B7280; font-size: 0.9rem;">
                 © 2024 끝장AI. All rights reserved.
             </p>
         </div>