Merge pull request #216 from pirogramming/develop

[Test] 배포 환경 테스트

Author: mnjese

static/main/main.css

@@ -1,4 +1,6 @@
-
+.status-bar {
+    height: 10px;
+}
 
 .view {
     height:1%;
@@ -319,5 +321,41 @@
     z-index: 1;
 }
 
-/* 고정 크기 설정 - 반응형 제거 */
-/* 모든 화면 크기에서 동일한 고정 크기 유지 */
+h2{
+    font-family: "Satoshi", Helvetica;
+    font-size: 20px;
+    font-weight: 700;
+    color: #2c3e50;
+    line-height: 1.2;
+    margin-bottom: 8px;
+    text-align: center;
+}
+
+.username-highlight {
+    color: var(--main);
+    font-weight: 800;
+}
+
+.about-healthtant {
+    padding: 32px 20px;
+    text-align: center;
+    margin: 20px;
+    border-top: 1px solid #e0e0e0;
+    padding-top: 40px;
+  }
+  
+  .about-title {
+    font-size: 20px;
+    font-weight: 700;
+    color: #56AAB2;
+    margin-bottom: 12px;
+  }
+  
+  .about-text {
+    font-size: 14px;
+    font-weight: 400;
+    color: #444;
+    line-height: 1.5;
+    text-align: left;
+  }
+  

templates/main/main_mainpage.html

@@ -40,6 +40,9 @@ <h1 class="app-title">HEALTHTANT</h1>
   <div class="view">
     <!-- 추천 제품 롤링배너 영역 -->
     <section class="featured-container">
+      <div class="main-text">
+        <h2><span class="username-highlight">{{ user.username | default:"사용자" }}</span>님을 위한 맞춤 추천</h2>
+      </div>
       {% if foods %}
         <div class="rolling-banner-container">
           <div class="rolling-banner" id="rollingBanner">
@@ -75,6 +78,14 @@ <h1 class="app-title">HEALTHTANT</h1>
         <p style="text-align:center; padding:24px;">표시할 식품이 없습니다.</p>
       {% endif %}
     </section>
+    <section class="about-healthtant">
+      <h2 class="about-title">헬스턴트 서비스란?</h2>
+      <p class="about-text">
+        헬스턴트는 일상 속 식단을 기록하고 분석하여 건강한 생활을 돕는 서비스입니다. 
+        나의 식습관을 데이터로 확인하고, 맞춤형 인사이트를 얻어보세요!
+      </p>
+    </section>
+    
   </div>
 </div>
 {% endblock %}

templates/products/products_detail.html

@@ -53,6 +53,7 @@ <h3>공유하기</h3>
 
     <!-- 메인 컨텐츠 -->
     <main class="product-content">
+      
 
   <!-- 제품 이미지 -->
   <div class="product-image">