pirogramming · borissal1207 · Aug 9, 2026 · Aug 7, 2026 · Aug 8, 2026 · Aug 8, 2026
diff --git a/.gitignore b/.gitignore
@@ -85,4 +85,4 @@ temp/
 
 test_real_api_3subjects.py
 
-.cph/
+.cph/
diff --git a/planner/templates/planner/includes/sidebar.html b/planner/templates/planner/includes/sidebar.html
@@ -1,8 +1,11 @@
+{% load static %}
 {# {% include "planner/includes/sidebar.html" with nav="dashboard" %} #}
 
 <aside class="side">
-  {# 로고를 누르면 사이드바가 접힙니다 (planner.js) #}
-  <button class="brand" id="toggleSide" type="button">PLAN <em>B</em></button>
+  {# 로고를 누르면 사이드바가 접힙니다 (planner.js). 접히면 CSS가 아이콘 부분만 남기고 자릅니다 #}
+  <button class="brand" id="toggleSide" type="button" aria-label="사이드바 접기">
+    <span class="brand-logo"><img src="{% static 'images/logo-lockup.png' %}" alt="PLAN B"></span>
+  </button>
 
   <nav>
     <a class="nav-i {% if nav == 'dashboard' %}on{% endif %}" href="{% url 'planner:dashboard' %}">

diff --git a/static/css/planner.css b/static/css/planner.css
@@ -7,24 +7,29 @@
 
 /* ===== 화면 틀 ===== */
 .app{display:grid;grid-template-columns:220px 1fr;min-height:100vh}
-.app.collapsed{grid-template-columns:0 1fr}
+.app.collapsed{grid-template-columns:56px 1fr}
 
 .side{
   background:var(--neutral1);border-right:1px solid var(--neutral4);
   display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
   padding:0 12px 18px;overflow:hidden;transition:.2s;
 }
-.app.collapsed .side{padding:0;border-right:0}
-.app.collapsed .side>*{display:none}
+.app.collapsed .side{padding:0 8px 18px}
+.app.collapsed .side>*:not(.brand){display:none}
+.app.collapsed .brand{justify-content:center;padding:0;margin:0 -8px 12px}
+.app.collapsed .brand-logo{width:25px}
 
 /* 로고 — 상단바와 같은 높이(60px)라 수평이 맞습니다 */
 .brand{
   height:60px;display:flex;align-items:center;
-  margin:0 -12px 12px;padding:0 22px;
+  margin:0 -12px 12px;padding:0 18px;
   border-bottom:1px solid var(--neutral4);
-  font-size:17px;font-weight:800;color:var(--neutral11);letter-spacing:-0.035em;
 }
-.brand em{font-style:normal;color:var(--brand4);margin-left:5px}
+
+/* logo-lockup.png는 "아이콘+PLAN B" 통짜 이미지입니다.
+   접히면 .brand-logo 폭을 아이콘 폭(25px)만큼만 남기고 나머지는 overflow:hidden으로 자릅니다 */
+.brand-logo{display:block;overflow:hidden;height:28px;width:100px;flex:none;transition:width .2s}
+.brand-logo img{display:block;height:28px;width:auto;max-width:none}
 
 .nav-i{
   display:flex;align-items:center;gap:11px;height:38px;padding:0 10px;

diff --git a/static/images/logo-lockup.png b/static/images/logo-lockup.png
diff --git a/templates/includes/icons.html b/templates/includes/icons.html
@@ -33,6 +33,5 @@
   <symbol id="i-close" viewBox="0 0 24 24"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></symbol>
   <symbol id="i-edit" viewBox="0 0 24 24"><path d="M12 20h9"/><path d="M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4Z"/></symbol>
   <symbol id="i-check" viewBox="0 0 24 24"><path d="M20 6 9 17l-5-5"/></symbol>
-  <symbol id="i-clock" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></symbol>
 
 </defs></svg>
Original file line number	Diff line number	Diff line change
Expand Up		@@ -85,4 +85,4 @@ temp/

		test_real_api_3subjects.py

		.cph/
		.cph/