Update pages/2_information.py

pages/2_information.py

@@ -1,3 +1,9 @@
+# -------------------------------
+# 용어 데이터 (카테고리별, 한글+영문 병기)
+# -------------------------------
+from dashboard_theme.theme import inject
+inject("graphite_gold")
+
 import streamlit as st
 
 st.set_page_config(page_title="Information", layout="wide")
@@ -14,27 +20,27 @@ terms = {
     "금형 부품": {
         "Die (다이)": {
             "description": "프레스 공구의 하부에 위치...",
-            "image": "assets/Drawing.png"   # 👈 여기에 이미지 경로 넣기
+            "image": "assets/Drawing.png"
         },
         "Punch (펀치)": {
             "description": "상부 금형으로 ...",
-            "image": "assets/Drawing.png"   # 👈 여기에 이미지 경로 넣기
+            "image": "assets/Drawing.png"
         },
         "Pad (패드)": {
             "description": "유지 압력을 받는 금형 부품 총칭",
-            "image": None                   # 👈 이미지 없을 때 None
+            "image": None
         },
     },
     "소재": {
         "Blank (블랭크)": {
             "description": "Punch와 Die가 재료판에 작용하여 분리된 결과물",
-            "image": "assets/Drawing.png"   # 👈 여기에 이미지 경로 넣기
+            "image": "assets/Drawing.png"
         },
     },
     "공정": {
         "Blank holder (블랭크 홀더)": {
             "description": "드로잉 금형 또는 포밍 금형의 부품...",
-            "image": "assets/Drawing.png"   # 👈 여기에 이미지 경로 넣기
+            "image": "assets/Drawing.png"
         },
     }
 }
@@ -42,6 +48,28 @@ terms = {
 # 전체 용어 flat dict
 all_terms = {term: data for cat in terms.values() for term, data in cat.items()}
 
+# -------------------------------
+# (중요) 설명 박스 전용 스타일
+# - 테마 패널을 쓰되, 내부 문단 여백만 약간 튜닝
+# -------------------------------
+st.markdown(
+    """
+    <style>
+      .info-panel { margin: 0 0 16px 0; }
+      .info-panel p { margin: 0; line-height: 1.7; font-size: 16px; }
+      /* 만약 밝은 카드가 필요하면 아래 클래스로 사용 (현재는 미사용)
+      .light-card {
+        background:#f9f9f9 !important; color:#1f2937 !important;
+        border:1px solid rgba(0,0,0,.08) !important; border-radius:12px;
+        padding:20px;
+      }
+      .light-card * { color:#1f2937 !important; }
+      */
+    </style>
+    """,
+    unsafe_allow_html=True
+)
+
 # -------------------------------
 # 세션 초기화
 # -------------------------------
@@ -92,15 +120,15 @@ if st.session_state["selected_term"]:
     st.markdown("---")
     st.markdown(f"## 📖 {term}")
 
-    # 👉 좌우 2단 배치
-    col1, col2 = st.columns([2, 1])  # 왼쪽: 설명, 오른쪽: 이미지
+    # 좌(설명) : 우(이미지)
+    col1, col2 = st.columns([2, 1])
 
     with col1:
+        # ✅ 테마의 패널(.panel)을 그대로 사용 → 다크 배경 + 밝은 글자
         st.markdown(
             f"""
-            <div style='background-color:#f9f9f9; padding:20px; border-radius:10px; 
-                        box-shadow: 0 2px 6px rgba(0,0,0,0.1);'>
-                <p style='font-size:16px; color:#333;'>{data["description"]}</p>
+            <div class="panel info-panel">
+                <p>{data["description"]}</p>
             </div>
             """,
             unsafe_allow_html=True
@@ -109,4 +137,3 @@ if st.session_state["selected_term"]:
     with col2:
         if data["image"]:
             st.image(data["image"], use_container_width=True)
-